feat(grid): add k-grid-toolbar-bottom styles

#2490
telerik · Jun 1, 2021 · 65c18f2 · 65c18f2
1 parent c9efd9b
commit 65c18f2
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 21 deletions.
diff --git a/packages/bootstrap/scss/grid/_variables.scss b/packages/bootstrap/scss/grid/_variables.scss
@@ -1,4 +1,9 @@
 // Grid
+$grid-border-width: 1px !default;
+$grid-font-family: $font-family !default;
+$grid-font-size: $font-size !default;
+$grid-line-height: $line-height !default;
+
 $grid-padding-x: $cell-padding-x !default;
 $grid-padding-y: $cell-padding-y !default;
 
@@ -18,6 +23,7 @@ $grid-filter-cell-padding-y: $grid-filter-cell-padding-x !default;
 $grid-toolbar-padding-x: $toolbar-padding-x !default;
 $grid-toolbar-padding-y: $toolbar-padding-y !default;
 $grid-toolbar-spacing: $toolbar-spacing !default;
+$grid-toolbar-border-width: $grid-border-width !default;
 
 $grid-cell-padding-x: $grid-padding-x !default;
 $grid-cell-padding-y: $grid-padding-y !default;
@@ -26,11 +32,6 @@ $grid-cell-vertical-border-width: 1px !default;
 
 $grid-cell-placeholder-line-width: 80% !default;
 
-$grid-border-width: 1px !default;
-$grid-font-family: $font-family !default;
-$grid-font-size: $font-size !default;
-$grid-line-height: $line-height !default;
-
 /// Background color of the grid component
 /// @group grid
 $grid-bg: $table-bg !default;

diff --git a/packages/classic/scss/grid/_variables.scss b/packages/classic/scss/grid/_variables.scss
@@ -1,4 +1,9 @@
 // Grid
+$grid-border-width: 1px !default;
+$grid-font-family: $font-family !default;
+$grid-font-size: $font-size !default;
+$grid-line-height: $line-height !default;
+
 $grid-padding-x: $cell-padding-x !default;
 $grid-padding-y: $cell-padding-y !default;
 
@@ -18,6 +23,7 @@ $grid-filter-cell-padding-y: $grid-filter-cell-padding-x !default;
 $grid-toolbar-padding-x: $toolbar-padding-x !default;
 $grid-toolbar-padding-y: $toolbar-padding-y !default;
 $grid-toolbar-spacing: $toolbar-spacing !default;
+$grid-toolbar-border-width: $grid-border-width !default;
 
 $grid-cell-padding-x: $grid-padding-x !default;
 $grid-cell-padding-y: $grid-padding-y !default;
@@ -26,11 +32,6 @@ $grid-cell-vertical-border-width: 1px !default;
 
 $grid-cell-placeholder-line-width: 80% !default;
 
-$grid-border-width: 1px !default;
-$grid-font-family: $font-family !default;
-$grid-font-size: $font-size !default;
-$grid-line-height: $line-height !default;
-
 /// Background color of the grid component
 /// @group grid
 $grid-bg: $component-bg !default;

diff --git a/packages/default/scss/grid/_layout.scss b/packages/default/scss/grid/_layout.scss
@@ -425,9 +425,12 @@
 
     // Toolbar
     .k-grid-toolbar {
-        border-width: 0 0 1px;
+        border-width: 0 0 $grid-toolbar-border-width;
         flex-shrink: 0;
     }
+    .k-grid-toolbar-bottom {
+        border-width: $grid-toolbar-border-width 0 0;
+    }
 
 
     // Grid search

diff --git a/packages/default/scss/grid/_variables.scss b/packages/default/scss/grid/_variables.scss
@@ -1,4 +1,9 @@
 // Grid
+$grid-border-width: 1px !default;
+$grid-font-family: $font-family !default;
+$grid-font-size: $font-size !default;
+$grid-line-height: $line-height !default;
+
 $grid-padding-x: $cell-padding-x !default;
 $grid-padding-y: $cell-padding-y !default;
 
@@ -18,6 +23,7 @@ $grid-filter-cell-padding-y: $grid-filter-cell-padding-x !default;
 $grid-toolbar-padding-x: $toolbar-padding-x !default;
 $grid-toolbar-padding-y: $toolbar-padding-y !default;
 $grid-toolbar-spacing: $toolbar-spacing !default;
+$grid-toolbar-border-width: $grid-border-width !default;
 
 $grid-cell-padding-x: $grid-padding-x !default;
 $grid-cell-padding-y: $grid-padding-y !default;
@@ -26,11 +32,6 @@ $grid-cell-vertical-border-width: 1px !default;
 
 $grid-cell-placeholder-line-width: 80% !default;
 
-$grid-border-width: 1px !default;
-$grid-font-family: $font-family !default;
-$grid-font-size: $font-size !default;
-$grid-line-height: $line-height !default;
-
 /// Background color of the grid component
 /// @group grid
 $grid-bg: $component-bg !default;

diff --git a/packages/material/scss/grid/_variables.scss b/packages/material/scss/grid/_variables.scss
@@ -1,4 +1,9 @@
 // Grid
+$grid-border-width: 1px !default;
+$grid-font-family: $font-family !default;
+$grid-font-size: $font-size !default;
+$grid-line-height: $line-height !default;
+
 $grid-padding-x: $cell-padding-x !default;
 $grid-padding-y: $cell-padding-y !default;
 
@@ -18,6 +23,7 @@ $grid-filter-cell-padding-y: $grid-padding-y !default;
 $grid-toolbar-padding-x: $toolbar-padding-x !default;
 $grid-toolbar-padding-y: $toolbar-padding-y !default;
 $grid-toolbar-spacing: $toolbar-spacing !default;
+$grid-toolbar-border-width: $grid-border-width !default;
 
 $grid-cell-padding-x: $grid-padding-x !default;
 $grid-cell-padding-y: $grid-padding-y !default;
@@ -26,11 +32,6 @@ $grid-cell-vertical-border-width: 1px !default;
 
 $grid-cell-placeholder-line-width: 80% !default;
 
-$grid-border-width: 1px !default;
-$grid-font-family: $font-family !default;
-$grid-font-size: $font-size !default;
-$grid-line-height: $line-height !default;
-
 /// Background color of the grid component
 /// @group grid
 $grid-bg: $component-bg !default;