Fluent: change popup's content vertical paddings (#25865)

DevExpress · Oct 24, 2023 · 64ed08d · 64ed08d
1 parent e34d290
commit 64ed08d
Show file tree

Hide file tree

Showing 14 changed files with 6 additions and 3 deletions.
diff --git a/packages/devextreme/scss/widgets/fluent/gridBase/_index.scss b/packages/devextreme/scss/widgets/fluent/gridBase/_index.scss
@@ -357,7 +357,7 @@ $fluent-grid-base-group-panel-message-line-height: $fluent-button-text-line-heig
   }
 
   .dx-#{$widget-name}-edit-popup-form {
-    padding: $fluent-popup-content-padding;
+    padding: $fluent-popup-content-vertical-padding $fluent-popup-content-padding;
   }
 
   .dx-#{$widget-name}-headers,

diff --git a/packages/devextreme/scss/widgets/fluent/popup/_index.scss b/packages/devextreme/scss/widgets/fluent/popup/_index.scss
@@ -53,7 +53,7 @@ $fluent-popup-toolbar-label-font-size: $fluent-m-font-size;
 }
 
 .dx-popup-content {
-  padding: $fluent-popup-content-padding;
+  padding: $fluent-popup-content-vertical-padding $fluent-popup-content-padding;
 
   & > .dx-button {
     margin: $fluent-popup-button-margin;
@@ -76,7 +76,7 @@ $fluent-popup-toolbar-label-font-size: $fluent-m-font-size;
 
 .dx-popup-content.dx-dialog-content {
   min-width: 220px - 2 * $fluent-popup-content-padding;
-  padding: $fluent-popup-content-padding;
+  padding: $fluent-popup-content-vertical-padding $fluent-popup-content-padding;
 }
 
 .dx-dialog-message {

diff --git a/packages/devextreme/scss/widgets/fluent/popup/_sizes.scss b/packages/devextreme/scss/widgets/fluent/popup/_sizes.scss
@@ -4,6 +4,7 @@
 // adduse
 
 $fluent-popup-content-padding: null !default;
+$fluent-popup-content-vertical-padding: null !default;
 $fluent-popup-content-withtitle-top-padding: null !default;
 $fluent-popup-content-withtitle-bottom-padding: null !default;
 $fluent-popup-toolbar-horizontal-padding: null !default;
@@ -18,6 +19,7 @@ $fluent-popup-focused-content-shadow: null !default;
 
 @if $size == "default" {
   $fluent-popup-content-padding: 24px !default;
+  $fluent-popup-content-vertical-padding: 16px !default;
   $fluent-popup-content-withtitle-top-padding: 24px !default;
   $fluent-popup-content-withtitle-bottom-padding: 16px !default;
 
@@ -31,6 +33,7 @@ $fluent-popup-focused-content-shadow: null !default;
 
 @else if $size == "compact" {
   $fluent-popup-content-padding: 16px !default;
+  $fluent-popup-content-vertical-padding: 12px !default;
   $fluent-popup-content-withtitle-top-padding: 16px !default;
   $fluent-popup-content-withtitle-bottom-padding: 12px !default;
 

diff --git a/...x/etalons/Popup has correct height on the first opening (fluent-blue-light).png b/...x/etalons/Popup has correct height on the first opening (fluent-blue-light).png
diff --git a/...ys/etalons/Popover_bottom_toolbar_menu,rtlEnabled=false (fluent-blue-light).png b/...ys/etalons/Popover_bottom_toolbar_menu,rtlEnabled=false (fluent-blue-light).png
diff --git a/...ays/etalons/Popover_bottom_toolbar_menu,rtlEnabled=true (fluent-blue-light).png b/...ays/etalons/Popover_bottom_toolbar_menu,rtlEnabled=true (fluent-blue-light).png
diff --git a/...rlays/etalons/Popover_top_toolbar_menu,rtlEnabled=false (fluent-blue-light).png b/...rlays/etalons/Popover_top_toolbar_menu,rtlEnabled=false (fluent-blue-light).png
diff --git a/...erlays/etalons/Popover_top_toolbar_menu,rtlEnabled=true (fluent-blue-light).png b/...erlays/etalons/Popover_top_toolbar_menu,rtlEnabled=true (fluent-blue-light).png
diff --git a/...lays/etalons/Popup_bottom_toolbar_menu,rtlEnabled=false (fluent-blue-light).png b/...lays/etalons/Popup_bottom_toolbar_menu,rtlEnabled=false (fluent-blue-light).png
diff --git a/...rlays/etalons/Popup_bottom_toolbar_menu,rtlEnabled=true (fluent-blue-light).png b/...rlays/etalons/Popup_bottom_toolbar_menu,rtlEnabled=true (fluent-blue-light).png
diff --git a/...verlays/etalons/Popup_top_toolbar_menu,rtlEnabled=false (fluent-blue-light).png b/...verlays/etalons/Popup_top_toolbar_menu,rtlEnabled=false (fluent-blue-light).png
diff --git a/...overlays/etalons/Popup_top_toolbar_menu,rtlEnabled=true (fluent-blue-light).png b/...overlays/etalons/Popup_top_toolbar_menu,rtlEnabled=true (fluent-blue-light).png
diff --git a/...e/etalons/editor-before-click-add-button-and-validation (fluent-blue-light).png b/...e/etalons/editor-before-click-add-button-and-validation (fluent-blue-light).png
diff --git a/...mage/etalons/editor-before-click-add-button-from-device (fluent-blue-light).png b/...mage/etalons/editor-before-click-add-button-from-device (fluent-blue-light).png