• Lepton(old name: Proton Fix)
  • How to Install?
  • WHY Proton?
  • WHY Not Proton?
  • Padding Comparisons

Lepton(old name: Proton Fix)

proton is firefox's new design.
I want to fix some flaws.

Disclaimer: It works firefox 89 above!!

Wiki
Screenshots	Compatibility Issues Solution	Tips

(Fixed proton design)

• Icons

  • Panel

• Padding Narrower

  • Tab
  • Panel
  • Menu
  • Density

• 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

  • Clipped:

    • Cleary Text: Adjusted clipped gradation

  • Sound:

    • Remove Second Label
    • Show Favicon: Always show favicon

  • Pinned:

    • Combinded Close Button: Replace favicon to close button at selected

  • Container Tab:

    • Highlight line position: Displayed under favicon.

• Activity Stream Design

  • Search Bar:

    • Focused Shadow: Same as the accent color

  • Icons:

    • Size: Fill it up

How to Install?

1. Enable userChrome.css Support.

   • Go to about:config
   • toolkit.legacyUserProfileCustomizations.stylesheets to true
   • svg.context-properties.content.enabled to true

2. Find Profile Directory.

   • Go to about:support
   • Open Profile Directory

3. Copy File

   • create chrome directory at profile
   • copy files
4. Restart

WHY Proton?

I think a lot has improved.

(pure proton 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.

(proton before 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

• Photon (Quantum)
• Proton
• Proton Fix