r3dfox theme and settings

Author: K4sum1

browser/base/content/browser-init.js

@@ -93,7 +93,7 @@ var gBrowserInit = {
       const toolbarMenubar = document.getElementById("toolbar-menubar");
       // set a default value
       if (!toolbarMenubar.hasAttribute("autohide")) {
-        toolbarMenubar.setAttribute("autohide", true);
+        toolbarMenubar.setAttribute("autohide", false);
       }
       document.l10n.setAttributes(
         toolbarMenubar,

browser/components/BrowserGlue.sys.mjs

@@ -188,6 +188,22 @@ let gThisInstanceIsLaunchOnLogin = false;
 // a taskbar tab shortcut will contain the "taskbar-tab" flag.
 let gThisInstanceIsTaskbarTab = false;
 
+function applyCustomCSS() {
+let styleSheetService = Components.classes["@mozilla.org/content/style-sheet-service;1"]
+.getService(Components.interfaces.nsIStyleSheetService);
+let ioService = Components.classes["@mozilla.org/network/io-service;1"]
+.getService(Components.interfaces.nsIIOService);
+let uri = ioService.newURI("chrome://browser/skin/r3dfox.css", null, null);
+
+if (!styleSheetService.sheetRegistered(uri, styleSheetService.AGENT_SHEET)) {
+styleSheetService.loadAndRegisterSheet(uri, styleSheetService.AGENT_SHEET);
+}
+}
+
+applyCustomCSS();
+
+applyCustomCSS();
+
 /**
  * Fission-compatible JSProcess implementations.
  * Each actor options object takes the form of a ProcessActorOptions dictionary.

browser/components/preferences/main.inc.xhtml

@@ -12,6 +12,142 @@
 
 <script src="chrome://mozapps/content/preferences/fontbuilder.js"/>
 
+<!-- r3dfox -->
+<hbox id="r3dfoxcategory"
+      class="subcategory"
+      hidden="true"
+      data-category="paneGeneral">
+  <html:h1 data-l10n-id="r3dfox-title"/>
+</hbox>
+
+<!-- r3dfox -->
+<groupbox id="r3dfoxGroup" data-category="paneGeneral" hidden="true">
+  <label class="search-header" hidden="true"><html:h2 data-l10n-id="r3dfox-title"/></label>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxUseNativeStyles"
+              data-l10n-id="r3dfox-native-checkbox"
+              preference="widget.non-native-theme.enabled"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-native-checkbox-desc"/>
+
+  <hbox align="center">
+    <label id="r3dfoxNativeScroll" data-l10n-id="r3dfox-native-scroll" control="r3dfoxNativeScrollType"/>
+    <menulist id="r3dfoxNativeScrollType" preference="widget.ev-native-controls-patch.scrollbar-style">
+      <menupopup>
+        <menuitem label="Native scrollbars always" value="0"/>
+        <menuitem label="Custom scrollbars always" value="1"/>
+        <menuitem label="Native scrollbars unless the website has a dark color scheme" value="2"/>
+      </menupopup>
+    </menulist>
+  </hbox>
+  <description id="r3dfoxNativeScrollDescription" class="tip-caption" data-l10n-id="r3dfox-native-scroll-desc"/>
+
+  <hbox align="center">
+    <label id="r3dfoxFakeScroll" data-l10n-id="r3dfox-fake-scroll-type" control="r3dfoxFakeScrollType"/>
+    <menulist id="r3dfoxFakeScrollType" preference="widget.non-native-theme.scrollbar.style">
+      <menupopup>
+        <menuitem label="Default platform scrollbar style (normal)" value="0"/>
+        <menuitem label="macOS scrollbar (small)" value="1"/>
+        <menuitem label="GTK scrollbar (smaller)" value="2"/>
+        <menuitem label="Android scrollbar (smallest)" value="3"/>
+        <menuitem label="Windows 10 scrollbar (normal)" value="4"/>
+        <menuitem label="Windows 11 scrollbar (smaller)" value="5"/>
+      </menupopup>
+    </menulist>
+  </hbox>
+  <description id="r3dfoxFakeScrollDescription" class="tip-caption" data-l10n-id="r3dfox-fake-scroll-type-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxTheme"
+              data-l10n-id="r3dfox-theme"
+              preference="r3dfox.customizations.enabled"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-theme-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxdrag"
+              data-l10n-id="r3dfox-drag"
+              preference="r3dfox.drag-space.enabled"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-drag-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxColors"
+              data-l10n-id="r3dfox-colors"
+              preference="r3dfox.colors.enabled"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-colors-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxMenubar"
+              data-l10n-id="r3dfox-menubar"
+              preference="r3dfox.transparent.menubar"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-menubar-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxNavbar"
+              data-l10n-id="r3dfox-navbar"
+              preference="r3dfox.translucent.navbar"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-navbar-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxlessfog"
+              data-l10n-id="r3dfox-less-fog"
+              preference="r3dfox.less.aero.fog"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-less-fog-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxfog"
+              data-l10n-id="r3dfox-fog"
+              preference="r3dfox.aero.fog"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-fog-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxtransparency"
+              data-l10n-id="r3dfox-transparency"
+              preference="r3dfox.force.transparency"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-transparency-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxcaptiontext"
+              data-l10n-id="r3dfox-caption-text"
+              preference="r3dfox.caption.text.color"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-caption-text-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxoneoffs"
+              data-l10n-id="r3dfox-one-offs"
+              preference="browser.urlbar.oneOffsInstant"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-one-offs-desc"/>
+
+  <hbox align="center">
+    <checkbox id="r3dfoxe10s"
+              data-l10n-id="r3dfox-e10s"
+              preference="browser.e10s.disabled"/>
+  </hbox>
+  <description class="indent tip-caption" data-l10n-id="r3dfox-e10s-desc"/>
+
+  <hbox align="center">
+    <label id="r3dfoxAccessibility" data-l10n-id="r3dfox-accessibility" control="r3dfoxAccessibilityType"/>
+    <menulist id="r3dfoxAccessibilityType" preference="accessibility.force_disabled">
+      <menupopup>
+        <menuitem label="Always disabled (1)" value="1"/>
+        <menuitem label="Default (0)" value="0"/>
+        <menuitem label="Always enabled (-1)" value="-1"/>
+      </menupopup>
+    </menulist>
+  </hbox>
+  <description id="r3dfoxAccessibilityDescription" class="tip-caption" data-l10n-id="r3dfox-accessibility-desc"/>
+</groupbox>
+
 <html:template id="template-paneGeneral">
 <hbox id="generalCategory"
       class="subcategory"

browser/components/preferences/main.js

@@ -59,6 +59,24 @@ Preferences.addAll([
   { id: "browser.download.folderList", type: "int" },
   { id: "browser.download.dir", type: "file" },
 
+  /* r3dfox preferences */
+
+  { id: "widget.non-native-theme.enabled", type: "bool",  inverted: true },
+  { id: "widget.ev-native-controls-patch.scrollbar-style", type: "int" },
+  { id: "widget.non-native-theme.scrollbar.style", type: "int" },
+  { id: "r3dfox.colors.enabled", type: "bool" },
+  { id: "r3dfox.customizations.enabled", type: "bool" },
+  { id: "r3dfox.drag-space.enabled", type: "bool" },
+  { id: "r3dfox.transparent.menubar", type: "bool" },
+  { id: "r3dfox.translucent.navbar", type: "bool" },
+  { id: "r3dfox.less.aero.fog", type: "bool" },
+  { id: "r3dfox.aero.fog", type: "bool" },
+  { id: "r3dfox.force.transparency", type: "bool" },
+  { id: "r3dfox.caption.text.color", type: "bool" },
+  { id: "browser.urlbar.oneOffsInstant", type: "bool" },
+  { id: "browser.e10s.disabled", type: "bool" },
+  { id: "accessibility.force_disabled", type: "int" },
+
   /* Tab preferences
   Preferences:
 

browser/locales/en-US/browser/preferences/preferences.ftl

@@ -138,7 +138,83 @@ search-results-empty-message2 =
 
 search-results-help-link = Need help? Visit <a data-l10n-name="url">{ -brand-short-name } Support</a>
 
-## General Section
+## General Section - r3dfox
+
+r3dfox-title = r3dfox configurations
+
+r3dfox-native-checkbox =
+    .label = Use native styles
+
+r3dfox-native-checkbox-desc = This controls whether the scrollbar, checkboxes, and other elements use their native system counterparts or their non-native browser themed style. May requre browser restart.
+
+r3dfox-native-scroll = Scrollbar style
+
+r3dfox-native-scroll-desc = This controls the style of the scrollbar.
+
+r3dfox-fake-scroll-type = Non-native scrollbar theme
+
+r3dfox-fake-scroll-type-desc = This controls the theme of the scrollbar.
+
+r3dfox-theme =
+    .label = Use r3dfox theme styles
+
+r3dfox-theme-desc = This enables or disables the r3dfox theme.
+
+r3dfox-drag =
+    .label = Enable drag space on r3dfox theme styles
+
+r3dfox-drag-desc = This enables or disables the caption/window bar drag space on the r3dfox theme.
+
+r3dfox-colors =
+    .label = Use r3dfox colors
+
+r3dfox-colors-desc = This enables or disables the r3dfox colors.
+
+r3dfox-menubar =
+    .label = Transparent menubar
+
+r3dfox-menubar-desc = This removes the menubar background.
+
+r3dfox-navbar =
+    .label = Translucent design
+
+r3dfox-navbar-desc = This makes the tabs, navbar, urlbar, the top part of the UI all translucent.
+
+r3dfox-less-fog =
+    .label = Less intense caption bar fog
+
+r3dfox-less-fog-desc = This reduces the amount of fog drawn on the caption bar, letting you better see the Aero effects.
+
+r3dfox-fog =
+    .label = Enable caption bar fog
+
+r3dfox-fog-desc = This enables or disables caption bar fog completely.
+
+r3dfox-transparency =
+    .label = Force enable caption bar transparency
+
+r3dfox-transparency-desc = Force enables caption bar transparency, may have varying results.
+
+r3dfox-caption-text =
+    .label = White caption text
+
+r3dfox-caption-text-desc = Enable for white caption text.
+
+r3dfox-one-offs =
+    .label = Instant one off searches
+
+r3dfox-one-offs-desc = Enable for instant one off searches.
+
+r3dfox-e10s =
+    .label = (BETA) Disable e10s (multiprocess)
+
+r3dfox-e10s-desc = Disables e10s/electrolysis. There are still multiple processes from other browser components with this enabled. Not recommended unless you know what you are doing.
+
+r3dfox-accessibility = Accessibility services
+
+r3dfox-accessibility-desc = Recommended to disable if you do not need them for enhanced security and performance.
+
+## General Section - Startup
 
 startup-header = Startup
 

browser/themes/shared/icons/r3d_center.svg

@@ -104,6 +104,7 @@
   skin/classic/browser/tracking-protection-disabled.svg               (../shared/identity-block/tracking-protection-disabled.svg)
   skin/classic/browser/tracking-protection-active.svg                 (../shared/identity-block/tracking-protection-active.svg)
 
+  skin/classic/browser/r3d-toolbar-drag-indicator.svg                     (../shared/r3d-toolbar-drag-indicator.svg)
   skin/classic/browser/toolbar-drag-indicator.svg                     (../shared/toolbar-drag-indicator.svg)
 
   skin/classic/browser/protections/resolved-breach.svg         (../shared/protections/resolved-breach.svg)
@@ -226,6 +227,7 @@
   skin/classic/browser/tabbrowser/fullscreen-and-pointerlock.css (../shared/tabbrowser/fullscreen-and-pointerlock.css)
   skin/classic/browser/tabbrowser/loading.svg                  (../shared/tabbrowser/loading.svg)
   skin/classic/browser/tabbrowser/loading-burst.svg            (../shared/tabbrowser/loading-burst.svg)
+  skin/classic/browser/tabbrowser/r3d-tab-drag-indicator.svg       (../shared/tabbrowser/r3d-tab-drag-indicator.svg)
   skin/classic/browser/tabbrowser/tab-audio-playing-small.svg  (../shared/tabbrowser/tab-audio-playing-small.svg)
   skin/classic/browser/tabbrowser/tab-audio-muted-small.svg    (../shared/tabbrowser/tab-audio-muted-small.svg)
   skin/classic/browser/tabbrowser/tab-audio-blocked-small.svg  (../shared/tabbrowser/tab-audio-blocked-small.svg)
@@ -286,3 +288,10 @@
   skin/classic/browser/weather/night-partly-cloudy-with-showers.svg (../shared/weather/night-partly-cloudy-with-showers.svg)
   skin/classic/browser/weather/night-partly-cloudy-with-thunderstorms.svg (../shared/weather/night-partly-cloudy-with-thunderstorms.svg)
   skin/classic/browser/weather/night-mostly-cloudy-with-flurries.svg (../shared/weather/night-mostly-cloudy-with-flurries.svg)
+
+browser.jar:
+%  skin browser classic/1.0 %skin/classic/browser/
+ skin/classic/browser/r3dfox.css     (../shared/r3dfox.css)
+ skin/classic/browser/r3d_center.svg            (../shared/icons/r3d_center.svg)
+ skin/classic/browser/r3d_left_corner.svg            (../shared/icons/r3d_left_corner.svg)
+ skin/classic/browser/r3d_right_corner.svg            (../shared/icons/r3d_right_corner.svg) 

browser/themes/shared/icons/r3d_left_corner.svg

@@ -31,25 +31,17 @@
     }
   }
 
-  /* Add a fog for background tabs to be visible on Windows 7 glass window background */
-  @media (-moz-platform: windows-win7) {
-    @media (-moz-windows-default-theme) {
+  /* Black toolbar text for 7 to make stuffs visible */
+  @media (-moz-platform: windows-win7),
+         (-moz-platform: windows-win8) {
+    @media (-moz-windows-default-theme), (-moz-windows-compositor) {
       #TabsToolbar {
-        background-image: radial-gradient(ellipse at bottom, rgba(255,255,255,0.8), rgba(255,255,255,0.5) 40%, transparent);
         color: black;
         --toolbarbutton-icon-fill: currentColor;
       }
-    }
-  }
-
-  @media (-moz-windows-classic) {
-    :root[tabsintitlebar]:not([sizemode=fullscreen]) #TabsToolbar {
-      background-image: linear-gradient(transparent, ActiveCaption);
-      background-size: auto 200%;
-    }
-  
-    :root[tabsintitlebar]:not([sizemode=fullscreen]) #TabsToolbar:-moz-window-inactive {
-      background-image: linear-gradient(transparent, InactiveCaption);
+      :root {
+        --lwt-text-color: black !important;
+      }
     }
   }