GNOME.org
 

[gtk+/gtk-3-22] HC: Fix MessageDialog’s rounded bottom borders

commit 3a0ea4e0d2fac99e3866c411910b5977dff9a475
Author: Daniel Boles <dboles src gnome org>
Date:   Fri Oct 6 00:20:25 2017 +0100

    HC: Fix MessageDialog’s rounded bottom borders
    
    A missing decoration selector meant that we got a solid black background
    behind the rounded corners of the dialog.
    
    Copy the equivalent code from Adwaita, including nicely rounding the
    focus outline too (& sorry, but this needs more newlines to be readable)
    
    https://bugzilla.gnome.org/show_bug.cgi?id=788574

 gtk/theme/HighContrast/_common.scss              |   39 +++++++++++++++++++--
 gtk/theme/HighContrast/gtk-contained-inverse.css |    8 +++--
 gtk/theme/HighContrast/gtk-contained.css         |    8 +++--
 3 files changed, 45 insertions(+), 10 deletions(-)
---
diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index 75c903f..a0a48e0 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -2831,6 +2831,7 @@ calendar {
   &.highlight, &.highlight:backdrop { color: $fg_color; }
 }
 
+
 /***********
  * Dialogs *
  ***********/
@@ -2844,27 +2845,36 @@ messagedialog { // Message Dialog styling
     border-style: none;
     box-shadow: inset 0 1px $borders_edge;
   }
+
   &.csd { // rounded bottom border styling for csd version
-    // bigger radius for better antialiasing
-    border-bottom-left-radius: 9px;
-    border-bottom-right-radius: 9px;
+    &.background {
+      // bigger radius for better antialiasing
+      border-bottom-left-radius: 9px;
+      border-bottom-right-radius: 9px;
+    }
+
     .dialog-action-area button {
       padding: 12px;
       border-radius: 0;
+
       @include button(normal, $edge: none);
       @extend %middle_button;
+
       &:hover {
         @include button(hover, $edge: none);
         @extend %middle_button;
       }
+
       &:active {
         @include button(active, $edge: none);
         @extend %middle_button;
       }
+
       &:disabled {
         @include button(insensitive, $edge: none);
         @extend %middle_button;
       }
+
       &:backdrop {
         @include button(backdrop, $edge: none);
         @extend %middle_button;
@@ -2873,44 +2883,58 @@ messagedialog { // Message Dialog styling
         @include button(backdrop-insensitive, $edge: none);
         @extend %middle_button;
       }
+
       @each $b_type, $b_color in (suggested-action, $suggested_color),
                                  (destructive-action, $destructive_color) {
         &.#{$b_type} {
           @include button(normal, $b_color, white, $edge: none);
           @extend %middle_button;
+
           &:hover {
             @include button(hover, $b_color, white, $edge: none);
             @extend %middle_button;
           }
+
           &:active {
             @include button(active, $b_color, white, $edge: none);
             @extend %middle_button;
           }
+
           &:backdrop {
             @include button(backdrop, $b_color, white);
             @extend %middle_button;
+
             &:disabled {
               @include button(backdrop-insensitive);
               @extend %middle_button;
             }
           }
+
           &:disabled {
             @include button(insensitive);
             @extend %middle_button;
           }
         }
       }
+
       &:first-child{ @extend %first_button; }
       &:last-child { @extend %last_button; }
     }
+
     %middle_button {
       border-right-style: none;
       border-bottom-style: none;
     }
-    %last_button { border-bottom-right-radius: 7px; }
+
+    %last_button {
+      border-bottom-right-radius: 7px;
+      -gtk-outline-bottom-right-radius: 5px;
+    }
+
     %first_button {
       border-left-style: none;
       border-bottom-left-radius: 7px;
+      -gtk-outline-bottom-left-radius: 5px;
     }
   }
 }
@@ -2930,6 +2954,7 @@ filechooserbutton:drop(active) {
   border-color: transparent;
 }
 
+
 /***********
  * Sidebar *
  ***********/
@@ -3307,6 +3332,12 @@ decoration {
     box-shadow: none;
   }
 
