mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-31 21:19:21 +03:00
Reduce/simplify CSS footprint
This commit is contained in:
the-djmaze
parent
b03d35bc7a
commit
91b4ff16bd
28 changed files with 102 additions and 134 deletions
|
|
@ -10,7 +10,7 @@
|
|||
margin-right:1em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 410px) {
|
||||
@media screen and (max-width: 480px) {
|
||||
#advancedsearchform label {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -203,7 +203,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
@media screen and (max-width: @maxMobileWidth) {
|
||||
#V-PopupsContacts {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -208,24 +208,19 @@
|
|||
/**/
|
||||
}
|
||||
|
||||
.btn {
|
||||
&.buttonCompose {
|
||||
max-height: 2em;
|
||||
max-width: fit-content;
|
||||
overflow: hidden;
|
||||
width: calc(100% - 48px);
|
||||
}
|
||||
#rl-left .buttonCompose {
|
||||
max-height: 2em;
|
||||
max-width: fit-content;
|
||||
overflow: hidden;
|
||||
width: calc(100% - 48px);
|
||||
}
|
||||
|
||||
html.rl-left-panel-disabled {
|
||||
.buttonComposeText{
|
||||
.buttonComposeText,
|
||||
.buttonContacts {
|
||||
display: none;
|
||||
}
|
||||
.btn.buttonCompose {
|
||||
#rl-left .buttonCompose {
|
||||
width: auto;
|
||||
}
|
||||
.btn.buttonContacts {
|
||||
margin-top: 10px !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -152,13 +152,14 @@ html.rl-left-panel-disabled {
|
|||
}
|
||||
}
|
||||
|
||||
.resizer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @maxMobileWidth) {
|
||||
#rl-app {
|
||||
#V-SettingsPane {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
#rl-settings-subscreen {
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
|
|
@ -181,9 +182,7 @@ html.rl-left-panel-disabled {
|
|||
line-height: 2.5;
|
||||
}
|
||||
|
||||
.hide-mobile,
|
||||
#rl-left .resizer,
|
||||
#rl-right .resizer {
|
||||
.hide-mobile {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -195,44 +194,36 @@ html.rl-left-panel-disabled {
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
.rl-bottom-preview-pane #rl-right {
|
||||
.sm-msgView-bottom #rl-right {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.resizer {
|
||||
background: #aaa;
|
||||
background: rgba(255,255,255,0.5);
|
||||
display: none;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
z-index: 102;
|
||||
}
|
||||
.resizer:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
#rl-left > .resizer,
|
||||
.rl-side-preview-pane #V-MailMessageList .resizer {
|
||||
html:not(.rl-left-panel-disabled) #rl-left > .resizer,
|
||||
.sm-msgView-side #V-MailMessageList .resizer {
|
||||
cursor: ew-resize;
|
||||
cursor: col-resize;
|
||||
right: 0;
|
||||
display: block;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 5px;
|
||||
}
|
||||
.rl-bottom-preview-pane #V-MailMessageList .resizer {
|
||||
.sm-msgView-bottom #V-MailMessageList .resizer {
|
||||
cursor: ns-resize;
|
||||
cursor: row-resize;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 5px;
|
||||
}
|
||||
html:not(.rl-left-panel-disabled) #rl-left > .resizer,
|
||||
#V-MailMessageList .resizer {
|
||||
display: block;
|
||||
}
|
||||
html:not(.rl-bottom-preview-pane):not(.rl-side-preview-pane) #rl-right .resizer {
|
||||
display: none !important;
|
||||
left: 0;
|
||||
height: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
|
||||
#V-MailMessageList {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#V-MailMessageList.focused .messageList {
|
||||
|
|
@ -357,27 +359,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
html:not(.rl-bottom-preview-pane):not(.rl-side-preview-pane) {
|
||||
.message-selected #V-MailMessageList {
|
||||
display: none;
|
||||
}
|
||||
#V-MailMessageList {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
html:not(.sm-msgView-bottom):not(.sm-msgView-side) .message-selected #V-MailMessageList {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: @maxMobileWidth) {
|
||||
#V-MailMessageList .btn-toolbar:not(.hasChecked) .onCheckedShow {
|
||||
#V-MailMessageList .btn-toolbar:not(.hasChecked) .onCheckedShow,
|
||||
#V-MailMessageList .hasChecked .onCheckedHide {
|
||||
display: none;
|
||||
}
|
||||
#V-MailMessageList .hasChecked {
|
||||
.buttonCompose,
|
||||
.onCheckedHide,
|
||||
.sortFolder {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: @maxMobileWidth + 1px) {
|
||||
|
|
@ -396,23 +386,29 @@ html:not(.rl-bottom-preview-pane):not(.rl-side-preview-pane) {
|
|||
}
|
||||
}
|
||||
|
||||
.rl-side-preview-pane #V-MailMessageList {
|
||||
height: 100%;
|
||||
}
|
||||
.rl-side-preview-pane #V-MailMessageList .messageList {
|
||||
max-width: 50vw;
|
||||
min-width: 320px;
|
||||
overflow: auto;
|
||||
resize: horizontal;
|
||||
width: 35vw;
|
||||
.sm-msgView-side #V-MailMessageList {
|
||||
width: unset;
|
||||
|
||||
.messageList {
|
||||
max-width: 50vw;
|
||||
min-width: 320px;
|
||||
overflow: auto;
|
||||
resize: horizontal;
|
||||
width: 35vw;
|
||||
}
|
||||
}
|
||||
|
||||
.rl-bottom-preview-pane #V-MailMessageList .messageList {
|
||||
height: 35vh;
|
||||
max-height: 50vh;
|
||||
min-height: 200px;
|
||||
overflow: auto;
|
||||
resize: vertical;
|
||||
.sm-msgView-bottom #V-MailMessageList {
|
||||
height: unset;
|
||||
width: unset;
|
||||
|
||||
.messageList {
|
||||
height: 35vh;
|
||||
max-height: 50vh;
|
||||
min-height: 200px;
|
||||
overflow: auto;
|
||||
resize: vertical;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -437,7 +433,7 @@ html:not(.rl-bottom-preview-pane):not(.rl-side-preview-pane) {
|
|||
top: 0;
|
||||
}
|
||||
|
||||
.rl-side-preview-pane, .rl-mobile {
|
||||
.sm-msgView-side, .rl-mobile {
|
||||
|
||||
.messageListItem > div + div {
|
||||
flex-wrap: wrap;
|
||||
|
|
|
|||
|
|
@ -33,7 +33,7 @@
|
|||
#V-MailMessageView .top-toolbar {
|
||||
color: #fff;
|
||||
padding: 10px 0;
|
||||
visibility: hidden;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.messageView {
|
||||
|
|
@ -461,21 +461,19 @@
|
|||
}
|
||||
}
|
||||
|
||||
html:not(.rl-bottom-preview-pane):not(.rl-side-preview-pane) {
|
||||
html:not(.sm-msgView-bottom):not(.sm-msgView-side) {
|
||||
#rl-right:not(.message-selected) #V-MailMessageView {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
html.sm-msgView-side {
|
||||
#V-MailMessageView .top-toolbar {
|
||||
padding-left: 1px;
|
||||
visibility: visible;
|
||||
}
|
||||
.messageView {
|
||||
border: 1px solid var(--border-color, #aaa);
|
||||
box-shadow: var(--smMainShadow);
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
html.rl-bottom-preview-pane {
|
||||
html.sm-msgView-bottom {
|
||||
#V-MailMessageView .top-toolbar {
|
||||
display: none;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,9 +3,10 @@
|
|||
}
|
||||
|
||||
#V-PopupsOpenPgpKey {
|
||||
.key-viewer {
|
||||
pre {
|
||||
margin: 0;
|
||||
max-height: 500px;
|
||||
padding: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
|
@ -13,9 +14,8 @@
|
|||
#V-PopupsOpenPgpImport {
|
||||
max-width: 645px;
|
||||
|
||||
.inputKey {
|
||||
textarea {
|
||||
font-family: var(--fontMono);
|
||||
width: 600px;
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,8 +32,16 @@
|
|||
#V-SettingsPane {
|
||||
height: calc(100% - 50px - @rlLowMargin);
|
||||
margin: 50px @rlLowMargin 0 0;
|
||||
padding:20px;
|
||||
width: 100%;
|
||||
|
||||
background-color: var(--settings-bg-clr, #fff);
|
||||
border: 1px solid var(--border-color, #aaa);
|
||||
border-radius: var(--border-radius, 5px);
|
||||
box-shadow: var(--smMainShadow);
|
||||
overflow-y: auto;
|
||||
scroll-behavior: smooth;
|
||||
|
||||
.btn-toolbar {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
|
|
@ -46,18 +54,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
#rl-settings-subscreen {
|
||||
background-color: var(--settings-bg-clr, #fff);
|
||||
border: 1px solid var(--border-color, #aaa);
|
||||
border-radius: var(--border-radius, 5px);
|
||||
box-shadow: var(--smMainShadow);
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
padding:20px;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.firefox-drag #rl-settings-subscreen,
|
||||
.firefox-drag #V-SettingsPane,
|
||||
.firefox-drag .modal-body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue