[epiphany] Style web app delete button like destructive-class



commit 209f24069d983d05fd1bad8005db1ea3138c6343
Author: Phaedrus Leeds <mwleeds protonmail com>
Date:   Mon Dec 6 13:38:29 2021 -0800

    Style web app delete button like destructive-class
    
    This changes the style of the "Delete" button on the
    "about:applications" page so that it looks like it has the
    "destructive-class" applied, which makes it more consistent with
    destructive buttons across the rest of GNOME. The CSS is copied from
    error.css.
    
    Part-of: <https://gitlab.gnome.org/GNOME/epiphany/-/merge_requests/1040>

 embed/ephy-about-handler.c |  3 ++-
 src/resources/about.css    | 17 ++++++++++++++++-
 2 files changed, 18 insertions(+), 2 deletions(-)
---
diff --git a/embed/ephy-about-handler.c b/embed/ephy-about-handler.c
index 0a466ff75..4e570d473 100644
--- a/embed/ephy-about-handler.c
+++ b/embed/ephy-about-handler.c
@@ -290,7 +290,8 @@ handle_applications_finished_cb (EphyAboutHandler       *handler,
                               "<tbody><tr id =\"%s\">"
                               "<td class=\"icon\"><img width=64 height=64 src=\"file://%s\"></img></td>"
                               "<td class=\"data\"><div class=\"appname\">%s</div><div 
class=\"appurl\">%s</div></td>"
-                              "<td class=\"input\"><input type=\"button\" value=\"%s\" 
onclick=\"deleteWebApp('%s');\"></td>"
+                              "<td class=\"input\"><input type=\"button\" value=\"%s\" 
onclick=\"deleteWebApp('%s');\" "
+                              "class=\"destructive-action\"></td>"
                               "<td class=\"date\">%s <br /> %s</td></tr></tbody>",
                               html_encoded_id, encoded_icon_url, encoded_name, encoded_url, _("Delete"), 
js_encoded_id,
                               /* Note for translators: this refers to the installation date. */
diff --git a/src/resources/about.css b/src/resources/about.css
index 3b1e6ed14..e3138b92b 100644
--- a/src/resources/about.css
+++ b/src/resources/about.css
@@ -186,6 +186,21 @@ html.epiphany-html {
 
 /* about:applications */
 
+.destructive-action {
+    color: white;
+    background-color: #e01b24;
+    border: none;
+    border-radius: 5px;
+}
+
+.destructive-action:hover,
+.destructive-action:focus,
+.destructive-action:active,
+.destructive-action.active {
+    color: white;
+    background-color: #e41c26;
+}
+
 #applications {
     margin: 20px;
 }
@@ -205,7 +220,7 @@ html.epiphany-html {
 .applications-body td.date { width: auto; text-align: right; font-size: small; }
 .applications-body .appname { font-weight: bold; }
 .applications-body .appurl, td.date { opacity: 0.55; /* Adwaita's dim-label */ }
-.applications-body input { width: auto; padding: 8px; }
+.applications-body .destructive-action { width: auto; padding: 10px; }
 
 @media only screen and (max-width : 600px) { 
     .applications-body td.date { display:none; }


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]