aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorCristiano Almeida <[email protected]>2016-11-26 14:18:41 +0000
committerCristiano Almeida <[email protected]>2016-11-26 14:18:41 +0000
commitdb5cb86b6ffaa0525b0078591adb7121152c072a (patch)
tree5992c4e32cacc0fe237ef50b9ca71f2cdcf2ea74
parent167153d1abfd4e068b11e37f1154ead2e09fff38 (diff)
downloadprotonmail-themes-db5cb86b6ffaa0525b0078591adb7121152c072a.tar.xz
protonmail-themes-db5cb86b6ffaa0525b0078591adb7121152c072a.zip
Added screenshots of themes. Updated readme.
Added a folder with all themes that are up-to-date. Now all folders are named in lowercase. Linked screenshots to readme file. Tweaked readme file text.
-rw-r--r--README.md29
-rw-r--r--Themes/v3.5.16/green_lume/green_lume_temp.css332
-rw-r--r--screenshots/blue_and_orange_3.5.16.pngbin0 -> 36610 bytes
-rw-r--r--screenshots/dark_bubble_gum_3.5.16.pngbin0 -> 36584 bytes
-rw-r--r--screenshots/green_lume_3.5.16.pngbin0 -> 36510 bytes
5 files changed, 24 insertions, 337 deletions
diff --git a/README.md b/README.md
index a4c801d..3ca9c57 100644
--- a/README.md
+++ b/README.md
@@ -1,11 +1,30 @@
# ProtonMail Themes
Since [v1.16](https://blog.protonmail.ch/protonmail-beta-v1-16-release-notes/), the encrypted mail service now allows themes using the Cascading Style Sheets! So feel free to pick one and use it. Now with [v3.5.16](https://blog.protonmail.ch/protonmail-beta-v2-0-release-notes/) comes updated theme goodness.
-## Version 3.0 of ProtonMail is here! (v3.5.16 to be precise)
+## Version v3.5.16 of ProtonMail is here!
-### How to use these
-Simply pick one from the themes folder and copy the code over to ProtonMail by heading over to **Settings**, click the **Appearance** tab and paste the code under the *Custom Theme* section and press save.
-The theme should be applied.
-### Feedback is amazing!
+### How to use a theme.
+1. Pick one from the themes folder in the repository.
+2. Select the theme and select the raw view to see all the code.
+3. Select all and copy the code.
+4. At ProtonMail's website head over to **Settings**, click the **Appearance** tab.
+5. Paste the code under the *Custom Theme* section and press save.
+*In order to remove a theme, press clear.*
+
+The theme should be applied and you should see the changes immediately.
+
+### Feedback is always good!
You like the themes in this repository but you have found a bug? Have awesome ideas? Want to say hello? Then feel free to get in touch via [twitter](https://twitter.com/_csalmeida) or [any other way](http://www.csalmeida.com/). Later :)
+
+### Available themes.
+Check out some of the available themes you can choose from.
+
+####[Green Lume v3.5.16](https://raw.githubusercontent.com/csalmeida/protonmail-themes/master/Themes/v3.5.16/green_lume/green_lume.min.css)
+![Screenshot of Green Lume theme.](screenshots/green_lume_3.5.16.png)
+
+####[Dark Bubble Gum v3.5.16](https://raw.githubusercontent.com/csalmeida/protonmail-themes/master/Themes/v3.5.16/dark_bubble_gum/dark_bubble_gum.min.css)
+![Screenshot of Dark Bubble Gum theme.](screenshots/dark_bubble_gum_3.5.16.png)
+
+####[Blue and Orange v3.5.16](https://raw.githubusercontent.com/csalmeida/protonmail-themes/master/Themes/v3.5.16/blue_and_orange/blue_and_orange.min.css)
+![Screenshot of Blue and Orange theme.](screenshots/blue_and_orange_3.5.16.png)
diff --git a/Themes/v3.5.16/green_lume/green_lume_temp.css b/Themes/v3.5.16/green_lume/green_lume_temp.css
deleted file mode 100644
index 79aad9d..0000000
--- a/Themes/v3.5.16/green_lume/green_lume_temp.css
+++ /dev/null
@@ -1,332 +0,0 @@
-/* =========================================== *
- * GREEN LUME 3.0 THEME BY CRISTIANO ALMEIDA
- *
- * @_csalmeida
- * http://www.csalmeida.com
- * https://www.behance.net/_csalmeida
- *
- * =========================================== */
-
-/* Frame (topbar and sidebar.) */
-
-header#pm_header {
- background: #1a1a1a;
-}
-
-body section.sidebar {
- background: #1a1a1a;
-}
-
-header#pm_header .logo {
- background: #1a1a1a;
-}
-
-/* Search bar */
-header#pm_header form.searchForm fieldset {
- background-color: #1a1a1a;
- border-radius: 2px;
-}
-
-header#pm_header form.searchForm fieldset button[type="button"] {
- background-color: #1a1a1a;
- color: #8cc63f;
- border-radius: 2px 0 0 2px;
-}
-
-header#pm_header form.searchForm fieldset button[type="button"]:hover {
- background-color: #8cc63f;
- color: #fff;
-}
-
-header#pm_header form.searchForm fieldset #closeAdvSearch, header#pm_header form.searchForm fieldset button[type="submit"] {
- color: #8cc63f;
- border-radius: 0 2px 2px 0;
-}
-
-.pm_form .input-icon .fa {
- color: #8cc63f;
-}
-
-/* Top Navigation */
-
-header#pm_header ul.navigation li.active a, header#pm_header ul.navigation li:hover a {
- border-top-color: #8cc63f !important;
-}
-
-header#pm_header ul.navigation li a strong {
- color: #fff;
-}
-
-header#pm_header ul.navigation li a .fa {
- color: #fff;
-}
-
-header#pm_header ul.navigation li a strong:hover {
- color: #8cc63f;
-}
-
-/* TN Dropdown Menu */
-header#pm_header .pm_buttons .pm_button.primary, header#pm_header .pm_buttons .pm_button.primary:hover {
- background-color: #8cc63f !important;
- border-color: #8cc63f !important;
-}
-
-/* TN Links Hover */
-header#pm_header-desktop ul.navigation li.active a, header#pm_header-desktop ul.navigation li:hover a {
- border-top-color: #8cc63f !important;
-}
-
-header#pm_header-desktop ul.navigation li.active a strong, header#pm_header-desktop ul.navigation li:hover a strong {
- color: #8cc63f;
-}
-
-header#pm_header-desktop ul.navigation li.active a .fa, header#pm_header-desktop ul.navigation li:hover a .fa {
- color: #8cc63f;
-}
-
-header#pm_header-desktop ul.navigation li.active a strong, header#pm_header-desktop ul.navigation li:hover a strong {
- color: #8cc63f;
-}
-
-/* Sidebar Navigation */
-section.sidebar a.compose {
- background-color: #8cc63f;
- border-color: #8cc63f;
-}
-
-section.sidebar a.compose:hover {
- background-color: #75ba1a;
- border-color: #75ba1a;
-}
-
-section.sidebar ul.menu li.active a i.fa {
- color: #8cc63f;
-}
-
-section.sidebar ul.menu li a i.fa {
- color: #373737;
-}
-
-section.sidebar ul.menu li a {
- color: #fff;
-}
-
-section.sidebar ul.menu li a:hover {
- color: #8cc63f;
-}
-
-/* Storage */
-
-section.sidebar div.footer .bar em {
- background-color: #8cc63f;
-}
-
-section.sidebar div.footer div.storage strong {
- color: #8cc63f;
-}
-
-section.sidebar div.footer a.version {
- color: #fff;
-}
-
-section.sidebar div.footer a.version:hover {
- color: #8cc63f;
-}
-
-/* Settings Navigation */
-
-#pm_settings .pm_tabs li.active a.pm_button {
- background: #fff !important;
- color: #1c1c1c;
-}
-
-#pm_settings .pm_tabs li a.pm_button {
- border-color: #1c1c1c;
- background: #1c1c1c;
- color: #fff;
-}
-
-#pm_settings .pm_tabs li a.pm_button:hover {
- background: #373737;
-}
-
-#pm_settings .pm_tabs {
- /*background: #2f2e2e;*/
- background: #474747;
-}
-
-/* Accounts Settings */
-.pm_button.primary {
- background-color: #373737;
- border-color: #373737;
-}
-
-.pm_button.primary:hover {
- background-color: #8cc63f;
- border-color: #8cc63f;
-}
-
-.pm_button.primary.disabled, .pm_button.primary[disabled] {
- background-color: #373737;
- border-color: #373737;
-}
-
-.pm_sort ul li .fa.fa-check {
- color: #1c1c1c;
-}
-
-/* Dashboard Settings */
-
-#pm_settings #plans header .link {
- color: #8cc63f;
-}
-
-#pm_settings #plans .plans .plan header {
- background: #1c1c1c;
- border: 1px solid #1c1c1c;
-}
-
-#pm_settings #plans .plans .plan .price, #pm_settings #plans .plans .plan h3 {
- color: #1c1c1c;
-}
-
-.pm_button.primary:active, .pm_button.primary:focus {
- background: #8cc63f;
- border-color: #8cc63f;
-}
-
-html.protonmail .text-purple {
- color: #8cc63f;
-}
-
-/* Label Settings */
-
-.pm_button.round {
- border-radius: 2px;
- border: 1px solid #7b7b7b;
-}
-
-.pm_button.round .fa {
- color: #8cc63f;
-}
-
-/* Security Settings */
-.pm_button {
- color: #1c1c1c;
-}
-
-.pm_table td {
- color: #1c1c1c;
-}
-
-/* Contacts */
-.pm_table th a {
- color: #1c1c1c;
-}
-
-.pm_table th .fa {
- color: #1c1c1c;
-}
-
-/* Report Bug */
-.pm_toggle.off .off {
- background: #8cc63f;
-}
-
-p a {
- color: #8cc63f;
-}
-
-/* Links */
-
-.pm_button.link {
- color: #8cc63f;
-}
-
-/* Inbox */
-
-.pm_buttons a {
- color: #1c1c1c;
-}
-
-body #conversation-list-rows .conversation.read {
- color: #1c1c1c !important;
-}
-
-/* Reading e-mail. */
-#conversation-view .message .toggleDetails {
- color: #8cc63f;
-}
-
-#pm_conversations.rows .list .message.selected {
- border-left: 5px solid #8cc63f;
-}
-
-/* Composing e-mail */
-#pm_composer .composer header {
- background: #2c2b2b;
-}
-
-#pm_composer .composer header .pm_button {
- color: #8cc63f;
-}
-
-#pm_composer .composer footer .pm_button.primary {
- background: #8cc63f;
- border-color: #8cc63f;
-}
-
-#pm_view article.message .toggleDetails {
- color: #8cc63f;
-}
-
-#pm_view article.message a.compose {
- color: #1c1c1c;
-}
-
-/* Notifications */
-body .cg-notify-message.notification-success {
- background-color: #8cc63f;
- border-color: #8cc63f;
-}
-
-/* Tootips */
-
-/*
-div.tooltip.inner {
- background: #2c2b2b !important;
-}*/
-
-/* Mobile 1030px */
-header#pm_header a.logoMobile {
- color: #fff;
-}
-
-header#pm_header .compose {
- background-color: #8cc63f;
-}
-
-body.secure section#pm_sidebarMobile {
- background-color: #1c1c1c;
-}
-
-section#pm_sidebarMobile .pm_button.round {
- background-color: #373737;
-}
-
-section#pm_sidebarMobile .pm_button.round .fa {
- color: #8cc63f;
-}
-
-/* Mobile 500px */
-header#pm_header .compose {
- color: #8cc63f;
-}
-
-header#pm_header > a.logoMobile {
- color: #fff;
-}
-
-header#pm_header > a {
- color: #8cc63f;
-} \ No newline at end of file
diff --git a/screenshots/blue_and_orange_3.5.16.png b/screenshots/blue_and_orange_3.5.16.png
new file mode 100644
index 0000000..2866c03
--- /dev/null
+++ b/screenshots/blue_and_orange_3.5.16.png
Binary files differ
diff --git a/screenshots/dark_bubble_gum_3.5.16.png b/screenshots/dark_bubble_gum_3.5.16.png
new file mode 100644
index 0000000..53a09bc
--- /dev/null
+++ b/screenshots/dark_bubble_gum_3.5.16.png
Binary files differ
diff --git a/screenshots/green_lume_3.5.16.png b/screenshots/green_lume_3.5.16.png
new file mode 100644
index 0000000..698cf4a
--- /dev/null
+++ b/screenshots/green_lume_3.5.16.png
Binary files differ