3.6 KiB
Restrictions
Table of Contents
Compatibility
Cross Platform
Different compatibility issues occur in Win7, Win8, Win10, KDE, Gnome, Mac, etc.
For example, The appearance of the context menu varies from platform to platform.
Consider compatibility as much as possible, but use dedicated media queries in special cases.
Bookmark menu is also similar example(code).
Firefox Version
There may be changes that change by version of Firefox.
It's more frequent than your thought, and we need to respond to compatibility between Nightly and ESR versions.
This project is using SCSS to make a reusable compatible mixins.
@include OS($linux) {
// Your CSS`
}
@include Dark {
// Your CSS`
}
Side Effect
Only CSS modifications can cause bugs that are hard to think of in the general web, such as the context menu not appearing.
Internals
CSS Loading Order
User CSS(userChrome.css, userContent.css) is usually loaded first.
In many cases, overriding should be prevented with important!(Anti-pattern in general web), and side effects should also be considered.
DOM structure cannot be modified
It is possible with JS(Autoconfig), but there are security and configuration issues, so we should make the most of CSS.
::before and ::after can indirectly add CSS elements.
Shadow DOM
Firefox actively uses shadow dom internally.
To modify, it is often a roundabout approach or impossible to inherit
XUL
Sometimes firefox can use XUL that have been written and binded with C++ for performance like a treeview of bookmarks.
There ar few appropriate documents, so we have to read the source code and work. (Ex. 1, 2)
Available CSS features are also restricted.
Example of legacy documents that will help.