fix: spacer with fixed size wrong width

telerik · Feb 17, 2021 · f2d7cc3 · f2d7cc3
1 parent fa763a5
commit f2d7cc3
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 4 deletions.
diff --git a/packages/default/scss/toolbar/_layout.scss b/packages/default/scss/toolbar/_layout.scss
@@ -108,13 +108,11 @@
 
 
         // Spacer
-        .k-spacer,
         .k-toolbar-spacer {
             height: $line-height-em;
             flex: 1 1 auto;
         }
 
-
         // Template
         .k-toolbar-template {
             align-self: center;

diff --git a/tests/visual/grid-toolbar.html b/tests/visual/grid-toolbar.html
@@ -94,7 +94,17 @@
                 </div>
             </div>
         </section>
-        <section></section>
+        <section>
+            <!-- Spacer -->
+            <kendo-grid dir="ltr" class="k-widget k-grid">
+                <kendo-grid-toolbar class="k-toolbar k-grid-toolbar">
+                    <button class="k-button">Spacer</button>
+                    <kendo-grid-spacer class="k-spacer"></kendo-grid-spacer>
+                    <button class="k-button">Spacer</button>
+                </kendo-grid-toolbar>
+
+            </kendo-grid>
+        </section>
 
 
         <span>Search RTL</span>
@@ -110,7 +120,16 @@
                 </div>
             </div>
         </section>
-        <section></section>
+        <section>
+            <!-- Spacer with fixed width -->
+            <kendo-grid dir="ltr" class="k-widget k-grid">
+                <kendo-grid-toolbar class="k-toolbar k-grid-toolbar">
+                    <button class="k-button">Spacer fixed width</button>
+                    <kendo-grid-spacer width="10px" class="k-spacer k-spacer-sized" style="flex-basis: 10px;"></kendo-grid-spacer>
+                    <button class="k-button">Spacer fixed width</button>
+                </kendo-grid-toolbar>
+            </kendo-grid>
+        </section>
 
         <span>Multi-line</span>
         <section>