Dialog named color support

lassekongo83 · Aug 11, 2022 · d52e24a · d52e24a
1 parent 44e35c7
commit d52e24a
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 9 deletions.
diff --git a/gtk/src/adw-gtk3/gtk-3.0/_colors.scss b/gtk/src/adw-gtk3/gtk-3.0/_colors.scss
@@ -16,6 +16,8 @@ $card_bg_color: gtkcolor(card_bg_color);
 $card_fg_color: gtkcolor(card_fg_color);
 $popover_bg_color: gtkcolor(popover_bg_color);
 $popover_fg_color: gtkcolor(popover_fg_color);
+$dialog_bg_color: gtkcolor(dialog_bg_color);
+$dialog_fg_color: gtkcolor(dialog_fg_color);
 $warning_bg_color: gtkcolor(warning_bg_color);
 $warning_fg_color: gtkcolor(warning_fg_color);
 $warning_color: gtkcolor(warning_color);

diff --git a/gtk/src/adw-gtk3/gtk-3.0/_common.scss b/gtk/src/adw-gtk3/gtk-3.0/_common.scss
@@ -4063,7 +4063,8 @@ messagedialog { // Message Dialog styling
   .titlebar {
     min-height: 20px;
     background-image: none;
-    background-color: $bg_color;
+    background-color: $dialog_bg_color;
+    color: $dialog_fg_color;
     border-style: none;
     border-top-left-radius: $window_radius;
     border-top-right-radius: $window_radius;
@@ -4073,6 +4074,8 @@ messagedialog { // Message Dialog styling
     &.background {
       border-bottom-left-radius: $window_radius;
       border-bottom-right-radius: $window_radius;
+      background-color: $dialog_bg_color;
+      color: $dialog_fg_color;
     }
 
     .dialog-action-area button {
@@ -4081,26 +4084,27 @@ messagedialog { // Message Dialog styling
       border-bottom-style: none;
       border-radius: 0;
       -gtk-outline-radius: 0;
-      background-color: $bg_color;
+      background-color: $dialog_bg_color;
+      color: $dialog_fg_color;
       border-top: 1px solid $border_color;
       border-left: 1px solid $border_color;
 
-      &:hover { @include button(hover); }
+      &:hover { @include button(hover, $dialog_bg_color, $dialog_fg_color); }
 
-      &:active { @include button(active); }
+      &:active { @include button(active, $dialog_bg_color, $dialog_fg_color); }
 
       &.suggested-action {
         background-color: $suggested_bg_color;
         color: $selected_fg_color;
-        &:hover { @include button(hover, $suggested_bg_color, white); }
-        &:active, &:checked { @include button(active, $suggested_bg_color, white); }
+        &:hover { @include button(hover, $suggested_bg_color, $selected_fg_color); }
+        &:active, &:checked { @include button(active, $suggested_bg_color, $selected_fg_color); }
       }
 
       &.destructive-action {
         background-color: $destructive_bg_color;
-        color: $selected_fg_color;
-        &:hover { @include button(hover, $destructive_bg_color, white); }
-        &:active, &:checked { @include button(active, $destructive_bg_color, white); }
+        color: $destructive_fg_color;
+        &:hover { @include button(hover, $destructive_bg_color, $destructive_fg_color); }
+        &:active, &:checked { @include button(active, $destructive_bg_color, $destructive_fg_color); }
       }
 
       &:first-child {

diff --git a/gtk/src/adw-gtk3/gtk-3.0/_defaults.scss b/gtk/src/adw-gtk3/gtk-3.0/_defaults.scss
@@ -51,6 +51,10 @@
 @define-color card_fg_color #{if($variant == 'light', #323232, white)};
 @define-color card_shade_color #{if($variant == 'light', transparentize(black, .93), transparentize(black, .64))};
 
+// Dialogs
+@define-color dialog_bg_color #{if($variant == 'light', #fafafa, #383838)};
+@define-color dialog_fg_color #{if($variant == 'light', #323232, white)};
+
 // Popovers
 @define-color popover_bg_color #{if($variant == 'light', #ffffff, #383838)};
 @define-color popover_fg_color #{if($variant == 'light', #323232, white)};