Skip to content

Repository files navigation

* Lepton (old name: Proton Fix)
  :PROPERTIES:
  :TOC:      :include all
  :END:


*Table of Contents*
:CONTENTS:
- [[#lepton-old-name-proton-fix][Lepton (old name: Proton Fix)]]
  - [[#introduction][Introduction]]
  - [[#installation-guide][Installation Guide]]
  - [[#why-proton][WHY Proton?]]
  - [[#why-not-proton][WHY Not Proton?]]
  - [[#padding-comparisons][Padding Comparisons]]
  - [[#sponsors--contributors][Sponsors & Contributors]]
  - [[#bug--questions][Bug / Questions?]]
  - [[#faq][FAQ]]
:END:

-----

🔔🔔 Does the theme not work after installation?

You should copy [[./user.js][ ~user.js~ ]] file before the theme works.

The option system depends on user configuration, and nothing applies without settings. \\
Also, real-time changes are difficult because of [[./docs/Restrictions.md#supports][technical limitations]] and require a restart.

Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-userjs][can be conflicted]] and should be explicitly set to =false=.

-----

🔔🔔 Is your Firefox version =v102= or lower?

You [[https://github.com/black7375/Firefox-UI-Fix/wiki/Compatibility-Issues-Solution#accent-color-at-v102-or-lower][have to set]] =userChrome.compatibility.accent_color= to =true= additionally.

-----

** Introduction
  [[https://wiki.mozilla.org/Firefox/Proton][Proton]] is Firefox's [[https://acorn.firefox.com/][new design]], starting from Firefox 89. \\
  [[https://firefoxux.github.io/photon/][Photon]] is the old design of Firefox which was used until version 88.

  Proton's [[#why-proton][overall feel is good]], but there were a few things I [[#why-not-proton][didn't like]] and wanted to improve. \\
  That's why this project was born, and Lepton to denote light theme layer.

  /Disclaimer:/ It works on *Firefox 89* and above!!
  | *Wiki*             |             |          |         |                               |      |                      |
  | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][Installation Guide]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Screenshots][Screenshots]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Tutorial][Tutorial]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options][Options]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Compatibility-Issues-Solution][Compatibility Issues Solution]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Tips][Tips]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Show-Off-Your-Config][Show Off Your Config]] |

  [[https://user-images.githubusercontent.com/25581533/119774062-20942280-beb1-11eb-80aa-c18dd52f18d7.png]]

 (Lepton's design ⬆️)

  @@html:<details>@@@@html:<summary>@@ *Feature List (Click)* @@html:</summary>@@

  - *Color*
    - Default light/dark theme contrast enhancement
    - Colorful context menu
    - More dark mode support
    - Windows/Mac/Linux system theme support
    - Windows 7 compatibility
  - *Icons*
    - Panel
    - Context Menu
    - Global Menu
    - Library's open context
    - Video Player
  - *Padding Narrower*
    - Tab
    - Panel
    - Menu
    - Density
    - Others…
  - *Tab Bar Layouts*
    - Tabs on Bottom
    - One Liner
    - Vertical Tab Support
  - *Tab Design*
    - General:
      - Connect with toolbar (buttons like tabs)
    - Selected:
      - Box Shadow: Highlight the selected tab
      - Bottom Rounding: Natural
    - MultiSelected
      - Adjust Color: Easily recognizable
    - Unselect:
      - Divide Line: React to hover like chrome
    - Unloaded:
      - Dimmed: Looks like inactive
    - Clipped:
      - Clearer Text: Adjusted clipped gradation
      - Closed Button: Visible on hover
    - Sound:
      - Remove Second Label
      - Show Favicon: Always show favicon
      - PIP Icon
    - Container Tab:
      - Highlight line position: Displayed under tab
  - *Button Design*
    - New tab: Looks like tab
  - *Activity Stream Design*
    - Search Bar:
      - Focused Shadow: Same as the accent color
      - Hand off to Awesomebar
    - Icons:
      - Size: Fill (Changes dynamically to your size)
  - *Error Page Design*
    - Illustrations: Restore error page illustrations
  - *Video Player*
    - Background Style
    - Size at fullscreen
  - *Fullscreen*
    - Overlap mode
  - *Others*
    - Animations
    - Hidden & Auto Hide
    - Activate calculator at address bar
    - Mouse pointer for each context

@@html:</details>@@

** Installation Guide

   *Installation script (experimental)*

   Linux/Mac users:
   #+BEGIN_SRC bash
   bash -c "$(curl -fsSL https://raw.githubusercontent.com/black7375/Firefox-UI-Fix/master/install.sh)"
   #+END_SRC

Windows users: Run with powershell ([[https://github.com/black7375/Firefox-UI-Fix/wiki/Compatibility-Issues-Solution#windows-7-powershell-script-not-works][Does not work at Win7?]])
   #+BEGIN_SRC powershell
   Powershell -c "Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iwr https://raw.githubusercontent.com/black7375/Firefox-UI-Fix/master/install.ps1 -useb | iex"
   #+END_SRC

   *Manual Installation*

   You can see the [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][installation guide]] with screenshots on the wiki.

  1. Download files
     - Click the green ":arrow_down: Code" button above
     - Select ":package: Download ZIP"
  2. Find your profile directory
     - Open =about:support= in a new tab
     - Find the =Profile Directory(Linux)= / =Profile Folder(Windows)= entry
     - Click the =Open Directory(Linux)= / =Open Folder(Windows)= button
  3. Copy downloaded files
     - Extract the downloaded zip file
     - Copy the =user.js= file to the previously opened profile directory
     - Create a new directory inside your profile directory called =chrome=
     - Copy the remaining files from the extracted zip-file into previously created the =chrome= directory
  4. Restart Firefox
     - Click the =Clear startup cache…= at the top of =about:support=

  If you prefer Photon, see [[https://github.com/black7375/Firefox-UI-Fix/tree/photon-style][Lepton's photon-style]].\\
  If you prefer Proton, see [[https://github.com/black7375/Firefox-UI-Fix/tree/proton-style][Lepton's proton-style]].


** WHY Proton?
   I think a lot has improved.

   [[https://user-images.githubusercontent.com/25581533/119773764-a6639e00-beb0-11eb-8023-498b6293c4b2.png]]

   (Proton's design ⬆️)

   - Neatly organized menu
   - Icon beautiful enough to remind you of Edge
   - Nice color scheme
   - Satisfied Rounding
   - Modal window & Scrollbar!!

** WHY Not Proton?
   However, there are also many flaws.

   [[https://user-images.githubusercontent.com/25581533/119773812-b5e2e700-beb0-11eb-923c-55ae1a8ca249.png]]

   (Photon's design ⬆️)

   - Is it a tab or a button?
   - Where are the menu icons?
   - Icons in ActivityStream are too small
   - Padding gaps are wide
   - ⚠️ Address bar 3-point menu, screenshot moves to toolbar (can't fix)

** Padding Comparisons
  [[https://user-images.githubusercontent.com/25581533/120262626-8c97d180-c289-11eb-87a6-68e285d6d77c.png]]
  [[https://user-images.githubusercontent.com/25581533/120253257-6ae11f00-c276-11eb-93cf-393f9845f30b.png]]
  [[https://user-images.githubusercontent.com/25581533/118402352-1e33fc00-b659-11eb-89fc-3cb38207fe39.png]]
  [[https://user-images.githubusercontent.com/25581533/124066951-0eb21c00-da29-11eb-9ac4-c6b82a268c6f.png]]

  - Photon (Quantum)
  - Proton
  - Lepton


** Sponsors & Contributors

Thanks to all sponsors & contributors to this project for providing help and developing features!

*Sponsors*

[[https://www.oss.kr/][https://user-images.githubusercontent.com/25581533/203210367-9f2eed69-666a-4218-acde-128892aa09d8.png]]
[[https://github.com/BrowserWorks][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/78850935?s=60&v=4"/>@@]]
[[https://github.com/ojaha065][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/37581768?s=60&v=4"/>@@]]
[[https://github.com/DPS0340][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/32592965?s=60&v=4"/>@@]]
[[https://github.com/ZachKnife1][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/114311925?s=60&v=4"/>@@]]
[[https://github.com/kanlukasz][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/30685349?s=60&v=4"/>@@]]
[[https://github.com/nikkehtine][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/27138416?s=60&v=4"/>@@]]
[[https://github.com/Babbiorsetto][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/36596647?s=60&v=4"/>@@]]
[[https://github.com/Mike-Kennelly][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/151653777?s=60&v=4"/>@@]]
[[https://github.com/Cyberax][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/1136550?s=60&v=4"/>@@]]
[[https://github.com/AuRiMaS666][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/59185222?s=60&v=4"/>@@]]
[[https://github.com/firefox9067][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/80527364?s=60&v=4"/>@@]]
[[https://github.com/Ygg01][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/1146204?s=60&v=4"/>@@]]
[[https://github.com/engelju][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/2188152?s=60&v=4"/>@@]]
[[https://github.com/xrstf][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/127499?s=60&v=4"/>@@]]
[[https://github.com/akwala][@@html:<img width="60" height="60" src="https://avatars.githubusercontent.com/u/1786?s=60&v=4"/>@@]]

- A donation was received on [[https://ko-fi.com/black7375][Ko-Fi]]
  - [[https://ko-fi.com/home/coffeeshop?txid=97e5fa0d-c73e-4308-a2fd-6b44b08cd828][Safira]]
  - [[https://ko-fi.com/duncanyoyo1][duncanyoyo1]]
  - [[https://ko-fi.com/home/coffeeshop?txid=a84c4838-f0e8-45b4-8b61-46684697e9b2][Minithra]]
  - [[https://github.com/black7375/Firefox-UI-Fix/issues/1095#issuecomment-3682151859][Kevin Ernst]]
- Private sponsors: 5

*Contributors*

[[https://github.com/black7375/Firefox-UI-Fix/graphs/contributors][@@html:<img src="https://contrib.rocks/image?repo=black7375/Firefox-UI-Fix"/>@@]]

A list of all contributors can be found in [[./CREDITS][CREDITS]].

** Bug / Questions?

If you found a bug, please contact [[https://github.com/black7375/Firefox-UI-Fix/issues][issue]]. \\
If you have any questions or inquiries, please contact [[https://github.com/black7375/Firefox-UI-Fix/discussions][discussions]].

** FAQ

  - *Black pixels around the selected tab bottom corners* \\
    [[https://user-images.githubusercontent.com/5571586/120401980-edf58a00-c2f5-11eb-9e64-ce50c5b189b2.png]]

  Please follow the [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][Installation Guide]], \\
  or set =about:config='s =svg.context-properties.content.enabled= to =true= .

  - *The closed button and some panel menu icons are not visible.* \\
    [[https://user-images.githubusercontent.com/77958663/130395848-7af58241-bbbf-4273-bb62-14382c44098d.png]]
    [[https://user-images.githubusercontent.com/25581533/120487528-93b40200-c3a5-11eb-98ad-3498beb9f38e.png]]

  Please follow the [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][Installation Guide]], \\
  or copy the =icons= directory to =chrome= .


  - *Less icons in the panel with photon-style*\\
    [[https://user-images.githubusercontent.com/25581533/123761424-5746c980-d8b1-11eb-9a0f-83fb305f9f08.png]]
    [[https://user-images.githubusercontent.com/25581533/123762962-d4bf0980-d8b2-11eb-8492-d497d330c72a.png]]

    I didn't put all the icons like before.\\
    [[https://user-images.githubusercontent.com/25581533/123602947-dd4b0d80-d7e8-11eb-93a6-2b263bdd99f7.png]]

Releases

Sponsor this project

Packages

Used by

Contributors

Languages