Comments (16)
It could be difficult but not impossible. In order to support both Firefox Color colours and Chrome colours I'd need rethink the way I enforce the Chrome colours (I currently override the CSS vars). I'd probably need to create a Firefox Color theme with Chrome colours, but I'm not sure if this would be comprehensive enough.
I'll stick a pin in it for now. Currently just trying to get the standard themes working without losing the Chrome colours.
from materialfox.
Looks like it wouldn't be possible to perfectly match the Chrome colours with Firefox Color. If you decode the URLs with json-url you'll notice you can only change 7 colours (well, I guess you can infer that from the UI too), but with some carefully arranged CSS you could get 90% of the way there. It will no longer respect the dark colour scheme in private browsing mode so I'm hesitant to go any further right now.
from materialfox.
Sounds tricky! That's OK if it can't be helped. Just wanted to bring it to your attention. :)
from materialfox.
Started to address this in 166c6ad. Basically how it will work is, this theme will for the most part not enforce any specific colours - it will leave this up to the current Firefox theme, which would be Default, Light, Dark, or a custom theme. To make life easier, a Firefox add-on will be used to manage switching between the default themes, installed custom themes, and a Material Light and Material Dark theme embedded in the add-on itself. The Material Dark theme will be forced on when in private browsing mode. I'll maintain the Firefox add-on in a separate repository and it will be optional (but recommended).
See theme-compatibility branch (still a work in progress).
from materialfox.
Cool! That seems promising indeed.
from materialfox.
Could you try out MaterialFox Helper with the theme-compatibility branch and let me know how it goes? The theme should now be fully compatible with Firefox Color, regardless of whether you use the helper.
Due to the complex way in which themes can be installed (either via theme extensions or add-ons which directly modify the theme), it is quite difficult for the add-on to know exactly what theme is enabled so it might sometimes say a theme is enabled but in fact another add-on (like Firefox Color) is overriding it. This is evident if you select a theme in the MaterialFox Helper button, then open up Firefox Color and select a preset in there. The helper button isn't and can't be aware of the Firefox Color themes and will think you've still got the previous theme enabled. I'll make a few modifications later so it doesn't tell you a theme is enabled when it has actually been overridden.
from materialfox.
I will check it ASAP.
from materialfox.
Thanks! One thing I neglected to think about is the fact that the add-on doesn't store any settings so the theme will reset after restarting the browser. Will hopefully have this fixed in the next version.
from materialfox.
Added persistent storage and improved compatibility with Firefox Color. It's still not perfect because I don't have access to Firefox Color's theme data - only current theme. Got a few ideas to improve it. Until then, select Default as theme and then set your colours with Firefox Color. If you change the theme again through MaterialFox Helper, you'll need to go and redo you Firefox Color selection.
from materialfox.
I did a quick test; overall looks much better, although I noticed some themes are a little bugged whereby the address bar can be unreadable (light text on light background, etc.).
from materialfox.
Interesting! Thanks for trying it out. Looks like I need to force the urlbar text colour to ensure it is either light or dark, and not leave it up to the theme to set it directly. Thought I was already doing this but must have missed something.
The way it worked on Chrome when I tested was it either picks the regular light urlbar or dark urlbar and themes aren't allowed to affect it other than telling it to be the light or dark variant, and this is what I'm aiming for.
from materialfox.
I'm using vivaldifox for the moment and it seems to be working nice. I not sure how the extensions apply the colors but is working great in case you want an extensions that adapt the color from the site you visit like vivaldi browser.
from materialfox.
Should work even better with the windows-improvements branch. Just need to improve light theme compatibility.
from materialfox.
V2 has been released. https://www.ghacks.net/2018/10/03/style-firefox-with-firefox-color-version-2/
from materialfox.
Thanks @Keith94. V2 should not affect compatibility, just adds more customisation. The thing MaterialFox doesn't let you specifically change is the urlbar background and text colour, keeping in line with Chrome.
from materialfox.
Haven't done anything to improve light theme compatibility but I think it's good enough to merge into master. Will mark this as closed now, all theme compatibility changes are in master.
from materialfox.
Related Issues (20)
- Speaker icon is on top of the favicon HOT 1
- favicon not visible in pinned tabs that show the playing/muted audio icon. HOT 1
- FF89: Tabs are "bugging" if I pin one and open many HOT 2
- search bar icons much smaller than intended HOT 3
- e
- Some Context Menu Items on Video Elements Have Pointer-Events Disabled
- Loading animation HOT 6
- FF94.0.2 (x64): Tabs have unnecessary space above them when window is maximized HOT 2
- [Feature/element] broken when [doing something] HOT 1
- FF 97: Tab heights HOT 1
- Kodeak~ HOT 2
- Window close/minimize buttons got a margin HOT 1
- [Feature/element] URL bar completely white HOT 24
- How can I make my search bar rounded/circled same as Material Fox does? HOT 3
- Images on home page HOT 1
- [Feature/element] broken when [doing something]
- Address bar totally broken on any dark theme HOT 4
- URL Address Text has incorrect vertical padding while focused after opening new tab. HOT 1
- Is this project dead? HOT 16
- URLBar not centralized HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from materialfox.