diff options
23 files changed, 887 insertions, 61 deletions
@@ -109,8 +109,10 @@ At the time I created these themes I've received a few directions from ProtonMai > **Required for theme creation only** Install [NodeJS](https://nodejs.org/en/), after forking/cloning this repository install dependencies: -``` + +```bash cd protonmail-themes +# Requires Node v13.0.1, run `nvm use` to set the correct version. npm install ``` diff --git a/templates/@theme-base/_full.scss b/templates/@theme-base/_full.scss index 4773605..194ff76 100644 --- a/templates/@theme-base/_full.scss +++ b/templates/@theme-base/_full.scss @@ -42,6 +42,10 @@ body { background: $base; } +#pm_composer .composer .fill { + background: $base; +} + // Email tags present in new message window .autocompleteEmails-item { background-color: darken($base, 2%); diff --git a/templates/@theme-base/_styles.scss b/templates/@theme-base/_styles.scss index 9e32416..5069e84 100644 --- a/templates/@theme-base/_styles.scss +++ b/templates/@theme-base/_styles.scss @@ -34,6 +34,44 @@ $boxshadow-main: none; border: 1px solid darken($highlight, 5%); } +// Button classes +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: $main-bg-color; + border-color: $highlight; + color: $highlight; +} + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: $main-bg-color; + border-color: lighten($highlight, 5%); + color: lighten($highlight, 5%); +} + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: darken($highlight, 5%); + color: darken($highlight, 5%); +} + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: darken($highlight, 5%); + color: darken($highlight, 5%); +} + +// Disabled button +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: lighten($highlight, 40%); + border-color: lighten($highlight, 5%); + color: darken($highlight, 10%); +} + +.bg-primary { + background-color: lighten($main-bg-color, 5%); +} + +.color-primary { + color: $highlight; +} + // Aside links (other products) .aside-link { background: $secondary-bg-color; @@ -44,8 +82,13 @@ $boxshadow-main: none; background: none; } -// Storage indicator +// Message numbers +.navigation__counterItem { + background-color: darken($highlight, 10%); + color: lighten($text_color, 35%); +} +// Storage indicator .circle-chart__circle { stroke: $highlight; } @@ -85,6 +128,11 @@ $boxshadow-main: none; color: darken($highlight, 10%) !important; } +// Dropdown +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: $highlight; +} + // Compose window #pm_composer .composer, .composerInputMeta-overlay { @@ -93,6 +141,10 @@ $boxshadow-main: none; } } +#pm_composer .composer .fill { + background: $color-standard-text; +} + // Conversation items .conversation { &.marked::before { @@ -325,7 +377,7 @@ a:active, a:focus, a:hover, } // Contacts -.progress-contact { +.progress-contact, .progressbar { color: $highlight; &::-moz-progress-bar { diff --git a/templates/@theme-base/_version.scss b/templates/@theme-base/_version.scss index 46ddd83..a296ab8 100644 --- a/templates/@theme-base/_version.scss +++ b/templates/@theme-base/_version.scss @@ -1,2 +1,2 @@ // Used to update theme version across all themes. -$version: 'v4.0.0-beta15';
\ No newline at end of file +$version: 'v4.0.0-beta.20';
\ No newline at end of file diff --git a/themes/blue_and_orange/blue_and_orange.css b/themes/blue_and_orange/blue_and_orange.css index aa27898..a8482bc 100644 --- a/themes/blue_and_orange/blue_and_orange.css +++ b/themes/blue_and_orange/blue_and_orange.css @@ -1,6 +1,6 @@ /*! =========================================== * * BLUE AND ORANGE THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #eb6e23; border: 1px solid #eb6e23; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #0F4C5C; + border-color: #ED7D3A; + color: #ED7D3A; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #0F4C5C; + border-color: #ef8c51; + color: #ef8c51; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #eb6e23; + color: #eb6e23; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #eb6e23; + color: #eb6e23; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fef8f5; + border-color: #ef8c51; + color: #e06014; } + +.bg-primary { + background-color: #135e72; } + +.color-primary { + color: #ED7D3A; } + .aside-link { background: #0b3a46; } @@ -38,6 +67,10 @@ fill: #0b3a46; background: none; } +.navigation__counterItem { + background-color: #e06014; + color: white; } + .circle-chart__circle { stroke: #ED7D3A; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #e06014 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #ED7D3A; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #135e72; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #ED7D3A; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #e06014; } -.progress-contact { +.progress-contact, .progressbar { color: #ED7D3A; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #ED7D3A; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/blue_and_orange/blue_and_orange_full.css b/themes/blue_and_orange/blue_and_orange_full.css index e199ce8..6b2904f 100644 --- a/themes/blue_and_orange/blue_and_orange_full.css +++ b/themes/blue_and_orange/blue_and_orange_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * BLUE AND ORANGE THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #eb6e23; border: 1px solid #eb6e23; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #0F4C5C; + border-color: #ED7D3A; + color: #ED7D3A; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #0F4C5C; + border-color: #ef8c51; + color: #ef8c51; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #eb6e23; + color: #eb6e23; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #eb6e23; + color: #eb6e23; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fef8f5; + border-color: #ef8c51; + color: #e06014; } + +.bg-primary { + background-color: #135e72; } + +.color-primary { + color: #ED7D3A; } + .aside-link { background: #0b3a46; } @@ -38,6 +67,10 @@ fill: #0b3a46; background: none; } +.navigation__counterItem { + background-color: #e06014; + color: white; } + .circle-chart__circle { stroke: #ED7D3A; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #e06014 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #ED7D3A; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #135e72; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #ED7D3A; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #e06014; } -.progress-contact { +.progress-contact, .progressbar { color: #ED7D3A; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #ED7D3A; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #0F4C5C; } +#pm_composer .composer .fill { + background: #0F4C5C; } + .autocompleteEmails-item { background-color: #0e4553; border-color: #0e4553; } diff --git a/themes/dark_bubble_gum/dark_bubble_gum.css b/themes/dark_bubble_gum/dark_bubble_gum.css index 7fadb16..cb77866 100644 --- a/themes/dark_bubble_gum/dark_bubble_gum.css +++ b/themes/dark_bubble_gum/dark_bubble_gum.css @@ -1,6 +1,6 @@ /*! =========================================== * * DARK BUBBLE GUM THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #ed1543; border: 1px solid #ed1543; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1C1C1C; + border-color: #EF2D56; + color: #EF2D56; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1C1C1C; + border-color: #f14569; + color: #f14569; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #ed1543; + color: #ed1543; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #ed1543; + color: #ed1543; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fdebef; + border-color: #f14569; + color: #d9103b; } + +.bg-primary { + background-color: #292929; } + +.color-primary { + color: #EF2D56; } + .aside-link { background: #0f0f0f; } @@ -38,6 +67,10 @@ fill: #0f0f0f; background: none; } +.navigation__counterItem { + background-color: #d9103b; + color: white; } + .circle-chart__circle { stroke: #EF2D56; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #d9103b !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #EF2D56; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #292929; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #EF2D56; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #d9103b; } -.progress-contact { +.progress-contact, .progressbar { color: #EF2D56; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #EF2D56; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/dark_bubble_gum/dark_bubble_gum_full.css b/themes/dark_bubble_gum/dark_bubble_gum_full.css index 1c0bebb..a9d4b8e 100644 --- a/themes/dark_bubble_gum/dark_bubble_gum_full.css +++ b/themes/dark_bubble_gum/dark_bubble_gum_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * DARK BUBBLE GUM THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #ed1543; border: 1px solid #ed1543; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1C1C1C; + border-color: #EF2D56; + color: #EF2D56; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1C1C1C; + border-color: #f14569; + color: #f14569; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #ed1543; + color: #ed1543; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #ed1543; + color: #ed1543; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fdebef; + border-color: #f14569; + color: #d9103b; } + +.bg-primary { + background-color: #292929; } + +.color-primary { + color: #EF2D56; } + .aside-link { background: #0f0f0f; } @@ -38,6 +67,10 @@ fill: #0f0f0f; background: none; } +.navigation__counterItem { + background-color: #d9103b; + color: white; } + .circle-chart__circle { stroke: #EF2D56; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #d9103b !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #EF2D56; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #292929; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #EF2D56; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #d9103b; } -.progress-contact { +.progress-contact, .progressbar { color: #EF2D56; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #EF2D56; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #1C1C1C; } +#pm_composer .composer .fill { + background: #1C1C1C; } + .autocompleteEmails-item { background-color: #171717; border-color: #171717; } diff --git a/themes/deutera_one/deutera_one.css b/themes/deutera_one/deutera_one.css index 642f1dc..9d408a4 100644 --- a/themes/deutera_one/deutera_one.css +++ b/themes/deutera_one/deutera_one.css @@ -1,6 +1,6 @@ /*! =========================================== * * DEUTERA ONE THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #e6d500; border: 1px solid #e6d500; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #000076; + border-color: #ffed00; + color: #ffed00; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #000076; + border-color: #ffef1a; + color: #ffef1a; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #e6d500; + color: #e6d500; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #e6d500; + color: #e6d500; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fffbcc; + border-color: #ffef1a; + color: #ccbe00; } + +.bg-primary { + background-color: #000090; } + +.color-primary { + color: #ffed00; } + .aside-link { background: #00005d; } @@ -38,6 +67,10 @@ fill: #00005d; background: none; } +.navigation__counterItem { + background-color: #ccbe00; + color: white; } + .circle-chart__circle { stroke: #ffed00; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ccbe00 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #ffed00; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #000090; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #ffed00; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ccbe00; } -.progress-contact { +.progress-contact, .progressbar { color: #ffed00; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #ffed00; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/deutera_one/deutera_one_full.css b/themes/deutera_one/deutera_one_full.css index 86c5569..7730d50 100644 --- a/themes/deutera_one/deutera_one_full.css +++ b/themes/deutera_one/deutera_one_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * DEUTERA ONE THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #e6d500; border: 1px solid #e6d500; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #000076; + border-color: #ffed00; + color: #ffed00; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #000076; + border-color: #ffef1a; + color: #ffef1a; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #e6d500; + color: #e6d500; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #e6d500; + color: #e6d500; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #fffbcc; + border-color: #ffef1a; + color: #ccbe00; } + +.bg-primary { + background-color: #000090; } + +.color-primary { + color: #ffed00; } + .aside-link { background: #00005d; } @@ -38,6 +67,10 @@ fill: #00005d; background: none; } +.navigation__counterItem { + background-color: #ccbe00; + color: white; } + .circle-chart__circle { stroke: #ffed00; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ccbe00 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #ffed00; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #000090; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #ffed00; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ccbe00; } -.progress-contact { +.progress-contact, .progressbar { color: #ffed00; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #ffed00; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #000076; } +#pm_composer .composer .fill { + background: #000076; } + .autocompleteEmails-item { background-color: #00006c; border-color: #00006c; } diff --git a/themes/dracula/dracula.css b/themes/dracula/dracula.css index 9ad1c38..9a39907 100644 --- a/themes/dracula/dracula.css +++ b/themes/dracula/dracula.css @@ -1,6 +1,6 @@ /*! =========================================== * * DRACULA Theme - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Mike Barkmin * Website: www.barkmin.eu * Twitter: @mikebarkmin @@ -31,6 +31,35 @@ background: #ff60bb; border: 1px solid #ff60bb; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #282a36; + border-color: #FF79C6; + color: #FF79C6; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #282a36; + border-color: #ff93d1; + color: #ff93d1; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #ff60bb; + color: #ff60bb; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #ff60bb; + color: #ff60bb; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: white; + border-color: #ff93d1; + color: #ff46b0; } + +.bg-primary { + background-color: #333545; } + +.color-primary { + color: #FF79C6; } + .aside-link { background: #1d1f27; } @@ -38,6 +67,10 @@ fill: #1d1f27; background: none; } +.navigation__counterItem { + background-color: #ff46b0; + color: white; } + .circle-chart__circle { stroke: #FF79C6; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ff46b0 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #FF79C6; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #333545; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #FF79C6; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ff46b0; } -.progress-contact { +.progress-contact, .progressbar { color: #FF79C6; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #FF79C6; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/dracula/dracula_full.css b/themes/dracula/dracula_full.css index 06028c6..912bcc3 100644 --- a/themes/dracula/dracula_full.css +++ b/themes/dracula/dracula_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * DRACULA Theme - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Mike Barkmin * Website: www.barkmin.eu * Twitter: @mikebarkmin @@ -31,6 +31,35 @@ background: #ff60bb; border: 1px solid #ff60bb; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #282a36; + border-color: #FF79C6; + color: #FF79C6; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #282a36; + border-color: #ff93d1; + color: #ff93d1; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #ff60bb; + color: #ff60bb; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #ff60bb; + color: #ff60bb; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: white; + border-color: #ff93d1; + color: #ff46b0; } + +.bg-primary { + background-color: #333545; } + +.color-primary { + color: #FF79C6; } + .aside-link { background: #1d1f27; } @@ -38,6 +67,10 @@ fill: #1d1f27; background: none; } +.navigation__counterItem { + background-color: #ff46b0; + color: white; } + .circle-chart__circle { stroke: #FF79C6; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ff46b0 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #FF79C6; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #333545; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #FF79C6; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ff46b0; } -.progress-contact { +.progress-contact, .progressbar { color: #FF79C6; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #FF79C6; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #282a36; } +#pm_composer .composer .fill { + background: #282a36; } + .autocompleteEmails-item { background-color: #242530; border-color: #242530; } diff --git a/themes/green_lume/green_lume.css b/themes/green_lume/green_lume.css index 6d6d5c7..afa6008 100644 --- a/themes/green_lume/green_lume.css +++ b/themes/green_lume/green_lume.css @@ -1,6 +1,6 @@ /*! =========================================== * * GREEN LUME THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Tweets @_csalmeida @@ -31,6 +31,35 @@ background: #2aab65; border: 1px solid #2aab65; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1C1C1C; + border-color: #2FBF71; + color: #2FBF71; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1C1C1C; + border-color: #39ce7e; + color: #39ce7e; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #2aab65; + color: #2aab65; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #2aab65; + color: #2aab65; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #c8f2db; + border-color: #39ce7e; + color: #259659; } + +.bg-primary { + background-color: #292929; } + +.color-primary { + color: #2FBF71; } + .aside-link { background: #0f0f0f; } @@ -38,6 +67,10 @@ fill: #0f0f0f; background: none; } +.navigation__counterItem { + background-color: #259659; + color: white; } + .circle-chart__circle { stroke: #2FBF71; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #259659 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #2FBF71; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #292929; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #2FBF71; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #259659; } -.progress-contact { +.progress-contact, .progressbar { color: #2FBF71; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #2FBF71; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/green_lume/green_lume_full.css b/themes/green_lume/green_lume_full.css index b230bba..8dc194f 100644 --- a/themes/green_lume/green_lume_full.css +++ b/themes/green_lume/green_lume_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * GREEN LUME THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Tweets @_csalmeida @@ -31,6 +31,35 @@ background: #2aab65; border: 1px solid #2aab65; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1C1C1C; + border-color: #2FBF71; + color: #2FBF71; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1C1C1C; + border-color: #39ce7e; + color: #39ce7e; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #2aab65; + color: #2aab65; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #2aab65; + color: #2aab65; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #c8f2db; + border-color: #39ce7e; + color: #259659; } + +.bg-primary { + background-color: #292929; } + +.color-primary { + color: #2FBF71; } + .aside-link { background: #0f0f0f; } @@ -38,6 +67,10 @@ fill: #0f0f0f; background: none; } +.navigation__counterItem { + background-color: #259659; + color: white; } + .circle-chart__circle { stroke: #2FBF71; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #259659 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #2FBF71; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #292929; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #2FBF71; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #259659; } -.progress-contact { +.progress-contact, .progressbar { color: #2FBF71; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #2FBF71; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #1C1C1C; } +#pm_composer .composer .fill { + background: #1C1C1C; } + .autocompleteEmails-item { background-color: #171717; border-color: #171717; } diff --git a/themes/gruvbox/gruvbox.css b/themes/gruvbox/gruvbox.css index ac2b6f6..e81f28e 100644 --- a/themes/gruvbox/gruvbox.css +++ b/themes/gruvbox/gruvbox.css @@ -1,7 +1,7 @@ @charset "UTF-8"; /*! =========================================== * * GRUVBOX THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: AntoineÐ * Website: www.antoined.fr * Mastodon: @[email protected] @@ -33,6 +33,35 @@ background: #5d8f5f; border: 1px solid #5d8f5f; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #282828; + border-color: #689d6a; + color: #689d6a; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #282828; + border-color: #77a779; + color: #77a779; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #5d8f5f; + color: #5d8f5f; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #5d8f5f; + color: #5d8f5f; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #e4ede4; + border-color: #77a779; + color: #537f54; } + +.bg-primary { + background-color: #353535; } + +.color-primary { + color: #689d6a; } + .aside-link { background: #1b1b1b; } @@ -40,6 +69,10 @@ fill: #1b1b1b; background: none; } +.navigation__counterItem { + background-color: #537f54; + color: white; } + .circle-chart__circle { stroke: #689d6a; } @@ -70,10 +103,16 @@ .protonmail .text-purple:hover { color: #537f54 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #689d6a; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #353535; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #689d6a; } @@ -231,9 +270,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #537f54; } -.progress-contact { +.progress-contact, .progressbar { color: #689d6a; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #689d6a; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/gruvbox/gruvbox_full.css b/themes/gruvbox/gruvbox_full.css index 2bb9b20..f444914 100644 --- a/themes/gruvbox/gruvbox_full.css +++ b/themes/gruvbox/gruvbox_full.css @@ -1,7 +1,7 @@ @charset "UTF-8"; /*! =========================================== * * GRUVBOX THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: AntoineÐ * Website: www.antoined.fr * Mastodon: @[email protected] @@ -33,6 +33,35 @@ background: #5d8f5f; border: 1px solid #5d8f5f; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #282828; + border-color: #689d6a; + color: #689d6a; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #282828; + border-color: #77a779; + color: #77a779; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #5d8f5f; + color: #5d8f5f; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #5d8f5f; + color: #5d8f5f; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #e4ede4; + border-color: #77a779; + color: #537f54; } + +.bg-primary { + background-color: #353535; } + +.color-primary { + color: #689d6a; } + .aside-link { background: #1b1b1b; } @@ -40,6 +69,10 @@ fill: #1b1b1b; background: none; } +.navigation__counterItem { + background-color: #537f54; + color: white; } + .circle-chart__circle { stroke: #689d6a; } @@ -70,10 +103,16 @@ .protonmail .text-purple:hover { color: #537f54 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #689d6a; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #353535; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #689d6a; } @@ -231,9 +270,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #537f54; } -.progress-contact { +.progress-contact, .progressbar { color: #689d6a; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #689d6a; } .calendar-grid-heading[aria-pressed="true"] @@ -277,6 +316,9 @@ body { .composerInputMeta-overlay { background: #282828; } +#pm_composer .composer .fill { + background: #282828; } + .autocompleteEmails-item { background-color: #232323; border-color: #232323; } diff --git a/themes/inbox/inbox.css b/themes/inbox/inbox.css index 66484eb..612b936 100644 --- a/themes/inbox/inbox.css +++ b/themes/inbox/inbox.css @@ -1,6 +1,6 @@ /*! =========================================== * * INBOX - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: https://www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #2a75f3; border: 1px solid #2a75f3; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #F2F2F2; + border-color: #4285F4; + color: #4285F4; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #F2F2F2; + border-color: #5a95f5; + color: #5a95f5; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #2a75f3; + color: #2a75f3; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #2a75f3; + color: #2a75f3; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: white; + border-color: #5a95f5; + color: #1266f1; } + +.bg-primary { + background-color: white; } + +.color-primary { + color: #4285F4; } + .aside-link { background: #e5e5e5; } @@ -38,6 +67,10 @@ fill: #e5e5e5; background: none; } +.navigation__counterItem { + background-color: #1266f1; + color: white; } + .circle-chart__circle { stroke: #4285F4; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #1266f1 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #4285F4; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: white; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #4285F4; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #1266f1; } -.progress-contact { +.progress-contact, .progressbar { color: #4285F4; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #4285F4; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/monokai/monokai.css b/themes/monokai/monokai.css index d843403..307a39b 100644 --- a/themes/monokai/monokai.css +++ b/themes/monokai/monokai.css @@ -1,6 +1,6 @@ /*! =========================================== * * MONOKAI THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: tripscripts * Website: N/A * Twitter: N/A @@ -31,6 +31,35 @@ background: #7ab126; border: 1px solid #7ab126; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1D1E1A; + border-color: #89C62A; + color: #89C62A; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1D1E1A; + border-color: #96d435; + color: #96d435; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #7ab126; + color: #7ab126; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #7ab126; + color: #7ab126; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #e3f3c9; + border-color: #96d435; + color: #6c9c21; } + +.bg-primary { + background-color: #2a2c26; } + +.color-primary { + color: #89C62A; } + .aside-link { background: #10100e; } @@ -38,6 +67,10 @@ fill: #10100e; background: none; } +.navigation__counterItem { + background-color: #6c9c21; + color: white; } + .circle-chart__circle { stroke: #89C62A; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #6c9c21 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #89C62A; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #2a2c26; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #89C62A; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #6c9c21; } -.progress-contact { +.progress-contact, .progressbar { color: #89C62A; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #89C62A; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/monokai/monokai_full.css b/themes/monokai/monokai_full.css index 574d38e..ff6d3cf 100644 --- a/themes/monokai/monokai_full.css +++ b/themes/monokai/monokai_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * MONOKAI THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: tripscripts * Website: N/A * Twitter: N/A @@ -31,6 +31,35 @@ background: #7ab126; border: 1px solid #7ab126; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #1D1E1A; + border-color: #89C62A; + color: #89C62A; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #1D1E1A; + border-color: #96d435; + color: #96d435; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #7ab126; + color: #7ab126; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #7ab126; + color: #7ab126; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #e3f3c9; + border-color: #96d435; + color: #6c9c21; } + +.bg-primary { + background-color: #2a2c26; } + +.color-primary { + color: #89C62A; } + .aside-link { background: #10100e; } @@ -38,6 +67,10 @@ fill: #10100e; background: none; } +.navigation__counterItem { + background-color: #6c9c21; + color: white; } + .circle-chart__circle { stroke: #89C62A; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #6c9c21 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #89C62A; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #2a2c26; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #89C62A; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #6c9c21; } -.progress-contact { +.progress-contact, .progressbar { color: #89C62A; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #89C62A; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #1D1E1A; } +#pm_composer .composer .fill { + background: #1D1E1A; } + .autocompleteEmails-item { background-color: #181915; border-color: #181915; } diff --git a/themes/ochin/ochin.css b/themes/ochin/ochin.css index 72ba13c..046d332 100644 --- a/themes/ochin/ochin.css +++ b/themes/ochin/ochin.css @@ -1,6 +1,6 @@ /*! =========================================== * * OCHIN - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: https://www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #9ae161; border: 1px solid #9ae161; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #333E4C; + border-color: #A8E576; + color: #A8E576; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #333E4C; + border-color: #b6e98b; + color: #b6e98b; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #9ae161; + color: #9ae161; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #9ae161; + color: #9ae161; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: white; + border-color: #b6e98b; + color: #8ddd4b; } + +.bg-primary { + background-color: #3d4a5b; } + +.color-primary { + color: #A8E576; } + .aside-link { background: #29323d; } @@ -38,6 +67,10 @@ fill: #29323d; background: none; } +.navigation__counterItem { + background-color: #8ddd4b; + color: white; } + .circle-chart__circle { stroke: #A8E576; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #8ddd4b !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #A8E576; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #3d4a5b; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #A8E576; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #8ddd4b; } -.progress-contact { +.progress-contact, .progressbar { color: #A8E576; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #A8E576; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/ochin/ochin_full.css b/themes/ochin/ochin_full.css index 9960104..794e02d 100644 --- a/themes/ochin/ochin_full.css +++ b/themes/ochin/ochin_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * OCHIN - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: https://www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #9ae161; border: 1px solid #9ae161; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #333E4C; + border-color: #A8E576; + color: #A8E576; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #333E4C; + border-color: #b6e98b; + color: #b6e98b; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #9ae161; + color: #9ae161; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #9ae161; + color: #9ae161; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: white; + border-color: #b6e98b; + color: #8ddd4b; } + +.bg-primary { + background-color: #3d4a5b; } + +.color-primary { + color: #A8E576; } + .aside-link { background: #29323d; } @@ -38,6 +67,10 @@ fill: #29323d; background: none; } +.navigation__counterItem { + background-color: #8ddd4b; + color: white; } + .circle-chart__circle { stroke: #A8E576; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #8ddd4b !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #A8E576; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #3d4a5b; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #A8E576; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #8ddd4b; } -.progress-contact { +.progress-contact, .progressbar { color: #A8E576; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #A8E576; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #333E4C; } +#pm_composer .composer .fill { + background: #333E4C; } + .autocompleteEmails-item { background-color: #2f3946; border-color: #2f3946; } diff --git a/themes/vitamin_c/vitamin_c.css b/themes/vitamin_c/vitamin_c.css index 771a1e2..9878a9c 100644 --- a/themes/vitamin_c/vitamin_c.css +++ b/themes/vitamin_c/vitamin_c.css @@ -1,6 +1,6 @@ /*! =========================================== * * VITAMIN C THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #e46800; border: 1px solid #e46800; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #004358; + border-color: #FD7400; + color: #FD7400; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #004358; + border-color: #ff8218; + color: #ff8218; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #e46800; + color: #e46800; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #e46800; + color: #e46800; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #ffe2ca; + border-color: #ff8218; + color: #ca5d00; } + +.bg-primary { + background-color: #005672; } + +.color-primary { + color: #FD7400; } + .aside-link { background: #00303f; } @@ -38,6 +67,10 @@ fill: #00303f; background: none; } +.navigation__counterItem { + background-color: #ca5d00; + color: white; } + .circle-chart__circle { stroke: #FD7400; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ca5d00 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #FD7400; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #005672; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #FD7400; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ca5d00; } -.progress-contact { +.progress-contact, .progressbar { color: #FD7400; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #FD7400; } .calendar-grid-heading[aria-pressed="true"] diff --git a/themes/vitamin_c/vitamin_c_full.css b/themes/vitamin_c/vitamin_c_full.css index 7040aae..e0c70e9 100644 --- a/themes/vitamin_c/vitamin_c_full.css +++ b/themes/vitamin_c/vitamin_c_full.css @@ -1,6 +1,6 @@ /*! =========================================== * * VITAMIN C THEME - * Version: v4.0.0-beta15 + * Version: v4.0.0-beta.20 * Author: Cristiano Almeida * Website: www.csalmeida.com * Twitter: @_csalmeida @@ -31,6 +31,35 @@ background: #e46800; border: 1px solid #e46800; } +.pm-button--primaryborder-dark, .pm-button-blueborder-dark { + background: #004358; + border-color: #FD7400; + color: #FD7400; } + +.is-active.pm-button--primaryborder-dark, .is-hover.pm-button--primaryborder-dark, .pm-button--primaryborder-dark:focus, .pm-button--primaryborder-dark:focus-within, .pm-button--primaryborder-dark:hover, .pm-button--primaryborder-dark:not(div):active, .pm-button-blueborder-dark.is-active, .pm-button-blueborder-dark.is-hover, .pm-button-blueborder-dark:focus, .pm-button-blueborder-dark:focus-within, .pm-button-blueborder-dark:hover, .pm-button-blueborder-dark:not(div):active { + background: #004358; + border-color: #ff8218; + color: #ff8218; } + +.pm-button--primaryborder, .pm-button-blueborder { + border-color: #e46800; + color: #e46800; } + +.is-hover.pm-button--primaryborder, .pm-button--primaryborder:focus, .pm-button--primaryborder:focus-within, .pm-button--primaryborder:hover, .pm-button-blueborder.is-hover, .pm-button-blueborder:focus, .pm-button-blueborder:focus-within, .pm-button-blueborder:hover { + border-color: #e46800; + color: #e46800; } + +.is-disabled.pm-button--error, .is-disabled.pm-button--error.pm-button--info, .is-disabled.pm-button--error.pm-button--redborder, .is-disabled.pm-button--primary, .is-disabled.pm-button--primary.pm-button--info, .is-disabled.pm-button--primary.pm-button--redborder, .is-disabled.pm-button--warning, .is-disabled.pm-button--warning.pm-button--info, .is-disabled.pm-button--warning.pm-button--redborder, .pm-button--error.pm-button--info[disabled], .pm-button--error.pm-button--redborder[disabled], .pm-button--error[disabled], .pm-button--primary.pm-button--info[disabled], .pm-button--primary.pm-button--redborder[disabled], .pm-button--primary[disabled], .pm-button--warning.pm-button--info[disabled], .pm-button--warning.pm-button--redborder[disabled], .pm-button--warning[disabled], .pm-button-blue.is-disabled, .pm-button-blue.is-disabled.pm-button--info, .pm-button-blue.is-disabled.pm-button--redborder, .pm-button-blue.pm-button--info[disabled], .pm-button-blue.pm-button--redborder[disabled], .pm-button-blue[disabled], .pm-button.is-disabled.pm-button--error, .pm-button.is-disabled.pm-button--primary, .pm-button.is-disabled.pm-button--warning, .pm-button.pm-button--error[disabled], .pm-button.pm-button--primary[disabled], .pm-button.pm-button--warning[disabled], .pm-button.pm-button-blue.is-disabled, .pm-button.pm-button-blue[disabled] { + background-color: #ffe2ca; + border-color: #ff8218; + color: #ca5d00; } + +.bg-primary { + background-color: #005672; } + +.color-primary { + color: #FD7400; } + .aside-link { background: #00303f; } @@ -38,6 +67,10 @@ fill: #00303f; background: none; } +.navigation__counterItem { + background-color: #ca5d00; + color: white; } + .circle-chart__circle { stroke: #FD7400; } @@ -68,10 +101,16 @@ .protonmail .text-purple:hover { color: #ca5d00 !important; } +.dropDown-item-button:focus, .dropDown-item-button:hover, .dropDown-item-link:focus, .dropDown-item-link:hover { + color: #FD7400; } + #pm_composer .composer .composerHeader-container, .composerInputMeta-overlay .composerHeader-container { background: #005672; } +#pm_composer .composer .fill { + background: #fff; } + .conversation.marked::before { background: #FD7400; } @@ -229,9 +268,9 @@ a:active, a:focus, a:hover, .bg-pm-blue { background-color: #ca5d00; } -.progress-contact { +.progress-contact, .progressbar { color: #FD7400; } - .progress-contact::-moz-progress-bar { + .progress-contact::-moz-progress-bar, .progressbar::-moz-progress-bar { background: #FD7400; } .calendar-grid-heading[aria-pressed="true"] @@ -275,6 +314,9 @@ body { .composerInputMeta-overlay { background: #004358; } +#pm_composer .composer .fill { + background: #004358; } + .autocompleteEmails-item { background-color: #003b4e; border-color: #003b4e; } |