csalmeida / quark Goto Github PK
View Code? Open in Web Editor NEWA theme creator for ProtonMail.
Home Page: https://demo.csalmeida.com/quark/
quark's People
Contributors
Stargazers
Watchers
quark's Issues
Problems with latest ProtonMail version (3.7.3)
The themes created don't bode well for the latest ProtonMail web client version (3.7.3). I'm aware that keeping the tool updated with the latest version may be troublesome, but I think it would be nice to show the compatibility version in the tool itself, just so anyone's aware right away of unforeseen issues.
(Colors are the default of the theme creator)
header#pm_header-desktop{background:#1A1A1A}header#pm_header-desktop ul.navigation{background:#1A1A1A}header#pm_header-desktop ul.navigation>li>a{color:#F2F2F2}header#pm_header-desktop ul.navigation>li>a:hover{color:#662D91}header#pm_header-desktop ul.navigation>li>a>span .fa{color:#F2F2F2}header#pm_header-desktop ul.navigation>li>a>span .fa{color:#F2F2F2}header#pm_header-desktop ul.navigation>li.active{box-shadow:0 6px 0 0 #662D91 inset;color:#662D91}header#pm_header-desktop ul.navigation>li:hover{box-shadow:0 6px 0 0 #662D91 inset;color:#662D91;border-radius:0px}header#pm_header-desktop ul.navigation>li .pm_dropdown .user b,header#pm_header-desktop ul.navigation>li .pm_dropdown .user strong,html.protonmail .help{color:#0d0d0d !important}header#pm_header-desktop ul.navigation>li .pm_dropdown .user b:hover,header#pm_header-desktop ul.navigation>li .pm_dropdown .user strong:hover,html.protonmail .help:hover{color:#0d0d0d}header#pm_header-desktop ul.navigation>li .pm_dropdown .pm_button.primary{background:#1A1A1A !important;color:#F2F2F2 !important}header#pm_header-desktop ul.navigation>li .pm_dropdown .pm_button.primary:hover{background:#662D91 !important;border-color:#662D91;color:#F2F2F2 !important}form.searchForm fieldset{background:#0C0C0c !important;border-radius:2px}form.searchForm fieldset input.query{background:#0C0C0c !important;color:#F2F2F2 !important;border-radius:2px}form.searchForm fieldset #closeAdvSearch,form.searchForm fieldset button[type=submit]{color:#F2F2F2}form.searchForm fieldset #closeAdvSearch:hover,form.searchForm fieldset button[type=submit]:hover{color:#662D91}form.searchForm fieldset button[type=button]{color:#F2F2F2;border-radius:2px}form.searchForm fieldset button[type=button]:hover{background:#0C0C0c;color:#662D91}form.searchForm #advancedSearchDropdown{border-radius:2px}form.searchForm.adv fieldset{border-radius:2px 2px 0 0}.pm_button.primary{background:#1A1A1A;border-color:#1A1A1A;color:#F2F2F2}.pm_button.primary:hover{background:#662D91;border-color:#662D91;color:#F2F2F2}.pm_button.primary:active,.pm_button.primary:focus{background:#1A1A1A;border-color:#1A1A1A;color:#F2F2F2}header#pm_header-desktop a.logo{background-color:#1A1A1A}body section.sidebar{background:#1A1A1A}body section.sidebar a.compose{background:#662D91;color:#F2F2F2}body section.sidebar a.compose:hover{background:#F2F2F2;border-color:#F2F2F2;color:#1A1A1A}body section.sidebar ul.menu li a{color:#F2F2F2}body section.sidebar ul.menu li a:hover{color:#662D91}body section.sidebar ul.menu li.active a,body section.sidebar ul.menu li.active a{color:#F2F2F2}body section.sidebar ul.menu li.active a i.fa,body section.sidebar ul.menu li.active a i.fa:hover{color:#662D91 !important;opacity:1}body section.sidebar ul.menu li a .fa-repeat{color:#F2F2F2;opacity:1}body section.sidebar ul.menu li a i.fa{color:#F2F2F2;opacity:0.5}body section.sidebar ul.menu li a i.fa:hover,body section.sidebar ul.menu li a:hover i.fa{color:#F2F2F2;opacity:1}body section.sidebar ul.menu li a em{color:#F2F2F2;opacity:0.5}body section.sidebar div.labels ul li a{color:#F2F2F2;opacity:0.5}body section.sidebar div.labels ul li a:hover{color:#F2F2F2;opacity:1}body section.sidebar div.footer div.link a,body section.sidebar a.version{color:#F2F2F2;opacity:0.5}body section.sidebar div.footer div.link a:hover,body section.sidebar a.version:hover{color:#662D91;opacity:1}body section.sidebar div.footer div.storage strong{color:#F2F2F2;opacity:0.5}body section.sidebar div.footer .bar em{background:#662D91;height:3px}body section.sidebar div.footer .bar{background:#F2F2F2;height:3px}.pm_buttons,.pm_buttons a{color:#1A1A1A}.conversation.marked::before{background:#662D91;width:5px}#pm_composer .composer header{background:#1A1A1A;color:#F2F2F2}p a{color:#662D91}#pm_composer .composer footer .pm_button{background:#F2F2F2;color:#1A1A1A}#pm_composer .composer footer .pm_button:hover{background:#F2F2F2;color:#1A1A1A}#pm_composer .composer footer .pm_button.primary{background:#1A1A1A;color:#F2F2F2}#pm_composer .composer footer .pm_button.primary:hover{background:#662D91;color:#F2F2F2}#pm_settings .pm_tabs{background:#e6eaf0}#pm_settings .pm_tabs li a.pm_button{color:#1A1A1A;border-color:#e6eaf0}#pm_settings .pm_tabs li a.pm_button:hover{color:#662D91}#pm_settings .pm_tabs li.active a.pm_button{color:#662D91}.pm_button.link{color:#662D91}.pm_toggle.off .off,.pm_toggle.on .on{background:#1A1A1A;color:#F2F2F2}.alert.alert-info{background:#e6eaf0;color:#000}html.protonmail .text-purple{color:#662D91}#pm_settings .bar em{background:#662D91;height:4px}#pm_settings .bar{background:#1A1A1A;opacity:0.5;height:4px}#plans .plans .plan h3{background:#1A1A1A;color:#F2F2F2}#plans .plans .plan.plus-plan h3 span,#plans .plans .plan.visionary-plan h3 span,#plans .plans .plan.visionary-plan header{color:#F2F2F2}#plans .plans .plan footer .cycle strong{color:#662D91}#plans .plans .plan footer .cycle .discount{border-color:transparent #662D91 transparent transparent}#plans .plans .plan footer .cycle .discount span{color:#F2F2F2}.pm_modal .modal-dialog{border-color:#1A1A1A}.pm_modal .modal-dialog .close{color:#F2F2F2;background:#1A1A1A}.pm_badge{color:#F2F2F2}.pm_badge.primary{background:#1A1A1A;color:#F2F2F2}.pm_badge.success{background:#662D91;color:#F2F2F2}.pm_table table th a,.pm_table table th .fa{color:#662D91}body .cg-notify-message.notification-success{background-color:#662D91;color:#F2F2F2}"Invalid input"
ProtonMail gives an Invalid input message when I click Save.
CSSlint.net gives warnings but the CSS is valid. I added spaces and line break before { and after }, but that didn't help.
What about customizing other areas?
Hi again!
What I really would like to have, is a dark skin: with light text and dark backgrounds.
Quark lets me do this for the framing UI, but not for
- the list of emails
- the composing window
Any chance you could add that?
I had made some theming a couple of months ago, but ProtonMail CSS updates broke it quite often, so I gave up :(
~No Issues~
I Have No Issues With This Project And Think It Is Awesome! Keep Up The Great Work!
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.