An oneline userChrome.css theme for Firefox, which aims to keep the Proton experience

  • By LR Tech
  • Last update: Dec 12, 2022
  • Comments: 3

Oneline Proton

An oneline userChrome.css theme for Firefox, which aims to keep the Proton experience.

Oneline Proton screenshot

Features

  • Minimal: Oneline Proton has been made trying to keep all the Proton experience, but with a cleaner interface.
  • Practical: The oneline interface allows you to keep a higher visible space and focus on what matters.
  • Clean: back/forward buttons keep hidden when disabled, and some url icons are hidden until you hover them.
  • Flexible: Support for compact, normal, and touch densities.
  • Themeable: You can still using custom themes with full compatibility.
  • Customizable: You are able to change settings like navbar's width, animation speed, and hidden elements at the top of the userChrome.css file.

Installation

  1. In the searchbar, type about:config. A dialog will be shown to you. Press the I accept the risk button.
  2. Search for toolkit.legacyUserProfileCustomizations.stylesheets and change it to True.
  3. Go to your Firefox profile:
    • In the searchbar, type about:support and press Enter.
    • Search for Profile Directory and click on Open Directory button.
  4. Create a folder and name it chrome (with lowercase).
  5. Paste userChrome.css file into the folder.
  6. Restart Firefox
  7. Enjoy your new Firefox!

Customization

  • You can change some settings inside the userChrome.css file.
  • Use --navbarWidth variable to change the width of the navbar (you can use px units for a fixed width, or vw units for a percentage one).
  • Use --animationSpeed variable to change (or disable) animations.
  • Hide or show the elements you want by commenting or uncommenting them:
/* This element is hidden */
/* "Shield" icon */
#tracking-protection-icon-container {display: none !important}

/* This element is visible */
/* This is the "Search with" indicator on the urlbar */
/* #urlbar-search-mode-indicator {display: none !important} */

Github

https://github.com/lr-tech/OnelineProton

Comments(3)

  • 1

    The drop-down bookmark of the bookmarks menu button cannot be clicked with the mouse

    Your css is very good to use, thank you! But when I put the bookmarks menu button next to the address bar, clicking the button will pop up the bookmarks, but not with the mouse, only with the up and down arrow keys

  • 2

    Pinned tab broken overlap

    When a tab is pinned, it overlaps the left-tab-scroll button and there's an odd empty space to the left of it.

    Pinned:

    2021-10-23T022800

    Unpinned:

    2021-10-23T022821

    (I made sure to test with the original userChrome too, without my small modifications - still present)

  • 3

    Space at top for dragging window

    This may be specific to Firefox on Windows, but I've found that when the tab bar is full there isn't anywhere at the top to drag the window in order to move it, or to quickly switch between fullscreen and windowed modes.

    Adding a small margin at the top of the window would fix this. I've found something like

    :root[sizemode="maximized"] #TabsToolbar {
  margin-top: 1px;
}

#TabsToolbar {
  margin-top: 5px;
}

    provides enough space so that finding the drag-able area isn't difficult in windowed mode and takes up minimal space while still being functional when fullscreen.

Popular Tag

Related