mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-09-07 00:17:03 +03:00
Improve SquireUI on mobile by placing toolbar fixed at bottom of screen (and top of touch keyboard)
This commit is contained in:
parent
385cd9588c
commit
d33f9710c2
4 changed files with 24 additions and 7 deletions
|
|
@ -5,7 +5,7 @@
|
||||||
width: 98%;
|
width: 98%;
|
||||||
max-width: 1000px;
|
max-width: 1000px;
|
||||||
margin: 10px auto;
|
margin: 10px auto;
|
||||||
min-height: calc(100% - 30px);
|
min-height: calc(100% - 44px);
|
||||||
|
|
||||||
.modal-body {
|
.modal-body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
@ -87,7 +87,7 @@
|
||||||
color: #333;
|
color: #333;
|
||||||
|
|
||||||
html.rl-mobile &{
|
html.rl-mobile &{
|
||||||
overflow: scroll;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.e-identity {
|
.e-identity {
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
.b-identity-content {
|
.b-identity-content {
|
||||||
|
|
||||||
&.modal {
|
&.modal {
|
||||||
width: 750px;
|
width: 800px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.modal-header {
|
.modal-header {
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,6 @@
|
||||||
.squire-toolbar {
|
.squire-toolbar {
|
||||||
overflow-x: auto;
|
overflow-x: auto;
|
||||||
|
overflow-y: hidden;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -18,7 +19,7 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
height: 1.5em;
|
height: 1.5em;
|
||||||
line-height: 1.7em;
|
line-height: 1.7;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
|
|
@ -30,10 +31,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.squire-toolgroup select {
|
.squire-toolgroup select {
|
||||||
width: 7em;
|
width: 7em !important;
|
||||||
}
|
}
|
||||||
.squire-toolgroup select[data-action="fontSize"] {
|
.squire-toolgroup select[data-action="fontSize"] {
|
||||||
width: 4em;
|
width: 4em !important;
|
||||||
}
|
}
|
||||||
.squire-toolgroup select[data-action="bold"] {
|
.squire-toolgroup select[data-action="bold"] {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
|
@ -76,3 +77,19 @@
|
||||||
.squire-mode-plain .squire-toolgroup:not(#squire-toolgroup-mode) {
|
.squire-mode-plain .squire-toolgroup:not(#squire-toolgroup-mode) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* @media (hover: none) */
|
||||||
|
.rl-mobile .squire-toolbar {
|
||||||
|
padding: 1px;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
.rl-mobile .squire-toolgroup > button,
|
||||||
|
.rl-mobile .squire-toolgroup > select,
|
||||||
|
.rl-mobile .squire-toolgroup > input[type="color"] {
|
||||||
|
height: 2.5em;
|
||||||
|
line-height: 2.8;
|
||||||
|
width: 3em;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -16,7 +16,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.cke_top {
|
.cke_top {
|
||||||
padding: 6px 4px 1px 6px !important;
|
padding: 6px 4px 1px 6px;
|
||||||
box-shadow: none !important;
|
box-shadow: none !important;
|
||||||
border-bottom: 1px solid #b6b6b6 !important;
|
border-bottom: 1px solid #b6b6b6 !important;
|
||||||
background: #F0F0F0 !important;
|
background: #F0F0F0 !important;
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue