Merge branch 'develop' into expose-chart-css-vars

packages/default/scss/tabstrip/_layout.scss

@@ -281,6 +281,10 @@
             .k-item {
                 @include border-top-radius( $kendo-tabstrip-item-border-radius );
                 border-bottom-width: 0;
+
+                .k-link {
+                    justify-content: center;
+                }
             }
             .k-item:active,
             .k-item.k-active {
@@ -304,6 +308,10 @@
             .k-item {
                 @include border-bottom-radius( $kendo-tabstrip-item-border-radius );
                 border-top-width: 0;
+
+                .k-link {
+                    justify-content: center;
+                }
             }
             .k-item:active,
             .k-item.k-active {

packages/default/scss/tabstrip/_theme.scss

@@ -129,21 +129,21 @@
             }
         }
     }
-}
-
-// RTL
-.k-rtl,
-[dir="rtl"] {
-    &.k-tabstrip-scrollable-overlay {
-        &.k-tabstrip-top,
-        &.k-tabstrip-bottom {
-            .k-tabstrip-items-wrapper {
-                &::before {
-                    background: linear-gradient(270deg, $kendo-tabstrip-scroll-overlay);
-                }
 
-                &::after {
-                    background: linear-gradient(90deg, $kendo-tabstrip-scroll-overlay);
+    // RTL
+    .k-rtl,
+    [dir="rtl"] {
+        &.k-tabstrip-scrollable-overlay {
+            &.k-tabstrip-top,
+            &.k-tabstrip-bottom {
+                .k-tabstrip-items-wrapper {
+                    &::before {
+                        background: linear-gradient(270deg, $kendo-tabstrip-scroll-overlay);
+                    }
+
+                    &::after {
+                        background: linear-gradient(90deg, $kendo-tabstrip-scroll-overlay);
+                    }
                 }
             }
         }

packages/default/scss/toolbar/_layout.scss

@@ -42,32 +42,31 @@
         &.k-toolbar-scrollable {
             flex-wrap: nowrap;
             position: relative;
+        }
+
+        &.k-toolbar-scrollable-overlay {
+
+            &::before,
+            &::after {
+                content: '';
+                height: 100%;
+                aspect-ratio: 1;
+                position: absolute;
+                z-index: 3;
+            }
 
-            &.k-toolbar-scrollable-overlay {
-                &::before {
-                    content: '';
-                    height: 100%;
-                    aspect-ratio: 1;
-                    position: absolute;
-                    inset-inline-start: 0;
-                    z-index: 3;
-                }
-
-                &::after {
-                    content: '';
-                    height: 100%;
-                    aspect-ratio: 1;
-                    position: absolute;
-                    inset-inline-end: 0;
-                    z-index: 3;
-                }
-
-                &.k-toolbar-scrollable-start::before,
-                &.k-toolbar-scrollable-end::after {
-                    display: none;
-                }
+            &::before {
+                inset-inline-start: 0;
+            }
+
+            &::after {
+                inset-inline-end: 0;
             }
 
+            &.k-toolbar-scrollable-start::before,
+            &.k-toolbar-scrollable-end::after {
+                display: none;
+            }
         }
 
         > * {

packages/fluent/scss/tabstrip/_layout.scss

@@ -271,6 +271,10 @@
 
             .k-item {
                 margin-block-end: calc( var( --kendo-tabstrip-border-width, #{$kendo-tabstrip-border-width} ) * -1 );
+
+                .k-link {
+                    justify-content: center;
+                }
             }
 
         }
@@ -282,8 +286,11 @@
 
             .k-item {
                 margin-block-start: calc( var( --kendo-tabstrip-border-width, #{$kendo-tabstrip-border-width} ) * -1 );
-            }
 
+                .k-link {
+                    justify-content: center;
+                }
+            }
         }
     }
     .k-tabstrip-left {
@@ -338,7 +345,6 @@
         flex: 1 0 0;
     }
 
-
     // Selected indicator
     @if ($kendo-tabstrip-indicator-size) {
 

packages/fluent/scss/toolbar/_layout.scss

@@ -43,30 +43,30 @@
             flex-wrap: nowrap;
             position: relative;
             margin-inline-start: calc( var( --INTERNAL--kendo-toolbar-spacing, 0 ) * -1 );
+        }
+
+        &.k-toolbar-scrollable-overlay {
+
+            &::before,
+            &::after {
+                content: '';
+                height: 100%;
+                aspect-ratio: 1;
+                position: absolute;
+                z-index: 3;
+            }
+
+            &::before {
+                inset-inline-start: var( --INTERNAL--kendo-toolbar-spacing, 0 );
+            }
+
+            &::after {
+                inset-inline-end: 0;
+            }
 
-            &.k-toolbar-scrollable-overlay {
-                &::before {
-                    content: '';
-                    height: 100%;
-                    aspect-ratio: 1;
-                    position: absolute;
-                    inset-inline-start: 0;
-                    z-index: 3;
-                }
-
-                &::after {
-                    content: '';
-                    height: 100%;
-                    aspect-ratio: 1;
-                    position: absolute;
-                    inset-inline-end: 0;
-                    z-index: 3;
-                }
-
-                &.k-toolbar-scrollable-start::before,
-                &.k-toolbar-scrollable-end::after {
-                    display: none;
-                }
+            &.k-toolbar-scrollable-start::before,
+            &.k-toolbar-scrollable-end::after {
+                display: none;
             }
         }