@valtimo/components 12.2.1 → 12.3.1

package/assets/css/compatibility.scss

@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 
+@import './formio-carbon';
+
 /* Carbon */
 
 body {
@@ -157,13 +159,6 @@ valtimo-modal {
     valtimo-searchable-dropdown-select h5 {
       color: var(--cds-text-secondary) !important;
     }
-
-    .formio-component-textfield input {
-      background-color: var(--cds-field-02) !important;
-      border: none !important;
-      border-bottom: 1px solid var(--cds-border-strong) !important;
-      border-radius: 0;
-    }
   }
 }
 
@@ -368,13 +363,6 @@ label.col-form-label {
   color: var(--cds-text-secondary) !important;
 }
 
-input {
-  &.form-control {
-    border: 1px solid var(--cds-border-subtle) !important;
-    background-color: var(--cds-field-02) !important;
-  }
-}
-
 .table.table-striped {
   background-color: var(--cds-layer-accent);
   font-weight: 700;
@@ -400,9 +388,6 @@ valtimo-list {
   .search-holder {
     border-bottom: 1px solid var(--cds-border-subtle) !important;
   }
-  input.form-control {
-    border: 1px solid var(--cds-border-subtle);
-  }
   .container-fluid {
     background-color: var(--cds-layer);
   }
@@ -575,12 +560,6 @@ valtimo-dossier-assign-user {
     font-size: 1rem !important;
   }
 
-  .form-control {
-    font-size: 1rem;
-    height: 2.5rem;
-    padding: 4px 12px;
-  }
-
   label {
     margin-bottom: 8px !important;
   }
@@ -711,14 +690,6 @@ valtimo-dossier-widgets-container {
   }
 }
 
-.formio-component-textField,
-.form-control {
-  color: var(--cds-text-secondary) !important;
-  input::placeholder {
-    color: var(--cds-text-secondary) !important;
-  }
-}
-
 valtimo-form-link-process-diagram,
 valtimo-analyse-process-diagram {
   .container-fluid {
@@ -731,3 +702,13 @@ valtimo-analyse-process-diagram {
     background-color: var(--cds-field) !important;
   }
 }
+
+/* Below overrides fix position of overlay elements like select boxes inside cds modals */
+
+.cds--modal-container {
+  transform: none !important;
+}
+
+.cds--modal-header {
+  position: relative !important;
+}