mirror
/
Firefox-UI-Fix
mirror of https://github.com/black7375/Firefox-UI-Fix
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
Firefox-UI-Fix/docs/Project_Structure.md

3.7 KiB
Raw Permalink Blame History

Project Structure

Table of Contents

Basics

The overall structure of this project.

root
|- __tests__/: Mixin spec test
|- icons/: Icons, illustrations
|- css/: Build result of SCSS Files (Don't modify directly!!)
|- docs/: Development Documents
|- src/: Source files
|- src/leptonChrome.scss: Entry of SCSS for Browser UI
|- src/leptonContent.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 written in powershell
|- install.sh: Install script written in bash
|- package.json: Build setup, package dependency
|- LEPTON: Meta infos (branch, version)
|- user.js: about:config settings
|- userChrome.css: Entry of css for Browser UI (Modify only when customizing!!)
|- userContent.css: Entry of css for Web pages (Modify only when customizing!!)
|- yarn.lock: Auto generated dependency (Don't modify directly!!)

If you first come, it's a good idea to see the /src/leptonChrome.scss and leptonContent.scss files to understand the flow.

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/acorn-icons, 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 language #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.
These files need to use a shell script and has some priorities.

CSS override settings (userChrome-overrides.css, userContent-overrides.css) are relatively simple.

  • ./<CSS_OVERRIDES> (Will be copied <FIREFOX_PROFILE>/chrome/)
  • <FIREFOX_PROFILE>/chrome/<CSS_OVERRIDES>

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