diff --git a/images/attachfiles.svg b/images/attachfiles.svg index b8a5318a365bba2f9e1143789e6645815bc752df..92be2f323ceb280028972cda6e3bfde87ee32c82 100644 --- a/images/attachfiles.svg +++ b/images/attachfiles.svg @@ -1,4 +1,4 @@ - + diff --git a/images/contact.svg b/images/contact.svg index 2e52fb440de5e5771b820e58fc7d6da1be33ffab..8e900b9c821b2b36b628b0749e29bd3735909331 100644 --- a/images/contact.svg +++ b/images/contact.svg @@ -1,3 +1,3 @@ - + diff --git a/images/contactsmall.svg b/images/contactsmail.svg similarity index 87% rename from images/contactsmall.svg rename to images/contactsmail.svg index ca96c064fe40e2516ac4debf563dff53f11a186e..c9c2e1ed395562b771a524d373d6939cf11ce941 100644 --- a/images/contactsmall.svg +++ b/images/contactsmail.svg @@ -1,3 +1,3 @@ - + diff --git a/style.css b/style.css index 284431a16f12d89b6644a7ff96230fd7a41a68de..791c925958fb03cc66e55f3749d8bcc2095d85e7 100644 --- a/style.css +++ b/style.css @@ -50,7 +50,7 @@ --color-background-purple: rgba(176, 52, 240, 0.07); --color-background-light-second: #f9f9f9; --color-background-compose-error: #FFFFFF; - --color-background-thread:rgba(33, 33, 33, 0.08); + --color-background-thread: rgba(33, 33, 33, 0.08); --color-main-text: #222222; --color-main-text-alert: #222222; --color-text-maxcontrast: #767676; @@ -120,7 +120,7 @@ --color-primary-text-checkbox: #ffffff; --color-createfolder-text: #ffffff; --color-mail-text: rgba(0, 0, 0, 0.87); - --color-thread-text:rgba(0, 0, 0, 0.87); + --color-thread-text: rgba(0, 0, 0, 0.87); --color-compose-text: #ffffff; --color-primary-hover: #3282ae; --color-primary-light: #e5eff4; @@ -189,6 +189,8 @@ --attachment: url('/themes/Murena/snappymail/images/attachment.svg'); --file-text: url('/themes/Murena/snappymail/images/file-text.svg'); --folder: url('/themes/Murena/snappymail/images/folder.svg'); + --contactmail: url('/themes/Murena/snappymail/images/contactsmail.svg'); + --contact: url('/themes/Murena/snappymail/images/contact.svg'); --svg-color: rgb(0, 0, 0); --svg-color-second: rgba(255, 255, 255, 1); --svg-color-third: #333333; @@ -228,7 +230,7 @@ body.theme--dark { --color-background-purple: rgba(176, 52, 240, 0.07); --color-background-light-second: #3A3A3A; --color-background-compose-error: #131313; - --color-background-thread:rgba(255, 255, 255, 0.38); + --color-background-thread: rgba(255, 255, 255, 0.38); --color-main-text: #D8D8D8; --color-main-text-alert: #000000; --color-text-maxcontrast: #8c8c8c; @@ -298,7 +300,7 @@ body.theme--dark { --color-primary-text-checkbox: #000000; --color-createfolder-text: #121212; --color-mail-text: #ffffff; - --color-thread-text:#000000; + --color-thread-text: #000000; --color-primary-element-login: #ffffff; --color-compose-text: transparent; --color-primary-hover: #04537f; @@ -1524,7 +1526,7 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { font-weight: 600; font-size: 12px; line-height: 16px; - border-color: transparent;; + border-color: transparent; padding: 0 4px; margin-right: 5px; vertical-align: middle; @@ -2343,9 +2345,14 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { } #rl-app #rl-right #V-SystemDropDown .dropdown-menu.right-edge.show li a[data-i18n="GLOBAL/CONTACTS"]::before { content: ""; - background-image: url('/themes/Murena/snappymail/images/contactsmall.svg'); - background-position: center center; - background-repeat: no-repeat; + mask-image: var(--contactmail); + mask-position: center center; + mask-repeat: no-repeat; + -webkit-mask-image: var(--contactmail); + -webkit-mask-position: center center; + -webkit-mask-repeat: no-repeat; + background-color: var(--svg-color); + opacity: var(--svg-opacity); height: 24px; width: 24px; color: transparent; @@ -2628,9 +2635,14 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { font-weight: bold; } #rl-app #V-MailFolderList .buttonContacts { - background-image: url('/themes/Murena/snappymail/images/contact.svg'); - background-position: center center; - background-repeat: no-repeat; + mask-image: var(--contact); + mask-position: center center; + mask-repeat: no-repeat; + -webkit-mask-image: var(--contact); + -webkit-mask-position: center center; + -webkit-mask-repeat: no-repeat; + background-color: var(--svg-color); + opacity: var(--svg-opacity); height: 18px; color: transparent; padding: 4px 14px 4px 0; @@ -3139,9 +3151,14 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { } #rl-app #rl-popups #V-PopupsCompose .g-ui-user-select-none .btn.btn-danger.button-delete { - background-image: url('/themes/Murena/snappymail/images/delete-black.svg'); - background-position: center center; - background-repeat: no-repeat; + mask-image: var(--trash); + mask-position: center center; + mask-repeat: no-repeat; + -webkit-mask-image: var(--trash); + -webkit-mask-position: center center; + -webkit-mask-repeat: no-repeat; + background-color: var(--svg-color); + opacity: 0.3; height: 20px; width: 20px; color: transparent; @@ -3190,9 +3207,13 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { } #rl-app #V-PopupsCompose header .pull-right a.btn:nth-child(3) { - background-image: url('/themes/Murena/snappymail/images/compose-contact.svg'); - background-position: center 11px; - background-repeat: no-repeat; + mask-image: var(--contact); + mask-position: center 11px; + mask-repeat: no-repeat; + -webkit-mask-image: var(--contact); + -webkit-mask-position: center 11px; + -webkit-mask-repeat: no-repeat; + background-color: var(--svg-color); height: 18px; width: 24px; color: transparent; @@ -3347,9 +3368,14 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { opacity: 1; } #rl-app #V-PopupsContacts .b-header-toolbar.g-ui-user-select-none .btn-toolbar .btn:nth-child(3) { - background-image: url('/themes/Murena/snappymail/images/delete-black.svg'); - background-position: center center; - background-repeat: no-repeat; + mask-image: var(--trash); + mask-position: center center; + mask-repeat: no-repeat; + -webkit-mask-image: var(--trash); + -webkit-mask-position: center center; + -webkit-mask-repeat: no-repeat; + background-color: var(--svg-color); + opacity: var(--svg-opacity); height: 20px; width: 20px; color: transparent; @@ -3910,10 +3936,30 @@ html:not(rl-mobile) #rl-app .hideMessageListCheckbox .checkboxCheckAll { #rl-app .messageView .message-fixed-button-toolbar { top: 50px; } - #rl-app #messageItem table { + #rl-app #messageItem table, + #rl-app #messageItem table tr td img { filter:var(--invertfilter); } #rl-app #messageItem table tr td table { filter:invert(var(--invertfilter)); } - + #rl-app #rl-popups #V-PopupsContacts label[data-i18n="CONTACTS/TAB_BUSINESS"], + #rl-app #rl-popups #V-PopupsContacts label[data-i18n="CONTACTS/TAB_CRYPTO"], + #rl-app #rl-popups #V-PopupsContacts label[data-i18n="CONTACTS/TAB_CONTACT"] { + border: 1px solid var(--color-border-grey); + } + #rl-app #rl-popups #V-PopupsContacts .tabs>[id^=tab]:checked+label { + background: var(--color-border-second); + border: 1px solid var(--color-border-grey); + } + #rl-app #V-PopupsContacts .e-contact-item, + #rl-app #V-PopupsContacts .b-list-toolbar { + border-bottom: 1px solid var(--color-border-grey); + } + #rl-app #V-PopupsContacts .b-list-footer-toolbar, + #rl-app #V-PopupsContacts .b-view-content-toolbar { + border-top: 1px solid var(--color-border-grey); + } + #rl-app #V-PopupsContacts .right { + border-left: 1px solid var(--color-border-grey); + }