[gimp] themes: add some border theming to default and active buttons.



commit 4e08ab9659afc6acbd5a8b142fb570035f3da6fa
Author: Jehan <jehan girinstud io>
Date:   Thu Sep 29 21:06:47 2022 +0200

    themes: add some border theming to default and active buttons.
    
    I noticed some buttons had a bluish border, showing the system theme leaking
    over our default theme. So I'm just overriding this with a grayscale color.
    
    These 2 new rules are especially useful in dialogs so that you know what happens
    when you hit "Enter". The "default" action (.suggested-action in GTK CSS) is the
    action we set to be the active one by default. E.g. if you open a dialog and hit
    Enter immediately, without touching any widget focus, this is what will be
    activated.
    
    The GTK CSS .default action on the other hand seems to simply be the button with
    focus right now, which can be changed through Tab or other ways. If both types
    of styles are visible, the .default one is the actually activated action (not
    .suggested-action), which is why I make its style a bit stronger (solid rather
    than dotted and a bit more opaque).
    
    Also I discover the shade() function to reuse a color and adding it
    transparency!

 themes/Default/common.css | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)
---
diff --git a/themes/Default/common.css b/themes/Default/common.css
index 0924b223e5..dc56a16672 100644
--- a/themes/Default/common.css
+++ b/themes/Default/common.css
@@ -255,6 +255,22 @@ button:disabled, button:disabled image {
   color: @disabled-button-color;
 }
 
+/* E.g. the currently active action of a dialog will slightly stand out so that
+ * people know what action is activated when they will just hit Enter.
+ */
+button.default {
+  border: 1px solid shade(@fg-color, 0.7);
+}
+
+/* This is the default active action, the somehow "suggested" action. Usually it
+ * means this is either the expected next step action (e.g. activating a
+ * filter), or else the less destructive action (e.g. when closing an unsaved
+ * image, the default is "Cancel").
+ */
+button.suggested-action {
+  border: 1px dotted shade(@fg-color, 0.5);
+}
+
 /* Spinbuttons: there are two kinds:
  * spinbutton, spinbutton button
  *   e.g. the "width" field in the New Image dialog.


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