From 853caa5b84752d09933dfc85bb5e5ed868c6441d Mon Sep 17 00:00:00 2001
From: Ian Douglas Scott <idscott@system76.com>
Date: Fri, 3 Jun 2022 20:00:47 -0700
Subject: [PATCH] Add CSS to status area applet

Doesn't match other applets. Though toggle button behavior is probably
what we want?
---
 applets/cosmic-applet-status-area/src/main.rs |  9 +++++
 .../src/status_menu.rs                        |  1 +
 .../cosmic-applet-status-area/src/style.css   | 33 +++++++++++++++++++
 3 files changed, 43 insertions(+)
 create mode 100644 applets/cosmic-applet-status-area/src/style.css

diff --git a/applets/cosmic-applet-status-area/src/main.rs b/applets/cosmic-applet-status-area/src/main.rs
index 1e8283ba..f584acc5 100644
--- a/applets/cosmic-applet-status-area/src/main.rs
+++ b/applets/cosmic-applet-status-area/src/main.rs
@@ -14,6 +14,14 @@ fn main() {
     // XXX Implement DBus service somewhere other than applet?
     glib::MainContext::default().spawn_local(status_notifier_watcher::start());
 
+    let provider = gtk4::CssProvider::new();
+    provider.load_from_data(include_bytes!("style.css"));
+    gtk4::StyleContext::add_provider_for_display(
+        &gtk4::gdk::Display::default().expect("Could not connect to a display."),
+        &provider,
+        gtk4::STYLE_PROVIDER_PRIORITY_APPLICATION,
+    );
+
     let status_area = StatusArea::new();
     gtk4::Window::builder()
         .decorated(false)
@@ -21,6 +29,7 @@ fn main() {
         .resizable(false)
         .width_request(1)
         .height_request(1)
+        .css_classes(vec!["root_window".to_string()])
         .build()
         .show();
 
diff --git a/applets/cosmic-applet-status-area/src/status_menu.rs b/applets/cosmic-applet-status-area/src/status_menu.rs
index 83541a03..bc827e00 100644
--- a/applets/cosmic-applet-status-area/src/status_menu.rs
+++ b/applets/cosmic-applet-status-area/src/status_menu.rs
@@ -50,6 +50,7 @@ impl ObjectImpl for StatusMenuInner {
 
         let menu_button = cascade! {
             gtk4::MenuButton::new();
+            ..add_css_class("panel_icon");
             ..set_has_frame(false);
             ..set_parent(obj);
             ..set_popover(Some(&popover));
diff --git a/applets/cosmic-applet-status-area/src/style.css b/applets/cosmic-applet-status-area/src/style.css
new file mode 100644
index 00000000..8a91f3eb
--- /dev/null
+++ b/applets/cosmic-applet-status-area/src/style.css
@@ -0,0 +1,33 @@
+.loading-overlay {
+	background-color: #2f2f2f;
+	opacity: 0.85;
+}
+
+image.panel_icon {
+    padding-left: 0px;
+    padding-right: 0px;
+    padding-top: 0px;
+    padding-bottom: 0px;
+}
+
+button.panel_icon {
+    border-radius: 12px;
+    transition: 100ms;
+    padding: 4px;
+    border-color: transparent;
+    background: transparent;
+    outline-color: transparent;
+}
+
+button.panel_icon:hover {
+    border-radius: 12px;
+    transition: 100ms;
+    padding: 4px;
+    border-color: rgba(255, 255, 255, 0.1);
+    outline-color: rgba(255, 255, 255, 0.1);
+    background: rgba(255, 255, 255, 0.1);
+}
+
+window.root_window {
+	background: transparent;
+}
\ No newline at end of file