From 6400d251c284d8770cfd660db61f2bacc74e5e5b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafa=C5=82=20Dzi=C4=99giel?= <rafostar.github@gmail.com>
Date: Fri, 19 Feb 2021 10:12:47 +0100
Subject: [PATCH] Add a special style class for menu popover button

We want to have a non-osd popover in the button that is placed on OSD headerbar. This is something unusual that Adwaita does not have, so create a custom style that will use common values from user system theme.
---
 css/styles.css       | 12 ++++++++++++
 src/headerbarBase.js |  1 +
 2 files changed, 13 insertions(+)

diff --git a/css/styles.css b/css/styles.css
index b31945e5..f23944dc 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -21,6 +21,18 @@ radio {
 .osdheaderbar button {
   border: transparent;
 }
+/* Non-osd style for popover menu */
+.menupopover label {
+  color: @theme_text_color;
+}
+.menupopover arrow {
+  background: @theme_base_color;
+  border-color: @insensitive_base_color;
+}
+.menupopover contents {
+  background: @theme_base_color;
+  border-color: @insensitive_base_color;
+}
 .adwrounded.csd {
   border-radius: 8px;
 }
diff --git a/src/headerbarBase.js b/src/headerbarBase.js
index ee554f17..9c93659a 100644
--- a/src/headerbarBase.js
+++ b/src/headerbarBase.js
@@ -35,6 +35,7 @@ class ClapperHeaderBarBase extends Gtk.Box
         });
         const mainMenuModel = uiBuilder.get_object('mainMenu');
         const mainMenuPopover = new HeaderBarPopover(mainMenuModel);
+        mainMenuPopover.add_css_class('menupopover');
         this.menuButton.set_popover(mainMenuPopover);
         this.menuButton.add_css_class('circular');
         this.menuWidget.append(this.menuButton);