update

src/other/firefox/README.md

@@ -0,0 +1,86 @@
+
+## Firefox Safari theme
+
+<p align="center">A MacOSX Safari theme for Firefox 80+</p>
+
+#### Preview
+![01](https://github.com/vinceliuice/WhiteSur-gtk-theme/blob/pictures/pictures/firefox.png?raw=true)
+
+## Description
+
+This is a bunch of CSS code to make Firefox look closer to MacOSX Safari theme.
+Based on https://github.com/rafaelmardojai/firefox-gnome-theme
+
+## Installation
+
+Run `./tweaks.sh -f`
+
+if you want to use `Monterey` style then:
+
+1. run `./tweaks.sh -f -e`
+2. Modify :
+```
+@import "WhiteSur/theme.css"; /**/
+/*@import "Monterey/theme.css"; /**/
+```
+To:
+```
+/*@import "WhiteSur/theme.css"; /**/
+@import "Monterey/theme.css"; /**/
+```
+
+### Manual installation
+
+1. Go to `about:support` in Firefox.
+2. Application Basics > Profile Directory > Open Directory.
+3. Copy `chrome` folder Firefox config folder.
+4. If you are using Firefox 69+:
+	1. Go to `about:config` in Firefox.
+	2. Search for `toolkit.legacyUserProfileCustomizations.stylesheets` and set it to `true`.
+5. Restart Firefox.
+6. Open Firefox customization panel and:
+	1. Use *Title bar* option to toggle CSD if is not set by default.
+	2. Move the new tab button to headerbar.
+	3. Select light or dark variants on theme switcher.
+7. Be happy with your new gnomish Firefox.
+
+## Enabling optional features
+Open `userChrome.css` with a text editor and follow instructions to enable extra features. Keep in mind this file might change in future versions and your configuration will be lost. You can copy the @imports you want to enable to a new file named `customChrome` directly in your `chrome` directory if you want it to survive updates. Remember all @imports must be at the top of the file, before other statements.
+
+## Known bugs
+
+### CSD have sharp corners
+See upstream [bug](https://bugzilla.mozilla.org/show_bug.cgi?id=1408360).
+
+#### Wayland fix:
+1. Go to the `about:config` page
+2. Search for the `layers.acceleration.force-enabled` preference and set it to true.
+3. Now restart Firefox, and it should look good!
+
+#### X11 fix:
+1. Go to the `about:config` page
+2. Type `mozilla.widget.use-argb-visuals`
+3. Set it as a `boolean` and click on the add button
+4. Now restart Firefox, and it should look good!
+
+## Development
+
+If you wanna mess around the styles and change something, you might find these
+things useful.
+
+To use the Inspector to debug the UI, open the developer tools (F12) on any
+page, go to options, check both of those:
+
+- Enable browser chrome and add-on debugging toolboxes
+- Enable remote debugging
+
+Now you can close those tools and press Ctrl+Alt+Shift+I to Inspect the browser
+UI.
+
+Also you can inspect any GTK3 application, for example type this into a terminal
+and it will run Epiphany with the GTK Inspector, so you can check the CSS styles
+of its elements too.
+
+```sh
+GTK_DEBUG=interactive epiphany
+``

src/sass/gtk/apps/_budgie.scss

@@ -136,6 +136,10 @@ $raven_padding: 8px;
 
   scrolledwindow.sidebar.categories {  //AppMenu (budgie)
     border-bottom-left-radius: $wm_radius;
+
+    button.flat.category-button {
+      @extend %flat_button;
+    }
   }
 
   treeview.view.sidebar {
@@ -493,7 +497,7 @@ popover.background.places-menu {
       background-image: none;
       font-weight: normal;
 
-      &:hover { background-color: $selected_bg_color; }
+      &:hover { background-color: if($trans == 'false' and $variant == 'light', $divider_color, $light_divider_color); }
       &:disabled { color: transparentize($panel_fg, 0.6); }
 
       &.budgie-menubar {