- `userChrome.css` -> `css/leptonChrome.css` - `userContent.css` -> `css/leptonContent.css` This allows users to easily update lepton while still keepping their own custom styles Co-authored-by: anzz1 <>
3.2 KiB
Project Structure
Table of Contents
Basics
The overall structure of this project.
root
|- __tests__/: Mixin spec test
|- icons/: Icons, illustrations
|- docs/: Development Documents
|- src/: Source files
|- src/userChrome.scss: Entry of SCSS for Browser UI
|- src/userContent.scss: Entry of SCSS for Web pages
|- .gitattributes: Exclude at `Download Zip`
|- .github: Issue/PR Template, Github Actions
|- .prettierignore: Exclude coding style
|- .prettierrc.json: Coding style
|- install.ps1: Install script write in powersehll
|- install.sh: Install script write in bash
|- package.json: Build setup, package dependency
|- LEPTON: Meta infos (branch, version)
|- user.js: about:config settings
|- userChrome.css: Build result of src/userChrome.scss (Don't modify directly!!)
|- userContent.css: Build result of src/userContent.scss (Don't modify directly!!)
|- yarn.lock: Auto generated dependency (Don't modify directly!!)
Icon files
Most of them are made in SVG.
Except for illustrations, there must be an fill="context-fill" fill-opacity="context-fill-opacity" property to dynamically determine color and transparency.
Icons are mainly FirefoxUX/photon-icons
or microsoft/fluentui-system-icons.
Although not yet used, tabler/tabler-icons and feathericons/feather can also be referred to.
You can see more in the issue, Unify icon design langauge #213.
Install Scripts
Meta Info files
It comes from install.sh.
LEPTON file format
If this file exist in same directory as the userChrome.css file,
it is recognized as the "Lepton" installation directory.
[Info]
Branch=master | photon-style | proton-style
Ver=<git tag> | <git hash> | [NULL]
lepton.ini file Format
In lepton.ini, various information is stored during the installation process.
This file is recreated every time the installer is created.
[Profile Name]
Type=Local | Release | Git
Branch=master | photon-style | proton-style
Ver=<git tag> | <git hash> | [NULL]
Path=<Full PATH>
Update Policy according to Type
- Local(unknown): force latest commit update
- Release(): force latest tag update
- Git: latest commit update
Overriding
Inspired by arkenfox.
CSS settings are relatively simple.
userChrome-overrides.cssat<Firefox_Profile>/chrome/userContent-overrides.cssat<Firefox_Profile>/chrome/
user-overrides.js needs to use a shell script and has some priorities.
<Firefox_Profile>/user-overrides.js./user-overrides.js(Will be copied<Firefox_Profile>/chrome/)<Firefox_Profile>/chrome/user-overrides.js