inital commit

README.md

@@ -0,0 +1,42 @@
+# firefox tweaks
+
+this is my firefox UI tweaks. they ~~remove bloat~~ reduce the amount of unnecessary clutter and maximize vertical space available for the actual sites.
+
+tested on ff106.0.2/arch/x11/kde.
+
+## setup:
+
+1. install and set up sidebery, or a similar tab management tool. these tweaks remove the default tab bar,
+   so you'll need something like this
+2. go to about:config, enable `browser.tabs.drawInTitlebar`
+3. figure out where your profile and install directories are.
+   open up about:support and find the profile directory and application binary points. they're near the top.
+   ![screenshot of about:support](readme-img/about_support.png)
+4. replicate the folder structure of the `profile` folder in this repo in your firefox profile folder
+5. replicate the folder structure of the `install` folder in this repo in your firefox install folder.
+   you will probably need root (or Administrator if on Windows) to write in this location.
+   take care to set the permissions on these files so that only root can write to them,
+   since these files allow for full (unsandboxed) access to the browser itself. reading the files
+   you put in there is highly encouraged!
+6. restart firefox
+
+### debugging notes
+
+the ui config script makes a few assumptions that may break with updates or conflict with other tweaks.
+debugging this is not hard, but you will need to use the full unsandboxed devtools.
+to access them, open devtools (f12) and go to settings (f1). then under advanced settings check these 3 boxes:
+
+![the settings are Service Workers over HTTP, browser chrome and add-on debugging, and remote debugging](readme-img/devtools_settings.png)
+
+then you can hit `ctrl+alt+shift+i`. this will open a devtools window,
+and a confirmation dialogue warning you about remote debugging having full access to your browser.
+hit ok (since you want to have devtools right now) and the devtools window should load.
+from there, you will have your usual js console, except it runs directly on the browser window itself.
+
+### js loader support
+
+i will not be providing support for loaders (like for example [alice0775's userChrome.js](https://github.com/alice0775/userChrome.js)).
+this script loads itself but the actual functionality is already broken out into a funciton,
+therefore adapting it to a loader should be fairly trivial.
+if you do adapt it let me know and i will add it to this repo!
+

install/config.js

@@ -0,0 +1,33 @@
+// add window management buttons to navbar
+// this allows full functionality while hiding the titlebar, see userChrome.css
+function applyCustomScriptToNewWindow(win) {
+    let windowbuttonbox = win.document.getElementsByClassName("titlebar-buttonbox")[1].cloneNode(true);
+    let privatebrowsing = win.document.getElementById("private-browsing-indicator-with-label").cloneNode(true);
+    //let spacer = win.document.getElementsByClassName("titlebar-spacer")[0].cloneNode(true);
+    // reusing the titlebar spacers has unintended side effects (namely them not showing up reliably)
+    let spacer = win.document.createElement("hbox");
+    spacer.style["display"] = "-moz-box";
+    // having some space to drag the window around is important on some setups
+    spacer.style["width"] = "40px";
+    let navbar = win.document.getElementById("nav-bar");
+    navbar.prepend(spacer); // nice consistent method naming you got there.
+    navbar.appendChild(privatebrowsing);
+    navbar.appendChild(windowbuttonbox);
+}
+
+try {
+    let { classes: Cc, interfaces: Ci, manager: Cm } = Components;
+    const {Services} = Components.utils.import('resource://gre/modules/Services.jsm');
+    function ConfigJS() { Services.obs.addObserver(this, 'chrome-document-global-created', false); }
+    ConfigJS.prototype = {
+        observe: function (aSubject) { aSubject.addEventListener('DOMContentLoaded', this, {once: true}); },
+        handleEvent: function (aEvent) {
+            let document = aEvent.originalTarget; let window = document.defaultView; let location = window.location;
+            if (/^(chrome:(?!\/\/(global\/content\/commonDialog|browser\/content\/webext-panels)\.x?html)|about:(?!blank))/i.test(location.href)) {
+                if (window._gBrowser) applyCustomScriptToNewWindow(window);
+            }
+        }
+    };
+    if (!Services.appinfo.inSafeMode) { new ConfigJS(); }
+} catch(ex) {};
+

install/defaults/pref/config-prefs.js

@@ -0,0 +1,5 @@
+// load bearing comment
+pref("general.config.obscure_value", 0);
+pref("general.config.filename", "config.js");
+pref("general.config.sandbox_enabled", false);
+

profile/chrome/userChrome.css

@@ -0,0 +1,78 @@
+@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
+@namespace html url("http://www.w3.org/1999/xhtml");
+
+browser[blank],
+browser[pendingpaint] {
+    opacity: 1 !important;
+}
+
+#TabsToolbar {
+    visibility: collapse !important;
+}
+
+/* Hide Firefox's default tab bar. */
+
+#sidebar-header {
+    display: none;
+/
+
+#sidebar-splitter {
+    border-radius: 0px !important;
+    background: #20152c;
+    border-width: 0px !important;
+    width: 5px !important;
+    box-shadow: 3px 1px 3px -3px inset #a569d8;
+}
+
+#main-window #appcontent {
+    margin-right: 39px
+}
+
+#main-window #sidebar-box {
+    right: 0;
+    position: fixed;
+    display: block;
+    min-width: 0px !important;
+    max-width: none !important;
+    width: 39px !important;
+    height: 100%;
+    overflow: hidden;
+    box-shadow: 0 0 8px 0 #00000064, 1px 0 0 0 #212121;
+    transition: all 0.12s;
+}
+
+#main-window #sidebar {
+    position: absolute;
+    min-width: 0px !important;
+    max-width: none !important;
+    left: 0;
+    top: 0;
+    right: auto;
+    bottom: auto;
+    width: 39px;
+    height: 100%;
+}
+
+/* Completely (almost) hide in fullscreen */
+#main-window[inFullscreen] #appcontent {
+    margin-left: 1px
+}
+
+#main-window[inFullscreen] #sidebar-box,
+#main-window[inFullscreen] #sidebar {
+    width: 1px !important;
+}
+
+/* Show on hover */
+#main-window #sidebar-box:hover,
+#main-window[inFullscreen] #sidebar-box:hover,
+#main-window #sidebar-box:hover #sidebar,
+#main-window[inFullscreen] #sidebar-box:hover #sidebar {
+    height: 100% !important;
+    width: 225px !important;
+}
+
+#main-window #sidebar-box:hover #sidebar:before {
+    transform: translateX(-100%);
+}
+