From 004378ed8c78d10051667479c1a699a4c4a23987 Mon Sep 17 00:00:00 2001 From: djmaze Date: Mon, 8 Feb 2021 17:37:21 +0100 Subject: [PATCH] Merge and cleanup more CSS rules --- dev/External/ko.js | 15 ++-- dev/Styles/Admin.less | 5 ++ dev/Styles/Compose.less | 14 ++++ dev/Styles/SettingsFolders.less | 2 +- dev/Styles/SystemDropDown.less | 62 ++++++--------- dev/Styles/_BootstrapFix.less | 78 ------------------- dev/Styles/_End.less | 28 +------ .../app/templates/Views/Admin/AdminPane.html | 2 +- .../templates/Views/User/MailFolderList.html | 6 +- .../templates/Views/User/MailMessageList.html | 31 ++++---- .../templates/Views/User/MailMessageView.html | 26 +++---- .../templates/Views/User/PopupsCompose.html | 10 +-- .../templates/Views/User/PopupsContacts.html | 12 +-- .../templates/Views/User/SettingsMenu.html | 2 +- .../templates/Views/User/SettingsPane.html | 4 +- .../templates/Views/User/SystemDropDown.html | 22 +++--- vendors/bootstrap/less/button-groups.less | 17 ++-- vendors/bootstrap/less/buttons.less | 35 ++++----- vendors/bootstrap/less/dropdowns.less | 4 +- vendors/bootstrap/less/forms.less | 2 +- vendors/bootstrap/less/mixins.less | 30 ------- vendors/bootstrap/less/variables.less | 2 +- 22 files changed, 136 insertions(+), 273 deletions(-) diff --git a/dev/External/ko.js b/dev/External/ko.js index e2bb9e875..02eb44f5b 100644 --- a/dev/External/ko.js +++ b/dev/External/ko.js @@ -157,20 +157,15 @@ ko.bindingHandlers.command = { const cl = element.classList, command = fValueAccessor(); - let result = command.enabled(); + let disabled = !command.enabled(); - cl.toggle('command-not-enabled', !result); + cl.toggle('no-disabled', !disabled); - if (result) { - result = command.canExecute(); - cl.toggle('command-can-not-be-execute', !result); - } - - ['command-disabled','disable','disabled'].forEach(s=>cl.toggle(s, !result)); - cl.toggle('no-disabled', !!result); + disabled = disabled || !command.canExecute(); + ['disable','disabled'].forEach(s => cl.toggle(s, disabled)); if (element.matches('INPUT,TEXTAREA,BUTTON')) { - element.disabled = !result; + element.disabled = disabled; } } }; diff --git a/dev/Styles/Admin.less b/dev/Styles/Admin.less index f7d33f3ed..7bdc56de5 100644 --- a/dev/Styles/Admin.less +++ b/dev/Styles/Admin.less @@ -106,3 +106,8 @@ padding-left: 30px; } } + +.btn.btn-logout { + padding-left: 12px; + padding-right: 12px; +} diff --git a/dev/Styles/Compose.less b/dev/Styles/Compose.less index 4b9b9f083..49c1d1a4e 100644 --- a/dev/Styles/Compose.less +++ b/dev/Styles/Compose.less @@ -180,3 +180,17 @@ } } } + +.minimize-custom { + border: 0 solid #333; + border-bottom-width: 3px; + display: inline-block; + float: right; + height: 20px; + width: 16px; + font-size: 20px; + font-weight: bold; + line-height: 20px; + margin-right: 15px; + cursor: pointer; +} diff --git a/dev/Styles/SettingsFolders.less b/dev/Styles/SettingsFolders.less index 1d6705afe..558cade17 100644 --- a/dev/Styles/SettingsFolders.less +++ b/dev/Styles/SettingsFolders.less @@ -51,7 +51,7 @@ } .unsubscribed-folder, .unchecked-folder { - opacity: 0.2; + opacity: 0.4; } } diff --git a/dev/Styles/SystemDropDown.less b/dev/Styles/SystemDropDown.less index 360b70897..8df3d1344 100644 --- a/dev/Styles/SystemDropDown.less +++ b/dev/Styles/SystemDropDown.less @@ -1,4 +1,16 @@ +#top-system-dropdown-id { + padding-left: 10px; + padding-right: 10px; +} + +.rl-left-panel-disabled #more-list-dropdown-id + .dropdown-menu { + position: fixed; + top: 40px; + right: auto; + left: 0; +} + .b-system-drop-down { .b-toolbar { @@ -10,18 +22,9 @@ z-index: 103; } - .e-facebook-name { - display: inline-block; - padding-top: 4px; - } - - .btn.system-dropdown { - padding-left: 10px; - padding-right: 10px; - } - - .button-fb-logout { - margin: 5px; + .dropdown-menu { + right: 0; + left: auto; } .email-title { @@ -42,27 +45,16 @@ } .audioPlace { - - font-size: 25px; - line-height: 30px; + display: inline-block; + font-size: 30px; + height: 30px; margin-right: 10px; - width: 25px; + width: 1em; .playIcon, .stopIcon { cursor: pointer; color: orange; text-shadow: 0 1px 0 #555; - float: right; - } - - .playIcon { - margin-top: 5px; - } - - .stopIcon { - font-size: 30px; - line-height: 30px; - margin-right: 10px; } .stopIcon { @@ -99,7 +91,6 @@ text-overflow: ellipsis; border-radius: 4px; font-weight: bold; - margin-right: 5px; white-space: nowrap; } @@ -157,31 +148,28 @@ .equaliser { - width: 20px; + margin-top: 5px; + width: 30px; height: 20px; position: relative; .bar { - float:left; width: 5px; height: 5px; background: orange; position: absolute; bottom:0; + animation: none; } - .first { - left: 0; - animation: none; + left: calc(1em / 2 - 10px); } .second { - left: 7px; - animation: none; + left: calc(1em / 2 - 2px); } .third { - left: 14px; - animation: none; + left: calc(1em / 2 + 6px); } &.animated { diff --git a/dev/Styles/_BootstrapFix.less b/dev/Styles/_BootstrapFix.less index 0aa03e82c..847e9edc5 100644 --- a/dev/Styles/_BootstrapFix.less +++ b/dev/Styles/_BootstrapFix.less @@ -7,20 +7,6 @@ label.inline, span.inline { display: inline-block; } -.minimize-custom { - border: 0 solid #333; - border-bottom-width: 3px; - display: inline-block; - float: right; - height: 20px; - width: 16px; - font-size: 20px; - font-weight: bold; - line-height: 20px; - margin-right: 15px; - cursor: pointer; -} - .legend { display: block; width: 100%; @@ -47,10 +33,6 @@ label.inline, span.inline { border-radius: 3px; } -select { - width: 223px; -} - .btn-small.btn-small-small { padding: 3px 9px; font-size: 11px; @@ -65,10 +47,6 @@ select { padding: 4px 7px; } -.btn.btn-nowrap { - white-space: nowrap; -} - .btn.btn-ellipsis { text-overflow: ellipsis; overflow: hidden; @@ -103,27 +81,11 @@ select { } } -.btn.btn-narrow { - padding-left: 12px; - padding-right: 12px; -} - .btn-group.btn-group-custom-margin > .btn + .btn { margin-left: 0; } -.btn.btn-large { - font-size: 17px; -} - -.btn-group + .btn-group { - margin-left: 3px; -} - .btn { - border-radius: @btnBorderRadius; - background-image: none; - // &:active { // .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.3), 0 0 0 rgba(0,0,0,.1)"); // } @@ -138,27 +100,12 @@ select { } } -.btn.btn-dark-disabled-border { - &.disabled, &[disabled] { - border-color: #aaa; - } -} - //.btn-group.open { // .dropdown-toggle { // .box-shadow(~"inset 0 2px 4px rgba(0,0,0,.3), 0 0 0 rgba(0,0,0,.1)"); // } //} -.btn.btn-success { - background-color: #84AB04; -} - -.btn-toolbar { - margin-top: 0; - margin-bottom: 0; -} - .dropdown-menu * + .dividerbar { margin-top: 9px; padding-top: 9px; @@ -168,35 +115,10 @@ select { */ } -.btn-group > .btn { - border-radius: 0 !important; -} - .btn-group > .btn.single { border-radius: @btnBorderRadius !important; } -.btn-group > .btn.first { - border-top-left-radius: @btnBorderRadius !important; - border-bottom-left-radius: @btnBorderRadius !important; -} - -.btn-group > .btn.last { - border-top-right-radius: @btnBorderRadius !important; - border-bottom-right-radius: @btnBorderRadius !important; -} - -.btn-group + .btn-group { - margin-left: 0; -} - -.btn-group { - margin-right: 3px; -} -.btn-group.btn-group-last { - margin-right: 0; -} - .dropdown.colored-toggle.open .btn.dropdown-toggle { color: #BD362F; diff --git a/dev/Styles/_End.less b/dev/Styles/_End.less index 4fffcac54..0b7fce786 100644 --- a/dev/Styles/_End.less +++ b/dev/Styles/_End.less @@ -4,30 +4,18 @@ min-width: 300px; } -.pswp__error-msg { - color: #ccc; - a, a:hover { - color: #fff; - } -} - -.pswp__img--placeholder { - opacity: 0; -} - -[data-rainloopTip], [data-rainloopErrorTip] { position: relative; } -[data-rainloopTip]::before, [data-rainloopErrorTip]::before { background: #fff; border-radius: 3px; border: 1px solid #999; - content: attr(data-rainloopTip); + color: red; + content: attr(data-rainloopErrorTip); font-size: 13px; left: 100%; - opacity : 0; + opacity: 1; padding: 0.25em; position : absolute; text-align: left; @@ -37,21 +25,11 @@ z-index: 2001 !important; } @media only screen and (max-width: 600px) { - [data-rainloopTip]::before, [data-rainloopErrorTip]::before { min-width: 60vw; white-space: normal; } } -[data-rainloopErrorTip]::before { - color: red; - content: attr(data-rainloopErrorTip); - opacity: 1; -} -[data-tooltip]:hover::before { - opacity : 1; -} -[data-rainloopTip]::after, [data-rainloopErrorTip]::after { border-color: transparent transparent #999 transparent; border-style: solid; diff --git a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html index 6e7a7d774..87532a786 100644 --- a/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html +++ b/snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html @@ -9,7 +9,7 @@
- +
diff --git a/snappymail/v/0.0.0/app/templates/Views/User/MailFolderList.html b/snappymail/v/0.0.0/app/templates/Views/User/MailFolderList.html index 9b2ec9b65..9dd692d5d 100644 --- a/snappymail/v/0.0.0/app/templates/Views/User/MailFolderList.html +++ b/snappymail/v/0.0.0/app/templates/Views/User/MailFolderList.html @@ -23,15 +23,15 @@