style: Fix text fields and select spacing

maicol07 · Aug 10, 2023 · 587abdc · 587abdc
1 parent 3f58173
commit 587abdc
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/data-table/lib/_data-table.scss b/data-table/lib/_data-table.scss
@@ -16,7 +16,8 @@ $_custom-property-prefix: 'data-table';
     @each $token, $value in $tokens {
       --_#{$token}: #{$value};
     }
-    --_pagination-outlined-select-field-container-padding-vertical: var(--md-data-table-pagination-outlined-select-field-container-padding-vertical, 6px);
+    --_pagination-outlined-select-field-top-space: var(--md-data-table-pagination-outlined-select-field-top-space, 6px);
+    --_pagination-outlined-select-field-bottom-space: var(--md-data-table-pagination-outlined-select-field-bottom-space, 6px);
   }
 
   @include data-table.core-styles;
@@ -72,7 +73,8 @@ $_custom-property-prefix: 'data-table';
     }
 
     .mdc-data-table__pagination-rows-per-page-select {
-      --md-outlined-field-container-top-space: var(--_pagination-outlined-select-field-container-padding-vertical);
+      --md-outlined-field-top-space: var(--_pagination-outlined-select-field-top-space);
+      --md-outlined-field-bottom-space: var(--_pagination-outlined-select-field-bottom-space);
     }
 
     .mdc-data-table__pagination-total, .mdc-data-table__pagination-rows-per-page-label, .mdc-data-table__cell {

diff --git a/data-table/lib/data-table-column.ts b/data-table/lib/data-table-column.ts
@@ -127,7 +127,7 @@ export class DataTableColumn extends LitElement {
           <slot name="filter-textfield" class="mdc-data-table__filter-textfield">
               <md-outlined-text-field
                       label="${this.filterTextFieldLabel}"
-                      style="--_container-padding-vertical: var(--_pagination-outlined-select-field-container-padding-vertical);"
+                      style="--md-outlined-text-field-top-space: var(--_pagination-outlined-select-field-top-space); --md-outlined-text-field-bottom-space: var(--_pagination-outlined-select-field-bottom-space);"
                       @input=${this.onFilterTextFieldInput}
                       @keydown=${this.onFilterTextFieldKeyDown}
                       @click="${(e: PointerEvent) => e.stopPropagation()}"