feat(dialog): update styles to match updated rendering

BREAKING CHANGE: The following classes are being renamed: * `k-dialog-actions` renamed to `k-dialog-titlebar-actions` * `k-dialog-buttongroup` and `k-dialog-buttons` renamed to `k-dialog-actions` BREAKING CHANGE: By default, the color of the titlebar is now the base color and can be changed via the new themeColor property of the component
telerik · Dec 13, 2022 · bd996b2 · bd996b2
1 parent ef4479c
commit bd996b2
Show file tree

Hide file tree

Showing 7 changed files with 14 additions and 10 deletions.
diff --git a/packages/bootstrap/scss/dialog/_theme.scss b/packages/bootstrap/scss/dialog/_theme.scss
@@ -12,7 +12,7 @@
     }
 
     // Buttons
-    .k-dialog-buttongroup {
+    .k-dialog-actions {
         border-color: $kendo-window-titlebar-border;
     }
 

diff --git a/packages/default/scss/dialog/_layout.scss b/packages/default/scss/dialog/_layout.scss
@@ -42,7 +42,7 @@
 
 
     // Actions
-    .k-dialog-actions {}
+    .k-dialog-titlebar-actions {}
     .k-dialog-action {}
 
 
@@ -51,7 +51,7 @@
 
 
     // Buttons
-    .k-dialog-buttongroup {
+    .k-dialog-actions {
         @include border-bottom-radius( $kendo-window-border-radius );
         padding: $kendo-dialog-buttongroup-padding-y $kendo-dialog-buttongroup-padding-x;
         border-width: $kendo-dialog-buttongroup-border-width 0 0;

diff --git a/packages/default/scss/scheduler/_theme.scss b/packages/default/scss/scheduler/_theme.scss
@@ -147,7 +147,7 @@
 
     // Edit dialog
     .k-scheduler-edit-dialog {
-        .k-dialog-buttongroup {
+        .k-dialog-actions {
             border-color: $scheduler-border;
         }
     }

diff --git a/packages/fluent/scss/dialog/_layout.scss b/packages/fluent/scss/dialog/_layout.scss
@@ -49,7 +49,7 @@
     }
 
     // Buttons
-    .k-dialog-buttongroup {
+    .k-dialog-actions {
         @include border-bottom-radius( var( --kendo-window-border-radius, #{$kendo-window-border-radius} ) );
         padding-inline: var( --kendo-dialog-buttongroup-padding-x, #{$kendo-dialog-buttongroup-padding-x} );
         padding-block: var( --kendo-dialog-buttongroup-padding-y, #{$kendo-dialog-buttongroup-padding-y} );
@@ -64,7 +64,7 @@
         overflow: hidden;
     }
 
-    .k-dialog-content +  .k-dialog-buttongroup {
+    .k-dialog-content + .k-dialog-actions {
         padding-block-start: 0;
     }
 

diff --git a/packages/fluent/scss/dialog/_variables.scss b/packages/fluent/scss/dialog/_variables.scss
@@ -24,6 +24,13 @@ $kendo-dialog-titlebar-padding-x: map-get( $kendo-spacing, 6 ) !default;
 /// @group dialog
 $kendo-dialog-titlebar-padding-y: map-get( $kendo-spacing, 4 ) !default;
 
+/// Horizontal padding of the content of the dialog.
+/// @group dialog
+$kendo-dialog-inner-padding-x: map-get( $kendo-spacing, 6 ) !default;
+/// Vertical padding of the content of the dialog.
+/// @group dialog
+$kendo-dialog-inner-padding-y: map-get( $kendo-spacing, 3 ) !default;
+
 /// Horizontal padding of the dialog action buttons.
 /// @group dialog
 $kendo-dialog-buttongroup-padding-x: map-get( $kendo-spacing, 6 ) !default; // $actions-padding-x

diff --git a/packages/fluent/scss/scheduler/_theme.scss b/packages/fluent/scss/scheduler/_theme.scss
@@ -153,7 +153,7 @@
 
     // Edit dialog
     .k-scheduler-edit-dialog {
-        .k-dialog-buttongroup {
+        .k-dialog-actions {
             border-color: var( --kendo-scheduler-border, #{$kendo-scheduler-border} );
         }
     }

diff --git a/packages/material/scss/dialog/_theme.scss b/packages/material/scss/dialog/_theme.scss
@@ -18,7 +18,4 @@
     }
 
 
-    // Button group
-    .k-dialog-buttongroup {}
-
 }