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)

3 files changed, 45 insertions, 10 deletions

diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss
index fb5769d8d5..ac993545f1 100644
--- a/gtk/theme/HighContrast/_common.scss
+++ b/gtk/theme/HighContrast/_common.scss
@@ -2815,6 +2815,7 @@ calendar {
   &.highlight, &.highlight:backdrop { color: $fg_color; }
 }
 
+
 /***********
  * Dialogs *
  ***********/
@@ -2828,27 +2829,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;
@@ -2857,44 +2867,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;
     }
   }
 }
@@ -2914,6 +2938,7 @@ filechooserbutton:drop(active) {
   border-color: transparent;
 }
 
+
 /***********
  * Sidebar *
  ***********/
@@ -3291,6 +3316,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 610d79c9f6..0d9c1218ca 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-action-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 533bc25d0a..b27d0575e9 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-action-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 * */