overdodactyl
commented
6 years ago Hi @t2YU2m8l83, thanks for the suggestion. When ShadowFox started, all I had in the repo was the structure you are referring to. Unfortunately, there's a bug in Linux (that has far as I can tell from bugzilla has been around for years), that prevents the proper usage of @import statements. Given it's longevity and the fact Firefox no longer officially supports user*.css, I don't have much hope it will be fixed. As a workaround, all files in the css folder are combined into their respective file using gulp and concat-css.
The other issues at hand are that @import statements can only be used at the very top of a file. As such, it makes it impossible for a user's customized file to be imported and override SF defaults - this is why the _customization files are appended to the end of user*.css and the colorOverrides.css file is inserted after the original color definitions, but before the are ever used in another place.
While putting everything into a single file was done to workaround the bug, I do believe it has benefits for the average user. I haven't done any testing, but I have a feeling that a single file loads faster than having 50 @imports (this is certainly true in the case of webpages due to the extra HTTP requests, I'm not sure how true it holds when you have local files). Generally speaking, I believe it's typically deemed "best practice" to avoid imports when possible.
Additionally, I think it provides the simplest solution for the typical user. Instead of having a large number of files to worry about, they have the SF defaults, and a clean slate to work with in the customization folder if they need to make any minor changes. It also simplifies the updater since GitHub doesn't provide a great way to easily download only certain files or folders.
For those who desire more customization or prefer a layout like you mentioned, it may be beneficial to use ShadowFox via a git clone.
I would recommend giving this wiki entry a look:
https://github.com/overdodactyl/ShadowFox/wiki/Development
I hope this at least partially explains the rationale :)
t2YU2m8l83
For better structoring and better user customisation you should implement the css @import feature as mentioned below. This would also lower file size and you no longer have to touch the user customised css files.
You could also move browser addon styles to their own css files and import them.
EDIT: It might be an even smarter move to create ShadowFoxChrome.css/ShadowFoxContent.css files and import those into userChrome.css/userContent.css instead of writing the whole theme inside them. This way you could also get rid of your "[]_customization.css" files.
EDIT2: Silly me.. I only noticed now that you allready have the desired structure in the repository. Why don't keep it when installing it into firefox?