+  messagedialog.csd & {
+    border-radius: 7px;
+    box-shadow: 0 1px 2px transparentize(black, 0.8),
+                0 0 0 1px transparentize($_wm_border, 0.1);
+  }
+
   .solid-csd & {
     border-radius: 0;
     margin: 4px;
diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css 
b/gtk/theme/HighContrast/gtk-contained-inverse.css
index 6f70a8e..5027cf9 100644
--- a/gtk/theme/HighContrast/gtk-contained-inverse.css
+++ b/gtk/theme/HighContrast/gtk-contained-inverse.css
@@ -1266,7 +1266,7 @@ messagedialog .dialog-action-area button { padding: 8px; }
 
 messagedialog .titlebar { border-style: none; box-shadow: inset 0 1px #000; }
 
-messagedialog.csd { border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; }
+messagedialog.csd.background { border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; }
 
 messagedialog.csd .dialog-action-area button { padding: 12px; border-radius: 0; border-width: 2px; 
border-style: solid; color: #fff; background-image: none; background-color: #000; border-color: gray; }
 
@@ -1306,9 +1306,9 @@ messagedialog.csd .dialog-action-area button.destructive-action:disabled { borde
 
 messagedialog.csd .dialog-action-area button, messagedialog.csd .dialog-action-area button:hover, 
messagedialog.csd .dialog-action-area button:active, messagedialog.csd .dialog-action-area button:disabled, 
messagedialog.csd .dialog-action-area button:backdrop, messagedialog.csd .dialog-action-area 
button:backdrop:disabled, messagedialog.csd .dialog-action-area button.suggested-action, messagedialog.csd 
.dialog-action-area button.suggested-action:hover, messagedialog.csd .dialog-action-area 
button.suggested-action:active, messagedialog.csd .dialog-action-area button.suggested-action:backdrop, 
messagedialog.csd .dialog-action-area button.suggested-action:backdrop:disabled, messagedialog.csd 
.dialog-action-area button.suggested-action:disabled, messagedialog.csd .dialog-action-area 
button.destructive-action, messagedialog.csd .dialog-action-area button.destructive-action:hover, 
messagedialog.csd .dialog-action-area button.destructive-action:active, messagedialog.csd .dialog-act
 ion-area button.destructive-action:backdrop, messagedialog.csd .dialog-action-area 
button.destructive-action:backdrop:disabled, messagedialog.csd .dialog-action-area 
button.destructive-action:disabled { border-right-style: none; border-bottom-style: none; }
 
-messagedialog.csd .dialog-action-area button:last-child { border-bottom-right-radius: 7px; }
+messagedialog.csd .dialog-action-area button:last-child { border-bottom-right-radius: 7px; 
-gtk-outline-bottom-right-radius: 5px; }
 
-messagedialog.csd .dialog-action-area button:first-child { border-left-style: none; 
border-bottom-left-radius: 7px; }
+messagedialog.csd .dialog-action-area button:first-child { border-left-style: none; 
border-bottom-left-radius: 7px; -gtk-outline-bottom-left-radius: 5px; }
 
 filechooser .dialog-action-box { border-top: 1px solid gray; }
 
@@ -1479,6 +1479,8 @@ decoration:backdrop { box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 3px 9px 1p
 
 tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
 
+messagedialog.csd decoration { border-radius: 7px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px 
rgba(0, 0, 0, 0.13); }
+
 .solid-csd decoration { border-radius: 0; margin: 4px; background-color: #000; border: solid 1px #737373; 
box-shadow: none; }
 
 /********************** Touch Copy & Paste * */
diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css
index 47f909e..79216f5 100644
--- a/gtk/theme/HighContrast/gtk-contained.css
+++ b/gtk/theme/HighContrast/gtk-contained.css
@@ -1272,7 +1272,7 @@ messagedialog .dialog-action-area button { padding: 8px; }
 
 messagedialog .titlebar { border-style: none; box-shadow: inset 0 1px #fff; }
 
-messagedialog.csd { border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; }
+messagedialog.csd.background { border-bottom-left-radius: 9px; border-bottom-right-radius: 9px; }
 
 messagedialog.csd .dialog-action-area button { padding: 12px; border-radius: 0; border-width: 2px; 
border-style: solid; color: #000; background-image: none; background-color: #fff; border-color: gray; }
 
@@ -1312,9 +1312,9 @@ messagedialog.csd .dialog-action-area button.destructive-action:disabled { borde
 
 messagedialog.csd .dialog-action-area button, messagedialog.csd .dialog-action-area button:hover, 
messagedialog.csd .dialog-action-area button:active, messagedialog.csd .dialog-action-area button:disabled, 
messagedialog.csd .dialog-action-area button:backdrop, messagedialog.csd .dialog-action-area 
button:backdrop:disabled, messagedialog.csd .dialog-action-area button.suggested-action, messagedialog.csd 
.dialog-action-area button.suggested-action:hover, messagedialog.csd .dialog-action-area 
button.suggested-action:active, messagedialog.csd .dialog-action-area button.suggested-action:backdrop, 
messagedialog.csd .dialog-action-area button.suggested-action:backdrop:disabled, messagedialog.csd 
.dialog-action-area button.suggested-action:disabled, messagedialog.csd .dialog-action-area 
button.destructive-action, messagedialog.csd .dialog-action-area button.destructive-action:hover, 
messagedialog.csd .dialog-action-area button.destructive-action:active, messagedialog.csd .dialog-act
 ion-area button.destructive-action:backdrop, messagedialog.csd .dialog-action-area 
button.destructive-action:backdrop:disabled, messagedialog.csd .dialog-action-area 
button.destructive-action:disabled { border-right-style: none; border-bottom-style: none; }
 
-messagedialog.csd .dialog-action-area button:last-child { border-bottom-right-radius: 7px; }
+messagedialog.csd .dialog-action-area button:last-child { border-bottom-right-radius: 7px; 
-gtk-outline-bottom-right-radius: 5px; }
 
-messagedialog.csd .dialog-action-area button:first-child { border-left-style: none; 
border-bottom-left-radius: 7px; }
+messagedialog.csd .dialog-action-area button:first-child { border-left-style: none; 
border-bottom-left-radius: 7px; -gtk-outline-bottom-left-radius: 5px; }
 
 filechooser .dialog-action-box { border-top: 1px solid gray; }
 
@@ -1485,6 +1485,8 @@ decoration:backdrop { box-shadow: 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 3px 9px 1p
 
 tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
 
+messagedialog.csd decoration { border-radius: 7px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px 
rgba(0, 0, 0, 0.13); }
+
 .solid-csd decoration { border-radius: 0; margin: 4px; background-color: #fff; border: solid 1px #8d8d8d; 
box-shadow: none; }
 
 /********************** Touch Copy & Paste * */
[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]