Added README, plus a lot of new features and improvements

README.md

@@ -0,0 +1,5 @@
+# Simple gradience
+
+This is a very simple and lightweight pure CSS theme (no SASS), which works with color CSS files generated by [Gradience](https://github.com/GradienceTeam/Gradience).
+It is still a **work in progress**. The idea is to develop it well enough so it can work with most of gtk3, gtk4 and libadwaita apps, but keeping its code fairly simple. Also, as with the rest of my themes, functionality and readability of elements is much more important than cool design, although looking *good enough* is also a goal.
+

color_schemes/dark-forest-evolved.css

@@ -10,7 +10,7 @@
 @define-color warning_color #ffa348;
 @define-color warning_bg_color #c64600;
 @define-color warning_fg_color #ffffff;
-@define-color error_color #f66151;
+@define-color error_color #FF3830;
 @define-color error_bg_color #e01b24;
 @define-color error_fg_color #f9f06b;
 @define-color window_bg_color #4a4a4a;

common/common.css

@@ -201,17 +201,17 @@ radio:indeterminate:checked, radio:indeterminate:checked:disabled {
 
 
 /* .destructive-action, .suggested-action */
-.destructive-action:not(:disabled) {
+.destructive-action:not(:disabled), .destructive:not(:disabled) {
     background-color: @destructive_bg_color;
     color: @destructive_fg_color;
 }
 
-.suggested-action:not(:disabled) {
+.suggested-action:not(:disabled), .suggested:not(:disabled) {
     background-color: @success_bg_color;
     color: @success_fg_color;
 }
 
-button.default {
+button.default:not(:disabled) {
     border-color: @success_color;
 }
 
@@ -331,7 +331,7 @@ entry progress {
 
 /* notebook, tabbar */
 /* see buttons too */
-tab, button.radio, stackswitcher > button {
+tab, button.radio, stackswitcher > button, .circular, .pill {
 border-radius: 9999px;
 }
 
@@ -373,6 +373,14 @@ menuitem:hover, menubar > item:hover, modelbutton:hover {
 }
 
 
+/********** Frames * */
+
+frame, .frame { border: 1px solid alpha(currentColor,0.15); }
+
+frame { border-radius: 12px; }
+
+frame > label { margin: 4px; }
+
 /* sidebars */
 
 /* icons */
@@ -402,13 +410,24 @@ arrow.left {
 
 /* expander, expander-widget */ 
 
-expander > title arrow, expander > arrow {
+expander, expander > title arrow, expander > arrow {
     -gtk-icon-source: -gtk-icontheme("arrow-right");
+    min-width: 1em; min-height: 1em;
 }
-expander > title arrow:checked, expander > arrow:checked {
+expander:dir(rtl), expander:dir(rtl) > title arrow, expander:dir(rtl) > arrow { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); }
+
+expander:checked, expander > title arrow:checked, expander > arrow:checked {
     -gtk-icon-source: -gtk-icontheme("arrow-down");
 }
 
+treeview.view.expander, window.print treeview.expander.dialog-action-box { min-width: 16px; min-height: 16px; -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); color: alpha(currentColor,0.7); }
+treeview.view.expander:hover, window.print treeview.expander.dialog-action-box:hover, treeview.view.expander:active, window.print treeview.expander.dialog-action-box:active { color: currentColor; }
+
+treeview.view.expander:checked, window.print treeview.expander.dialog-action-box:checked { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); }
+
+treeview.view.expander:disabled, window.print treeview.expander.dialog-action-box:disabled { color: alpha(currentColor,0.5); }
+
+
 /* separator, paned > separator */
 
 separator, paned > separator {
@@ -418,6 +437,7 @@ separator, paned > separator {
 paned > separator {
     min-width: 0.2em;
     min-height: 0.2em;
+    -gtk-icon-source: none;
 }
 
 separator {
@@ -505,16 +525,50 @@ decoration, window.background.csd {
     box-shadow: 0 0.5em 1em 0 alpha(black, 0.5);
 }
 
-.background.csd, popover, popover, window.background.csd.popup {
+.background.csd, popover > contents, window.background.csd.popup {
     box-shadow: 0 0.25em 0.5em 0 alpha(black, 0.5);
     /*background-clip: padding-box;*/
 }
 
-button.close:not(:backdrop) {
+/* popovers defined in each gtk-3.0 or gtk-4.0 because they conflict each other */
+
+
+/* window controls */
+
+button.close:not(:backdrop),
+button.close:hover, button.close:backdrop:hover {
     color: @error_color;
 }
 
 
+button.maximize:not(:backdrop),
+button.maximize:hover, button.maximize:backdrop:hover {
+    color: @success_color;
+}
+
+button.minimize:not(:backdrop),
+button.minimize:hover, button.minimize:backdrop:hover {
+    color: @warning_color;
+}
+
+button.close:hover, button.close:backdrop:hover,
+button.minimize:hover, button.minimize:backdrop:hover,
+button.maximize:hover, button.maximize:backdrop:hover {
+    box-shadow: inset 0 -.1em 0 0 alpha(currentColor, 0.7);
+}
+
+button.close:active, button.close:backdrop:active,
+button.minimize:active, button.minimize:backdrop:active,
+button.maximize:active, button.maximize:backdrop:active {
+    box-shadow: inset 0 -.2em 0 0 alpha(currentColor, 1);
+}
+
+
+windowcontrols button {
+margin: 0.2em;
+}
+
+
 .osd {
     background-color: alpha(mix(@window_bg_color, @view_bg_color, 0.5), 0.3);
     border: 1px dashed alpha(@view_fg_color, 0.3);
@@ -524,7 +578,7 @@ button.close:not(:backdrop) {
 /* frame */
 
 .frame {
-    border: 1px solid alpha(@window_fg_color, 0.3);
+    border: 1px solid alpha(currentColor, 0.3);
 }
 
 /* .app-notification */

gtk-3.0/gtk-dark.css

@@ -1,23 +0,0 @@
-@import '../common/colors.css';
-@import '../common/common.css';
-
-
-/* Based on adw-gtk version 4.7 and 4.9 */
-
-* { padding: 0; -GtkToolButton-icon-spacing: 4; -GtkTextView-error-underline-color: @error_bg_color; -GtkScrolledWindow-scrollbar-spacing: 0; -GtkToolItemGroup-expander-size: 11; -GtkWidget-text-handle-width: 20; -GtkWidget-text-handle-height: 24; -GtkDialog-button-spacing: 4; -GtkDialog-action-area-border: 0; outline-color: alpha(currentColor,0.3); outline-style: dashed; outline-offset: -3px; outline-width: 1px; -gtk-outline-radius: 4px; -gtk-secondary-caret-color: @accent_bg_color; }
-
-*:disabled { -gtk-icon-effect: dim; }
-
-.gtkstyle-fallback { color: @window_fg_color; background-color: @window_bg_color; }
-
-.gtkstyle-fallback:hover { color: @window_fg_color; background-color: shade(@window_bg_color,1.1); }
-
-.gtkstyle-fallback:active { color: @window_fg_color; background-color: shade(@window_bg_color,0.9); }
-
-.gtkstyle-fallback:disabled { color: mix(@window_fg_color,@window_bg_color,0.5); background-color: mix(@window_bg_color,@view_bg_color,0.4); }
-
-.gtkstyle-fallback:selected { color: @accent_fg_color; background-color: @accent_bg_color; }
-
-*:disabled {
-    -gtk-icon-effect: dim;
-}

gtk-3.0/gtk-dark.css

@@ -0,0 +1 @@
+gtk.css

gtk-3.0/gtk.css

@@ -21,3 +21,10 @@
 *:disabled {
     -gtk-icon-effect: dim;
 }
+
+
+popover, popover.background, .background.popup {
+	border: 1px solid mix(@popover_bg_color, @popover_fg_color, 0.5);
+	background-color: @popover_bg_color;
+	color: @popover_fg_color;
+}

gtk-4.0/gtk.css

@@ -12,3 +12,18 @@
 }
 
 
+popover > contents {
+background-clip: padding-box;
+
+padding: 0.5em;
+
+}
+popover, popover.background {
+background-color: transparent;
+}
+
+popover > contents, popover > arrow {
+border: 1px solid mix(@popover_bg_color, @popover_fg_color, 0.5);
+background-color: @popover_bg_color;
+color: @popover_fg_color;
+}