firefox: fix firefox-gnome-theme import

Signed-off-by: Myned <dev@bjork.tech>

options/custom/programs/firefox/.common.nix

@@ -51,10 +51,11 @@ with lib; {
 
     # TODO: Consider other themes
     # https://github.com/soulhotel/FF-ULTIMA
-
+    #!! @import must be above other rules
     # https://github.com/rafaelmardojai/firefox-gnome-theme/blob/master/theme/colors/dark.css
-    userChrome = builtins.readFile ./userChrome.css;
+    userChrome = mkAfter ''@import "${./customChrome.css}";'';
-    userContent = builtins.readFile ./userContent.css;
+    userContent = mkAfter ''@import "${./customContent.css}";'';
+
     containersForce = true;
 
     containers = {

options/custom/programs/firefox/customChrome.css

@@ -0,0 +1,21 @@
+/***
+https://github.com/rafaelmardojai/firefox-gnome-theme
+***/
+
+:root {
+  --gnome-accent: #d33682;
+  --gnome-tabbar-tab-hover-background: color-mix(in srgb, #073642, #586e75 10%);
+  --gnome-tabbar-tab-active-background: color-mix(in srgb, #073642, #586e75 20%);
+  --gnome-tabbar-tab-active-background-contrast: color-mix(in srgb, #073642, #586e75 20%);
+  --gnome-tabbar-tab-active-hover-background: color-mix(in srgb, #073642, #586e75 30%);
+}
+
+/* Center bookmarks */
+#PlacesToolbarItems {
+  justify-content: center;
+}
+
+/* Disable bookmark folder icons */
+.bookmark-item[container] > .toolbarbutton-icon {
+  display: none;
+}

options/custom/programs/firefox/userChrome.css

@@ -1,34 +0,0 @@
-/***
-https://github.com/rafaelmardojai/firefox-gnome-theme
-***/
-
-:root {
-  --gnome-accent: #d33682;
-  --gnome-window-background: #002b36;
-  --gnome-window-color: #93a1a1;
-  --gnome-view-background: #073642;
-  --gnome-sidebar-background: #002b36;
-  --gnome-secondary-sidebar-background: #002b36;
-  --gnome-menu-background: #073642;
-  --gnome-headerbar-background: #002b36;
-  --gnome-toolbar-icon-fill: #93a1a1;
-  --gnome-tabbar-tab-hover-background: #073642;
-  --gnome-tabbar-tab-active-background: #073642;
-  --gnome-tabbar-tab-active-hover-background: #073642;
-}
-
-:root:-moz-window-inactive {
-  --gnome-inactive-entry-color: #586e75;
-  --gnome-tabbar-tab-hover-background: #073642;
-  --gnome-tabbar-tab-active-background: #073642;
-}
-
-/* Center bookmarks */
-#PlacesToolbarItems {
-  justify-content: center;
-}
-
-/* Disable bookmark folder icons */
-.bookmark-item[container] > .toolbarbutton-icon {
-  display: none;
-}