README.md

Developer Documents for Firefox Custom

Table of Contents

• Basics
• Project-Specific
  • Environment
  • Project Structure
  • Rules
• Advanced Customizing
  • Smart Bookmarks
  • Policies
  • Preference
• User Custom CSS
  • Basics
  • Restrictions

Basics

The following documents may be helpful:

• Roadmap
• Each Versions Plan
• Wiki:Compatibility Issues Solution
• Wiki:Tips

Firefox Source Code:

• Github
• Searchfox
• Firefox Source Docs

Firefox Documents:

• Mozilla Support: Firefox advanced customization and configuration options
• Mozilla Support: Profiles - Where Firefox stores your bookmarks, passwords and other user data

Test for non-Mac users:

• Docker-OSX

If you have difficulty contributing, please feel free to click this link to explain.
I will help you as much as I know.

Project-Specific

Environment

git and yarn must be installed.

You can configure it as follows:

## clone repository
git clone https://github.com/black7375/Firefox-UI-Fix.git
cd ./Firefox-UI-Fix

## checkout branch
git checkout <BRANCH_NAME>

## env setup
yarn install

You can build with this command:

yarn build

You can check test and css validate:

## test - When you make mixin or function
# __tests__ directory, You can also find out how to use internal utils.
yarn test

## validate - Will be failed, this project uses non-standard features.
# Just use only for checking.
yarn validate

Project Structure

• Doc: Project_Structure.md

Rules

This is a rough guideline. (Not forced)

• Doc: Rules.md

Advanced Customizing

Smart Bookmarks

• Doc: Smart_Bookmarks.md

Policies

• Support Mozilla: Policies overview
• Policy Templates

Preference

• Doc: Preference.md

User Custom CSS

Basics

userChrome.css file is for browser UI, userContent.css file is for web contents.

Unlike User config, they are located in <FIREFOX_PROFILE>/chrome/.

Start Guide:

• What is userChrome.css? What can it do?
• How to Create a userChrome.css File
• Where to Find Style Recipes

CSS, SASS Documents:

• MDN: CSS
• MDN: Introducing the CSS Cascade
• MDN: Introducing the CSS Specific
• SASS(SCSS)
• SASS Live Compile

Live Debugging:

• Tutorial: How to create and live-debug userChrome.css
• Browser Toolbox
• Style Editor

Advanced CSS keywords:

• UDN: Chrome-only CSS reference
• UDN: Mozilla CSS extensions

Restrictions

• Doc: Restrictions.md