mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-31 04:59:21 +03:00
Add mobile version (beta)
This commit is contained in:
parent
1391648e1b
commit
b0ffd84ac6
76 changed files with 2945 additions and 845 deletions
|
|
@ -109,3 +109,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
html.rl-mobile .b-settings-content .legend {
|
||||
width: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -44,27 +44,27 @@ html.csstransitions.rl-started-trigger.no-mobile .b-login-content .loginFormWrap
|
|||
.transition(opacity 0.5s linear);
|
||||
}
|
||||
|
||||
.rl-anim {
|
||||
html.csstransitions.rl-started-delay {
|
||||
|
||||
&.csstransitions.no-mobile.rl-started-delay {
|
||||
|
||||
#rl-left {
|
||||
.transition(width 0.3s ease-out);
|
||||
}
|
||||
|
||||
#rl-right {
|
||||
.transition(left 0.3s ease-out);
|
||||
}
|
||||
|
||||
#rl-sub-left, #rl-sub-left .messageList .inputSearch {
|
||||
.transition(width 0.3s ease-out);
|
||||
}
|
||||
|
||||
#rl-sub-right {
|
||||
.transition(left 0.3s ease-out);
|
||||
}
|
||||
#rl-left {
|
||||
.transition(width 0.3s ease-out);
|
||||
}
|
||||
|
||||
#rl-right {
|
||||
.transition(~'left 0.3s ease-out, right 0.3s ease-out');
|
||||
}
|
||||
|
||||
#rl-sub-left, #rl-sub-left .messageList .inputSearch {
|
||||
.transition(width 0.3s ease-out);
|
||||
}
|
||||
|
||||
#rl-sub-right {
|
||||
.transition(left 0.3s ease-out);
|
||||
}
|
||||
}
|
||||
|
||||
.rl-anim {
|
||||
|
||||
&.cssanimations.csstransitions.no-mobile .b-login-content .errorAnimated {
|
||||
animation: login-form-shake 400ms ease-in-out;
|
||||
}
|
||||
|
|
@ -78,10 +78,6 @@ html.csstransitions.rl-started-trigger.no-mobile .b-login-content .loginFormWrap
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
/* &.csstransitions.no-mobile #rl-content {
|
||||
.transition(opacity 0.3s ease-out);
|
||||
}*/
|
||||
|
||||
&.csstransitions.no-mobile .btn-group.dropdown.colored-toggle.open .animate-this-icon-on-open {
|
||||
animation: bounce-me .5s linear;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -416,3 +416,18 @@
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
html.rl-mobile {
|
||||
.b-contacts-content {
|
||||
.b-list-content, .b-list-toolbar, .b-list-footer-toolbar {
|
||||
width: 170px;
|
||||
}
|
||||
.b-list-toolbar .e-search {
|
||||
width: 150px;
|
||||
}
|
||||
.b-view-content-toolbar, .b-view-content {
|
||||
left: 170px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -242,7 +242,7 @@
|
|||
max-width: fit-content;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
height: 20px;
|
||||
height: 19px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
|
@ -258,4 +258,16 @@ html.rl-left-panel-disabled, html.rl-left-panel-short {
|
|||
margin-top: 10px !important;
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
#rl-left {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
html.rl-mobile {
|
||||
.btn.buttonCompose {
|
||||
width: 100%;
|
||||
}
|
||||
.btn.buttonContacts {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -19,6 +19,22 @@
|
|||
min-height: 400px;
|
||||
}
|
||||
|
||||
html.rl-mobile {
|
||||
|
||||
#rl-center {
|
||||
min-width: 250px;
|
||||
min-height: 250px;
|
||||
}
|
||||
|
||||
&.rl-left-panel-enabled #rl-right {
|
||||
right: -150px;
|
||||
}
|
||||
|
||||
&.rl-left-panel-disabled #rl-right {
|
||||
left: 5px !important;
|
||||
}
|
||||
}
|
||||
|
||||
#rl-top {
|
||||
.g-ui-absolute-reset;
|
||||
bottom: auto;
|
||||
|
|
@ -353,3 +369,18 @@ html.rl-ctrl-key-pressed {
|
|||
margin-top: 20px;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
html.rl-mobile .hide-on-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.show-on-mobile {
|
||||
display: none;
|
||||
}
|
||||
|
||||
html.rl-mobile .show-on-mobile {
|
||||
display: initial;
|
||||
}
|
||||
html.rl-mobile .width100-on-mobile {
|
||||
width: 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
html.rl-no-preview-pane {
|
||||
|
||||
html.rl-no-preview-pane {
|
||||
.messageList.message-selected {
|
||||
display: none;
|
||||
}
|
||||
|
|
@ -15,6 +15,7 @@ html.rl-no-preview-pane {
|
|||
height: 30px;
|
||||
padding: 10px @rlMainBorderSize;
|
||||
z-index: 102;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.b-footer {
|
||||
|
|
@ -75,6 +76,7 @@ html.rl-no-preview-pane {
|
|||
height: 29px;
|
||||
padding: 10px 8px 10px 11px;
|
||||
z-index: 101;
|
||||
white-space: nowrap;
|
||||
|
||||
background-color: #eee;
|
||||
// #gradient > .vertical(#f4f4f4, #dfdfdf);
|
||||
|
|
@ -624,3 +626,9 @@ html.cssanimations.rl-anim .messageList .line-loading {
|
|||
cursor: pointer;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
html.rl-mobile {
|
||||
#rl-sub-left .messageList .inputSearch {
|
||||
width: 160px !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@ html.rl-no-preview-pane {
|
|||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: -2px;
|
||||
left: 0;
|
||||
height: 30px;
|
||||
padding: 10px 0;
|
||||
color: #fff;
|
||||
|
|
@ -120,6 +120,8 @@ html.rl-no-preview-pane {
|
|||
background-color: #f8f8f8;
|
||||
border-top: 0px;
|
||||
border-bottom: 1px solid #ddd;
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
z-index: 1;
|
||||
top: 0;
|
||||
left: 0;
|
||||
|
|
@ -159,6 +161,7 @@ html.rl-no-preview-pane {
|
|||
|
||||
.informationShort {
|
||||
margin-left: 22px;
|
||||
margin-right: 50px;
|
||||
a {
|
||||
.g-ui-link;
|
||||
}
|
||||
|
|
@ -563,6 +566,7 @@ html.rl-no-preview-pane .messageView {
|
|||
|
||||
.b-content {
|
||||
top: 50px;
|
||||
left: 0;
|
||||
bottom: @rlBottomMargin;
|
||||
right: @rlBottomMargin;
|
||||
border: @rlMainBorderSize solid @rlMainDarkColor;
|
||||
|
|
|
|||
|
|
@ -112,3 +112,7 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
html.rl-mobile .b-settings-content .legend {
|
||||
width: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-accounts {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.process-place {
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
|
|
@ -58,6 +62,8 @@
|
|||
|
||||
.account-item {
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
.e-action {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -103,6 +109,8 @@
|
|||
|
||||
.identity-item {
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
.e-action {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-filters {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.process-place {
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
|
|
@ -54,6 +58,8 @@
|
|||
|
||||
.filter-item {
|
||||
|
||||
white-space: nowrap;
|
||||
|
||||
.e-action {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-folders {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 35px;
|
||||
}
|
||||
|
||||
&.ignore-folder-subscribe {
|
||||
.subscribe-folder, .unsubscribe-folder {
|
||||
display: none;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-general {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.notification-desc-denied {
|
||||
color: #999;
|
||||
display: none;
|
||||
|
|
@ -20,7 +24,7 @@
|
|||
}
|
||||
|
||||
.flag-name {
|
||||
|
||||
|
||||
border-bottom: 1px dashed #555;
|
||||
cursor: pointer;
|
||||
padding: 2px 0px;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-open-pgp {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.process-place {
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,10 @@
|
|||
|
||||
.b-settings-templates {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.process-place {
|
||||
text-align: center;
|
||||
width: 600px;
|
||||
|
|
|
|||
|
|
@ -7,8 +7,16 @@
|
|||
}
|
||||
}
|
||||
|
||||
html.rl-mobile .b-settings-content .b-settings-theme .legend {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.b-themes-list {
|
||||
|
||||
html.rl-mobile &{
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.e-item {
|
||||
|
||||
display: inline-block;
|
||||
|
|
|
|||
|
|
@ -192,6 +192,4 @@ html.ssm-state-mobile .accountPlace {
|
|||
animation: thirdBar 1s infinite;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -174,11 +174,11 @@ html.rgba .g-ui-resizable-delimiter-highlight {
|
|||
}
|
||||
}
|
||||
|
||||
e-spinner {
|
||||
.e-spinner {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.e-powered {
|
||||
.e-powered, .e-mobile-switcher {
|
||||
margin-top: 8px;
|
||||
color: #333;
|
||||
a {
|
||||
|
|
|
|||
|
|
@ -382,3 +382,33 @@ html.no-rgba .modal {
|
|||
.control-label.remove-padding-top {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
html.rl-mobile {
|
||||
|
||||
.popups .modal {
|
||||
width: 100% !important;
|
||||
width: calc(~'100% - 20px') !important;
|
||||
}
|
||||
|
||||
.b-settings-content {
|
||||
padding: 10px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.list-table {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.form-horizontal {
|
||||
.control-group {
|
||||
.control-label {
|
||||
text-align: left;
|
||||
float: none;
|
||||
}
|
||||
.controls {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue