Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-09-05 15:37:03 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Cleanup HTML and CSS

Browse source
This commit is contained in:
djmaze 2021-04-30 16:39:27 +02:00
parent d38a1acc24
commit 109c6b6ab5
28 changed files with 420 additions and 581 deletions
Download patch file Download diff file Expand all files Collapse all files

2
dev/Knoin/AbstractViews.js
View file

@ -92,7 +92,7 @@ export class AbstractViewCenter extends AbstractView
{ {
constructor(name, templateID) constructor(name, templateID)
{ {
super(name, templateID, ViewType.Center); super(name, templateID, ViewType.Content);
} }
} }

4
dev/Knoin/Knoin.js
View file

@ -18,7 +18,7 @@ export const ViewType = {
Popup: 'Popups', Popup: 'Popups',
Left: 'Left', Left: 'Left',
Right: 'Right', Right: 'Right',
Center: 'Center' Content: 'Content'
}; };
/** /**
@ -76,7 +76,7 @@ function buildViewModel(ViewModelClass, vmScreen) {
let vmDom = null; let vmDom = null;
const vm = new ViewModelClass(vmScreen), const vm = new ViewModelClass(vmScreen),
position = vm.viewModelPosition || '', position = vm.viewModelPosition || '',
vmPlace = position ? doc.querySelector('#rl-content #rl-' + position.toLowerCase()) : null; vmPlace = position ? doc.getElementById('rl-' + position.toLowerCase()) : null;
ViewModelClass.__builded = true; ViewModelClass.__builded = true;
ViewModelClass.__vm = vm; ViewModelClass.__vm = vm;

67
dev/Styles/Admin.less
View file

@ -1,51 +1,28 @@
.b-admin-left { #rl-left {
overflow: auto;
padding-top: 50px + @rlLowMargin + 10px;
.b-toolbar { nav {
position: absolute; a {
top: 0; color: var(--settings-menu-color, #333);
right: 0; cursor: pointer;
left: 0; display: block;
height: 34px; font-size: 18px;
padding: 8px 0 0 @rlLowMargin; line-height: 30px;
} padding: 4px 10px;
text-decoration: none;
.b-content {
position: absolute;
top: 50px + @rlLowMargin + 10px;
bottom: @rlLowMargin;
left: 0;
right: 0;
overflow: hidden;
.content {
-webkit-overflow-scrolling: touch;
} }
}
}
.b-admin-menu { a:focus, a:hover {
background-color: var(--settings-menu-hover-bg-color, #333);
color: var(--settings-menu-hover-color, #eee);
}
a { a.selected {
color: var(--settings-menu-color, #333); background-color: var(--settings-menu-selected-bg-color, #333);
cursor: pointer; color: var(--settings-menu-selected-color, #eee);
display: block; }
font-size: 18px;
height: 30px;
line-height: 29px;
overflow: hidden;
padding: 4px 10px;
text-decoration: none;
}
a:focus, a:hover {
background-color: var(--settings-menu-hover-bg-color, #333);
color: var(--settings-menu-hover-color, #eee);
}
a.selected {
background-color: var(--settings-menu-selected-bg-color, #333);
color: var(--settings-menu-selected-color, #eee);
} }
} }
@ -82,10 +59,6 @@
box-shadow: @rlMainShadow; box-shadow: @rlMainShadow;
border-radius: @rlMainBorderRadius; border-radius: @rlMainBorderRadius;
.content {
-webkit-overflow-scrolling: touch;
}
} }
} }

8
dev/Styles/Animations.less
View file

@ -25,7 +25,7 @@ html.rl-started-delay {
@media screen and (min-width: 1000px) { @media screen and (min-width: 1000px) {
html.rl-started-trigger .b-login-content .loginFormWrapper { html.rl-started-trigger .b-login-content {
/*transform: scale(1.1);*/ /*transform: scale(1.1);*/
transform: translateY(-20px); transform: translateY(-20px);
opacity: 0.5; opacity: 0.5;
@ -40,11 +40,7 @@ html.rl-started-delay {
font-weight: bold; font-weight: bold;
} }
.b-login-content .afterLoginHide { .b-login-content {
opacity: 0;
}
.b-login-content .loginFormWrapper {
transition: all 0.3s ease-out; transition: all 0.3s ease-out;
} }

2
dev/Styles/AnimationsUser.less
View file

@ -39,7 +39,7 @@
transition: margin 0.3s linear; transition: margin 0.3s linear;
} }
.b-folders .b-content.opacity-on-panel-disabled { #rl-left .b-content {
transition: opacity 0.3s linear; transition: opacity 0.3s linear;
} }

8
dev/Styles/Contacts.less
View file

@ -66,10 +66,6 @@
overflow-y: auto; overflow-y: auto;
scroll-behavior: smooth; scroll-behavior: smooth;
.content {
-webkit-overflow-scrolling: touch;
}
.listClear { .listClear {
text-align: center; text-align: center;
padding: 10px; padding: 10px;
@ -179,10 +175,6 @@
overflow: auto; overflow: auto;
border-left: 1px solid rgba(128,128,128,0.25); border-left: 1px solid rgba(128,128,128,0.25);
.content {
-webkit-overflow-scrolling: touch;
}
span { span {
height: 20px; height: 20px;
line-height: 20px; line-height: 20px;

4
dev/Styles/FolderList.less
View file

@ -58,10 +58,6 @@
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
min-width: 100px; min-width: 100px;
.content {
-webkit-overflow-scrolling: touch;
}
} }
hr { hr {

28
dev/Styles/Layout.less
View file

@ -5,7 +5,7 @@
background-position: center; background-position: center;
} }
#rl-center, #rl-left, #rl-right { #rl-left, #rl-right {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
@ -17,23 +17,8 @@
z-index: 0; z-index: 0;
} }
#rl-content {
height: 100%;
width: 100%;
}
#rl-center {
min-width: 600px;
min-height: 400px;
}
html.rl-mobile { html.rl-mobile {
#rl-center {
min-width: 250px;
min-height: 250px;
}
&:not(.rl-left-panel-disabled) #rl-right { &:not(.rl-left-panel-disabled) #rl-right {
right: -150px; right: -150px;
} }
@ -218,11 +203,10 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer,
z-index: 1100; z-index: 1100;
overflow: auto; overflow: auto;
background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3);
// -webkit-overflow-scrolling: touch;
} }
.b-settings-content { #rl-settings-subscreen {
padding:20px 20px 20px 30px; padding:20px;
} }
.dropdown-menu * + .dividerbar { .dropdown-menu * + .dividerbar {
@ -295,8 +279,8 @@ html:not(.rl-left-panel-disabled) #rl-left.resizable > .resizer,
left: 155px; left: 155px;
} }
.b-settings-content { #rl-settings-subscreen {
padding: 10px 10px 10px 20px; padding: 10px;
} }
.dropdown-menu a { .dropdown-menu a {
@ -319,7 +303,7 @@ html.rl-left-panel-disabled {
display: block; display: block;
} }
.opacity-on-panel-disabled { .b-content {
opacity: 0.3; opacity: 0.3;
} }

32
dev/Styles/LayoutAdmin.less
View file

@ -5,7 +5,7 @@
background-position: center; background-position: center;
} }
#rl-center, #rl-left, #rl-right { #rl-left, #rl-right {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
@ -17,16 +17,6 @@
z-index: 0; z-index: 0;
} }
#rl-content {
height: 100%;
width: 100%;
}
#rl-center {
min-width: 600px;
min-height: 400px;
}
#rl-left { #rl-left {
width: @rlLeftWidth; width: @rlLeftWidth;
} }
@ -45,11 +35,10 @@
z-index: 1100; z-index: 1100;
overflow: auto; overflow: auto;
background-color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.3);
// -webkit-overflow-scrolling: touch;
} }
.b-settings-content { #rl-settings-subscreen {
padding:20px 20px 20px 30px; padding: 20px;
} }
/* desktop */ /* desktop */
@ -72,13 +61,8 @@
/* mobile and tablet */ /* mobile and tablet */
@media screen and (max-width: 999px) { @media screen and (max-width: 999px) {
.b-settings-content { #rl-settings-subscreen {
padding: 10px 10px 10px 20px; padding: 10px;
}
#rl-center {
min-width: 250px;
min-height: 250px;
} }
html:not(.rl-left-panel-disabled) #rl-right { html:not(.rl-left-panel-disabled) #rl-right {
@ -87,11 +71,7 @@
html.rl-left-panel-disabled { html.rl-left-panel-disabled {
#rl-left { #rl-left {
width: 0px !important; width: 0 !important;
.opacity-on-panel-disabled {
opacity: 0.3;
}
} }
#rl-right { #rl-right {
left: 5px !important; left: 5px !important;

86
dev/Styles/Login.less
View file

@ -1,14 +1,12 @@
.RL-Login, .RL-AdminLogin {
.rl-view-model { position: fixed;
&.RL-Login, &.RL-AdminLogin { left: 50%;
position: fixed; top: 50%;
left: 50%; transform: translate(-50%, -50%);
top: 50%; width: 100%;
transform: translate(-50%, -50%); min-width: 250px;
width: 100%; max-width: 600px;
max-width: 450px; z-index: 5;
z-index: 5;
}
} }
@glass-color: #fff; @glass-color: #fff;
@ -17,9 +15,7 @@
.b-login-content { .b-login-content {
.loginFormWrapper { position: relative;
position: relative;
}
.descWrapper { .descWrapper {
color: var(--loading-color, #000); color: var(--loading-color, #000);
@ -29,13 +25,19 @@
text-shadow: var(--loading-text-shadow); text-shadow: var(--loading-text-shadow);
} }
.loginForm { .controls, .control-group {
margin-bottom: 25px;
}
form {
background-color: var(--login-bg-color, rgba(0, 0, 0, .5)); background-color: var(--login-bg-color, rgba(0, 0, 0, .5));
border: var(--login-border, 1px solid rgba(255, 255, 255, .2)); border: var(--login-border, 1px solid rgba(255, 255, 255, .2));
border-radius: var(--login-border-radius, 7px); border-radius: var(--login-border-radius, 7px);
box-shadow: var(--login-box-shadow); box-shadow: var(--login-box-shadow);
color: var(--login-color, @glass-m-color); color: var(--login-color, @glass-m-color);
margin: 0; margin: 0;
padding: 40px 40px 20px 40px;
position: relative;
* { * {
color: var(--login-color, @glass-m-color); color: var(--login-color, @glass-m-color);
@ -52,14 +54,28 @@
border-color: @glass-error-color; border-color: @glass-error-color;
} }
} }
}
.controls, .control-group { &.submitting > * {
margin-bottom: 25px; opacity: 0.3;
} }
.wrapper { &.submitting::after{
padding: 40px 40px 20px 40px; content: '';
position: absolute;
width: 60px;
height: 60px;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -30px;
border: 8px solid transparent;
border-top-color: var(--spinner-color, #fff);
animation: loginRotation 1s infinite ease-in-out;
border-radius: 50%;
z-index: 1052;
}
} }
.controls { .controls {
@ -158,8 +174,8 @@
} }
@media screen and (max-width: 480px) { @media screen and (max-width: 480px) {
.b-login-content .loginFormWrapper { .b-login-content {
.wrapper { form {
padding: 30px 4vw 10px; padding: 30px 4vw 10px;
} }
} }
@ -169,30 +185,6 @@
to {transform: rotate(1turn);} to {transform: rotate(1turn);}
} }
.submitting-pane {
position: relative;
&.submitting > * {
opacity: 0.3;
}
html &.submitting::after{
content: '';
position: absolute;
width: 60px;
height: 60px;
top: 50%;
left: 50%;
margin-top: -30px;
margin-left: -30px;
border: 8px solid transparent;
border-top-color: var(--spinner-color, #fff);
animation: loginRotation 1s infinite ease-in-out;
border-radius: 50%;
z-index: 1052;
}
}
.btn-submit-icon-wrp { .btn-submit-icon-wrp {
border: none; border: none;
background: none; background: none;

4
dev/Styles/MessageList.less
View file

@ -134,10 +134,6 @@ html.rl-no-preview-pane {
background-color: #fff; background-color: #fff;
.content {
-webkit-overflow-scrolling: touch;
}
.listClear { .listClear {
text-align: center; text-align: center;
padding: 10px; padding: 10px;

5
dev/Styles/MessageView.less
View file

@ -57,10 +57,6 @@
color: #DA4F49; color: #DA4F49;
} }
.content {
-webkit-overflow-scrolling: touch;
}
.message-fixed-button-toolbar { .message-fixed-button-toolbar {
z-index: 100; z-index: 100;
position: absolute; position: absolute;
@ -190,7 +186,6 @@
left: 0; left: 0;
right: 0; right: 0;
overflow: auto; overflow: auto;
-webkit-overflow-scrolling: touch;
border-radius: @rlLowBorderRadius; border-radius: @rlLowBorderRadius;
scroll-behavior: smooth; scroll-behavior: smooth;

20
dev/Styles/Settings.less
View file

@ -1,21 +1,11 @@
.b-settins-left { .b-settins-left {
.b-toolbar {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 34px;
padding: 8px 0 0 @rlLowMargin;
}
.b-footer { .b-footer {
position: absolute; position: absolute;
bottom: 20px; bottom: 10px;
right: 0; right: 0;
left: 0; left: 0;
height: 20px;
padding: 0 10px 0 5px; padding: 0 10px 0 5px;
z-index: 101; z-index: 101;
} }
@ -27,10 +17,6 @@
left: 0; left: 0;
right: 0; right: 0;
overflow: hidden; overflow: hidden;
.content {
-webkit-overflow-scrolling: touch;
}
} }
} }
@ -86,10 +72,6 @@
border: @rlMainBorderSize solid @rlMainDarkColor; border: @rlMainBorderSize solid @rlMainDarkColor;
box-shadow: @rlMainShadow; box-shadow: @rlMainShadow;
border-radius: @rlMainBorderRadius; border-radius: @rlMainBorderRadius;
.content {
-webkit-overflow-scrolling: touch;
}
} }
td { td {

2
dev/View/Admin/Login.js
View file

@ -21,8 +21,6 @@ class LoginAdminView extends AbstractViewCenter {
loginError: false, loginError: false,
passwordError: false, passwordError: false,
formHidden: false,
submitRequest: false, submitRequest: false,
submitError: '' submitError: ''
}); });

2
dev/View/User/Login.js
View file

@ -46,8 +46,6 @@ class LoginUserView extends AbstractViewCenter {
emailError: false, emailError: false,
passwordError: false, passwordError: false,
formHidden: false,
submitRequest: false, submitRequest: false,
submitError: '', submitError: '',
submitErrorAddidional: '', submitErrorAddidional: '',

6
snappymail/v/0.0.0/app/templates/Index.html
View file

@ -33,10 +33,8 @@
<div id="rl-loading-error" hidden="">An error occurred.<br>Please refresh the page and try again.</div> <div id="rl-loading-error" hidden="">An error occurred.<br>Please refresh the page and try again.</div>
<div id="rl-content" hidden=""> <div id="rl-content" hidden="">
<div id="rl-popups"></div> <div id="rl-popups"></div>
<div id="rl-center"> <div id="rl-left"></div>
<div id="rl-left"></div> <div id="rl-right"></div>
<div id="rl-right"></div>
</div>
</div> </div>
</div> </div>
{{BaseTemplates}} {{BaseTemplates}}

68
snappymail/v/0.0.0/app/templates/Views/Admin/AdminLogin.html
View file

@ -1,38 +1,36 @@
<div class="b-login-content"> <div class="b-login-content">
<div class="loginFormWrapper" data-bind="css: {'afterLoginHide': formHidden}"> <div class="alert" data-bind="hidden: !submitError()">
<div class="alert" data-bind="hidden: !submitError()"> <button type="button" class="close" data-bind="click: function () { submitError('') }">×</button>
<button type="button" class="close" data-bind="click: function () { submitError('') }">×</button> <span data-bind="text: submitError"></span>
<span data-bind="text: submitError"></span>
</div>
<form class="wrapper submitting-pane loginForm" action="#/" data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls" data-bind="css: {'error': loginError}">
<div class="input-append">
<input required="" type="text" class="input-block-level inputLogin"
autofocus="" autocomplete="username" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: login, disable: submitRequest"
data-i18n="[placeholder]LOGIN/LABEL_LOGIN" />
<span class="add-on fontastic">👤</span>
</div>
</div>
<div class="controls" data-bind="css: {'error': passwordError}">
<div class="input-append">
<input required="" type="password" class="input-block-level inputPassword"
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]LOGIN/LABEL_PASSWORD" />
<span class="add-on" tabindex="-1"
data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_LOGIN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
</span>
</div>
</div>
<div id="plugin-Login-BottomControlGroup"></div>
<div class="controls" data-bind="hidden: hideSubmitButton">
<button type="submit" class="btn btn-large btn-block buttonLogin"
data-bind="command: submitCommand"
data-i18n="LOGIN/BUTTON_LOGIN"></button>
</div>
</form>
</div> </div>
<form action="#/" data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls" data-bind="css: {'error': loginError}">
<div class="input-append">
<input required="" type="text" class="input-block-level inputLogin"
autofocus="" autocomplete="username" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: login, disable: submitRequest"
data-i18n="[placeholder]LOGIN/LABEL_LOGIN" />
<span class="add-on fontastic">👤</span>
</div>
</div>
<div class="controls" data-bind="css: {'error': passwordError}">
<div class="input-append">
<input required="" type="password" class="input-block-level inputPassword"
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]LOGIN/LABEL_PASSWORD" />
<span class="add-on" tabindex="-1"
data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_LOGIN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
</span>
</div>
</div>
<div id="plugin-Login-BottomControlGroup"></div>
<div class="controls" data-bind="hidden: hideSubmitButton">
<button type="submit" class="btn btn-large btn-block buttonLogin"
data-bind="command: submitCommand"
data-i18n="LOGIN/BUTTON_LOGIN"></button>
</div>
</form>
<div> <div>

10
snappymail/v/0.0.0/app/templates/Views/Admin/AdminMenu.html
View file

@ -1,7 +1,3 @@
<div class="b-admin-left"> <nav data-bind="foreach: menu">
<div class="b-content opacity-on-panel-disabled"> <a data-bind="css: {'selected': selected }, attr: { 'href': $root.link(route), 'data-i18n': label }"></a>
<nav class="b-admin-menu" data-bind="foreach: menu"> </nav>
<a data-bind="css: {'selected': selected }, attr: { 'href': $root.link(route), 'data-i18n': label }"></a>
</nav>
</div>
</div>

6
snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html
View file

@ -6,10 +6,6 @@
<a class="btn btn-logout fontastic" data-bind="click: logoutClick">⏻</a> <a class="btn btn-logout fontastic" data-bind="click: logoutClick">⏻</a>
</div> </div>
<div class="b-content"> <div class="b-content">
<div class="content"> <div id="rl-settings-subscreen"></div>
<div class="content-wrapper">
<div id="rl-settings-subscreen" class="b-settings-content"></div>
</div>
</div>
</div> </div>
</div> </div>

2
snappymail/v/0.0.0/app/templates/Views/Admin/AdminSettingsSecurity.html
View file

@ -1,4 +1,4 @@
<div class="adminSecurity g-ui-user-select-none"> <div class="g-ui-user-select-none">
<div class="legend" data-i18n="TAB_SECURITY/LEGEND_SECURITY"></div> <div class="legend" data-i18n="TAB_SECURITY/LEGEND_SECURITY"></div>
<div class="form-horizontal"> <div class="form-horizontal">
<div class="control-group"> <div class="control-group">

110
snappymail/v/0.0.0/app/templates/Views/User/Login.html
View file

@ -1,59 +1,57 @@
<div class="b-login-content"> <div class="b-login-content">
<div class="loginFormWrapper" data-bind="css: {'afterLoginHide': formHidden}"> <div class="descWrapper" data-bind="visible: '' !== loadingDesc, text: loadingDesc"></div>
<div class="descWrapper" data-bind="visible: '' !== loadingDesc, text: loadingDesc"></div> <div class="alert" data-bind="hidden: !submitError()" hidden="">
<div class="alert" data-bind="hidden: !submitError()" hidden=""> <button type="button" class="close" data-bind="click: function () { submitError('') }">×</button>
<button type="button" class="close" data-bind="click: function () { submitError('') }">×</button> <span data-bind="text: submitError"></span>
<span data-bind="text: submitError"></span> <p data-bind="visible: '' !== submitErrorAddidional(), text: submitErrorAddidional"></p>
<p data-bind="visible: '' !== submitErrorAddidional(), text: submitErrorAddidional"></p>
</div>
<form class="wrapper submitting-pane loginForm" action="#/"
data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls" data-bind="css: {'error': emailError}">
<div class="input-append">
<input required="" type="text" class="input-block-level inputLogin" pattern="[^@\s]+(@[^\s]+)?" inputmode="email"
autofocus="" autocomplete="email" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: email, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/EMAIL" />
<span class="add-on icon-mail"></span>
</div>
</div>
<div class="controls" data-bind="css: {'error': passwordError}">
<div class="input-append">
<input required="" type="password" class="input-block-level inputPassword"
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/PASSWORD" />
<span class="add-on" tabindex="-1"
data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_SIGN_IN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
</span>
</div>
</div>
<div id="plugin-Login-BottomControlGroup"></div>
<div class="controls" data-bind="hidden: hideSubmitButton">
<button type="submit" class="btn btn-large btn-block buttonLogin"
data-bind="command: submitCommand"
data-i18n="LOGIN/BUTTON_SIGN_IN"></button>
</div>
<div class="controls clearfix" style="margin-bottom: 10px">
<div class="pull-right language-buttons">
<a href="#" tabindex="-1" class="language-button fontastic"
data-bind="visible: allowLanguagesOnLogin, click: selectLanguage, css: { 'icon-spinner' : langRequest }"
data-i18n="[title]POPUPS_LANGUAGES/TITLE_LANGUAGES">
🌍
</a>
</div>
<div class="signMeLabel" data-bind="visible: signMeVisibility, component: {
name: 'CheckboxSimple',
params: {
label: 'LOGIN/LABEL_SIGN_ME',
value: signMe
}
}"></div>
</div>
</form>
</div> </div>
<form action="#/"
data-bind="submit: submitForm, css: {'errorAnimated': formError, 'submitting': submitRequest()}">
<div class="controls" data-bind="css: {'error': emailError}">
<div class="input-append">
<input required="" type="text" class="input-block-level inputLogin" pattern="[^@\s]+(@[^\s]+)?" inputmode="email"
autofocus="" autocomplete="email" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: email, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/EMAIL" />
<span class="add-on icon-mail"></span>
</div>
</div>
<div class="controls" data-bind="css: {'error': passwordError}">
<div class="input-append">
<input required="" type="password" class="input-block-level inputPassword"
autocomplete="current-password" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: password, disable: submitRequest"
data-i18n="[placeholder]GLOBAL/PASSWORD" />
<span class="add-on" tabindex="-1"
data-bind="command: submitCommand" data-i18n="[title]LOGIN/BUTTON_SIGN_IN">
<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
</span>
</div>
</div>
<div id="plugin-Login-BottomControlGroup"></div>
<div class="controls" data-bind="hidden: hideSubmitButton">
<button type="submit" class="btn btn-large btn-block buttonLogin"
data-bind="command: submitCommand"
data-i18n="LOGIN/BUTTON_SIGN_IN"></button>
</div>
<div class="controls clearfix" style="margin-bottom: 10px">
<div class="pull-right language-buttons">
<a href="#" tabindex="-1" class="language-button fontastic"
data-bind="visible: allowLanguagesOnLogin, click: selectLanguage, css: { 'icon-spinner' : langRequest }"
data-i18n="[title]POPUPS_LANGUAGES/TITLE_LANGUAGES">
🌍
</a>
</div>
<div class="signMeLabel" data-bind="visible: signMeVisibility, component: {
name: 'CheckboxSimple',
params: {
label: 'LOGIN/LABEL_SIGN_ME',
value: signMe
}
}"></div>
</div>
</form>
</div> </div>

14
snappymail/v/0.0.0/app/templates/Views/User/MailFolderList.html
View file

@ -6,15 +6,11 @@
</a> </a>
<a class="btn buttonContacts fontastic" data-bind="visible: allowContacts, click: contactsClick" data-i18n="[title]GLOBAL/CONTACTS">📇</a> <a class="btn buttonContacts fontastic" data-bind="visible: allowContacts, click: contactsClick" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
</div> </div>
<div class="b-content opacity-on-panel-disabled" data-bind="css: {'inbox-is-starred': isInboxStarred}"> <div class="b-content" data-bind="css: {'inbox-is-starred': isInboxStarred}">
<div class="content"> <div class="b-folders-system" data-bind="template: { name: 'MailFolderListSystemItem', foreach: folderListSystem }"></div>
<div class="content-wrapper"> <hr/>
<div class="b-folders-system" data-bind="template: { name: 'MailFolderListSystemItem', foreach: folderListSystem }"></div> <div class="b-folders-user" data-bind="template: { name: 'MailFolderListItem', foreach: folderList }"></div>
<hr/> <div class="move-action-content-wrapper" data-bind="visible: moveAction"></div>
<div class="b-folders-user" data-bind="template: { name: 'MailFolderListItem', foreach: folderList }"></div>
<div class="move-action-content-wrapper" data-bind="visible: moveAction"></div>
</div>
</div>
</div> </div>
<div class="b-content show-on-panel-disabled" data-bind="click: function () { leftPanelDisabled(false); }"></div> <div class="b-content show-on-panel-disabled" data-bind="click: function () { leftPanelDisabled(false); }"></div>
<div class="b-footer btn-toolbar hide-mobile"> <div class="b-footer btn-toolbar hide-mobile">

138
snappymail/v/0.0.0/app/templates/Views/User/MailMessageList.html
View file

@ -163,7 +163,7 @@
<div class="input-append" data-bind="visible: allowSearch"> <div class="input-append" data-bind="visible: allowSearch">
<div class="close-input-wrp"> <div class="close-input-wrp">
<a class="close" data-bind="click: cancelSearch, visible: '' !== messageListSearchDesc()">×</a> <a class="close" data-bind="click: cancelSearch, visible: '' !== messageListSearchDesc()">×</a>
<input type="text" class="span4 inputSearch" tabindex="-1" placeholder="Search" autocorrect="off" autocapitalize="off" data-i18n="[placeholder]GLOBAL/SEARCH" data-bind="value: inputProxyMessageListSearch, onEnter: searchEnterAction, hasfocus: inputMessageListSearchFocus" /> <input type="search" class="span4 inputSearch" tabindex="-1" placeholder="Search" autocorrect="off" autocapitalize="off" data-i18n="[placeholder]GLOBAL/SEARCH" data-bind="value: inputProxyMessageListSearch, onEnter: searchEnterAction, hasfocus: inputMessageListSearchFocus" />
</div> </div>
<a class="btn buttonMoreSearch" data-bind="visible: allowSearchAdv, click: advancedSearchClick"> <a class="btn buttonMoreSearch" data-bind="visible: allowSearchAdv, click: advancedSearchClick">
<span class="caret"></span> <span class="caret"></span>
@ -172,82 +172,78 @@
</div> </div>
</div> </div>
<div class="b-content" data-bind="initDom: dragOverBodyArea"> <div class="b-content" data-bind="initDom: dragOverBodyArea">
<div class="content"> <div class="listThreadUidDesc" data-bind="visible: '' !== messageListEndThreadUid(), click: cancelThreadUid">
<div class="content-wrapper"> <i class="fontastic" data-bind="click: cancelThreadUid">⬅</i>
<div class="listThreadUidDesc" data-bind="visible: '' !== messageListEndThreadUid(), click: cancelThreadUid"> <span data-i18n="MESSAGE_LIST/BACK_TO_MESSAGE_LIST"></span>
<i class="fontastic" data-bind="click: cancelThreadUid">⬅</i> </div>
<span data-i18n="MESSAGE_LIST/BACK_TO_MESSAGE_LIST"></span> <div class="listSearchDesc" data-bind="visible: '' !== messageListSearchDesc(), text: messageListSearchDesc"></div>
</div> <div class="listDragOver" data-bind="css: {'viewAppendArea': dragOver() && '' === messageListError() && !popupVisibility(), 'dragOverEnter': dragOverEnter }, initDom: dragOverArea">
<div class="listSearchDesc" data-bind="visible: '' !== messageListSearchDesc(), text: messageListSearchDesc"></div> <i class="fontastic e-icon">⬇</i>
<div class="listDragOver" data-bind="css: {'viewAppendArea': dragOver() && '' === messageListError() && !popupVisibility(), 'dragOverEnter': dragOverEnter }, initDom: dragOverArea"> <span data-i18n="MESSAGE_LIST/PUT_MESSAGE_HERE"></span>
<i class="fontastic e-icon">⬇</i> </div>
<span data-i18n="MESSAGE_LIST/PUT_MESSAGE_HERE"></span> <div class="listClear" data-bind="visible: clearListIsVisible()">
</div> <span class="g-ui-link" data-i18n="MESSAGE_LIST/BUTTON_EMPTY_FOLDER" data-bind="command: clearCommand"></span>
<div class="listClear" data-bind="visible: clearListIsVisible()"> </div>
<span class="g-ui-link" data-i18n="MESSAGE_LIST/BUTTON_EMPTY_FOLDER" data-bind="command: clearCommand"></span> <div class="listError" data-bind="visible: !dragOver() && '' !== messageListError()">
</div> <span class="error" data-bind="text: messageListError"></span>
<div class="listError" data-bind="visible: !dragOver() && '' !== messageListError()"> </div>
<span class="error" data-bind="text: messageListError"></span> <div class="listEmptyList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' === messageListSearch()"
</div> data-i18n="MESSAGE_LIST/EMPTY_LIST"></div>
<div class="listEmptyList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' === messageListSearch()" <div class="listEmptyListLoading" data-bind="visible: !dragOver() && 0 === messageList().length &&
data-i18n="MESSAGE_LIST/EMPTY_LIST"></div> messageListCompleteLoadingThrottle() && '' === messageListError()">
<div class="listEmptyListLoading" data-bind="visible: !dragOver() && 0 === messageList().length && <span data-i18n="GLOBAL/LOADING"></span>
messageListCompleteLoadingThrottle() && '' === messageListError()"> <span class="textLoadingAnimationD1">.</span>
<span data-i18n="GLOBAL/LOADING"></span> <span class="textLoadingAnimationD2">.</span>
<span class="textLoadingAnimationD1">.</span> <span class="textLoadingAnimationD3">.</span>
<span class="textLoadingAnimationD2">.</span> </div>
<span class="textLoadingAnimationD3">.</span> <div class="listEmptySearchList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' !== messageListSearch()"
</div> data-i18n="MESSAGE_LIST/EMPTY_SEARCH_LIST"></div>
<div class="listEmptySearchList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' !== messageListSearch()" <div data-bind="dragmessages: getDragData">
data-i18n="MESSAGE_LIST/EMPTY_SEARCH_LIST"></div> <div class="messageListPlace" data-bind="foreach: messageList">
<div data-bind="dragmessages: getDragData">
<div class="messageListPlace" data-bind="foreach: messageList">
<div class="messageListItem" data-bind="css: lineAsCss()"> <div class="messageListItem" data-bind="css: lineAsCss()">
<div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div> <div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
<div class="flagParent">
<i class="flagOn fontastic">★</i>
<i class="flagOnHalf fontastic">☆</i>
<i class="flagOff fontastic">☆</i>
<!-- ⚐⚑ -->
</div>
<div class="senderParent actionHandle">
<i class="replyFlag fontastic">←</i>
<i class="forwardFlag fontastic">→</i>
<span class="sender" data-bind="text: senderEmailsString, attr: {'title': senderClearEmailsString}"></span>
</div>
<div class="attachmentParent actionHandle">
<i data-bind="css: attachmentIconClass"></i>
</div>
<div class="subjectParent actionHandle">
<b class="importantMark">!</b>
<span class="emptySubjectText" data-bind="text: $root.emptySubjectValue"></span>
<span class="subject" data-bind="text: subject"></span>
</div>
<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
<div class="threadsParent" data-bind="visible: 1 < threadsLen()">
<span class="threads-len">
<span class="threads-len-data">
<span data-bind="text: threadsLen"></span>
<i class="icon-right-mini"></i>
</span>
</span>
</div>
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
</div>
<div class="flagParent">
<i class="flagOn fontastic">★</i>
<i class="flagOnHalf fontastic">☆</i>
<i class="flagOff fontastic">☆</i>
<!-- ⚐⚑ -->
</div> </div>
<div class="senderParent actionHandle">
<i class="replyFlag fontastic">←</i>
<i class="forwardFlag fontastic">→</i>
<span class="sender" data-bind="text: senderEmailsString, attr: {'title': senderClearEmailsString}"></span>
</div>
<div class="attachmentParent actionHandle">
<i data-bind="css: attachmentIconClass"></i>
</div>
<div class="subjectParent actionHandle">
<b class="importantMark">!</b>
<span class="emptySubjectText" data-bind="text: $root.emptySubjectValue"></span>
<span class="subject" data-bind="text: subject"></span>
</div>
<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
<div class="threadsParent" data-bind="visible: 1 < threadsLen()">
<span class="threads-len">
<span class="threads-len-data">
<span data-bind="text: threadsLen"></span>
<i class="icon-right-mini"></i>
</span>
</span>
</div>
<time class="actionHandle" data-moment-format="SHORT" data-moment-format-title="FULL" data-bind="moment: dateTimeStampInUTC"></time>
</div> </div>
<div id="messagesDragImage"><span class="text"></span>&nbsp;<i class="icon-mail"></i></div>
</div> </div>
</div> </div>
<div id="messagesDragImage"><span class="text"></span>&nbsp;<i class="icon-mail"></i></div>
</div> </div>
<div class="b-footer thm-message-list-bottom-toolbar"> <div class="b-footer thm-message-list-bottom-toolbar">
<span data-bind="visible: 0 < userUsageProc(), attr: { title: quotaTooltip() }" class="e-quota"> <span data-bind="visible: 0 < userUsageProc(), attr: { title: quotaTooltip() }" class="e-quota">

127
snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html
View file

@ -244,82 +244,79 @@
</div> </div>
</div> </div>
<div class="messageItem fixIndex" data-bind="css: viewLineAsCss(), attr: {'style': 'top:' + viewBodyTopValue() + 'px' }"> <div class="messageItem fixIndex" data-bind="css: viewLineAsCss(), attr: {'style': 'top:' + viewBodyTopValue() + 'px' }">
<div class="content" tabindex="0" data-bind="hasfocus: messageDomFocused, css: { 'focused': messageDomFocused }"> <div tabindex="0" data-bind="hasfocus: messageDomFocused, css: { 'focused': messageDomFocused }">
<div class="content-wrapper"> <div>
<span class="buttonFull" data-bind="click: toggleFullScreen">
<i data-bind="css: { 'icon-arrows-out': !fullScreenMode(), 'icon-arrows-in': fullScreenMode }"></i>
</span>
<div> <div class="line-loading e-strip-animation" data-bind="visible: messageLoadingThrottle()"></div>
<span class="buttonFull" data-bind="click: toggleFullScreen">
<i data-bind="css: { 'icon-arrows-out': !fullScreenMode(), 'icon-arrows-in': fullScreenMode }"></i>
</span>
<div class="line-loading e-strip-animation" data-bind="visible: messageLoadingThrottle()"></div> <div class="loading g-ui-min-height-300" data-bind="visible: messageLoadingThrottle()">
<span class="text" data-i18n="GLOBAL/LOADING"></span><span class="textLoadingAnimationD1">.</span><span class="textLoadingAnimationD2">.</span><span class="textLoadingAnimationD3">.</span>
<div class="loading g-ui-min-height-300" data-bind="visible: messageLoadingThrottle()">
<span class="text" data-i18n="GLOBAL/LOADING"></span><span class="textLoadingAnimationD1">.</span><span class="textLoadingAnimationD2">.</span><span class="textLoadingAnimationD3">.</span>
</div>
</div> </div>
</div>
<div class="g-ui-min-height-300 content-content" data-bind="visible: !messageLoadingThrottle()"> <div class="g-ui-min-height-300" data-bind="visible: !messageLoadingThrottle()">
<div class="bodySubHeader"> <div class="bodySubHeader">
<div class="showImages" data-bind="visible: message() && message().hasImages(), click: function() { showImages(message()); }"> <div class="showImages" data-bind="visible: message() && message().hasImages(), click: function() { showImages(message()); }">
<i class="fontastic">🖼</i> <i class="fontastic">🖼</i>
<span class="text" data-i18n="MESSAGE/BUTTON_SHOW_IMAGES"></span> <span class="text" data-i18n="MESSAGE/BUTTON_SHOW_IMAGES"></span>
</div> </div>
<div class="readReceipt" data-bind="visible: message() && !isDraftOrSentFolder() && '' !== message().readReceipt() && !message().isReadReceipt(), click: function() { readReceipt(message()); }"> <div class="readReceipt" data-bind="visible: message() && !isDraftOrSentFolder() && '' !== message().readReceipt() && !message().isReadReceipt(), click: function() { readReceipt(message()); }">
<i class="icon-mail"></i> <i class="icon-mail"></i>
<span class="text" data-i18n="MESSAGE/BUTTON_NOTIFY_READ_RECEIPT"></span> <span class="text" data-i18n="MESSAGE/BUTTON_NOTIFY_READ_RECEIPT"></span>
</div> </div>
<div class="attachmentsPlace" data-bind="visible: message() && message().attachments().hasVisible(), <div class="attachmentsPlace" data-bind="visible: message() && message().attachments().hasVisible(),
css: {'selection-mode' : showAttachmnetControls, 'unselectedAttachmentsError': highlightUnselectedAttachments}"> css: {'selection-mode' : showAttachmnetControls, 'unselectedAttachmentsError': highlightUnselectedAttachments}">
<ul class="attachmentList" data-bind="foreach: message() ? message().attachments() : []"> <ul class="attachmentList" data-bind="foreach: message() ? message().attachments() : []">
<li class="attachmentItem" draggable="true" <li class="attachmentItem" draggable="true"
data-bind="visible: !isLinked, event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}"> data-bind="visible: !isLinked, event: { 'dragstart': eventDragStart }, attr: { 'title': fileName }, css: {'checked': checked}">
<div class="attachmentIconParent" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }"> <div class="attachmentIconParent" data-bind="css: { 'hasPreview': hasPreview(), 'hasPreplay': hasPreplay(), 'isImage': isImage() }">
<i class="hidePreview iconMain" data-bind="css: iconClass()"></i> <i class="hidePreview iconMain" data-bind="css: iconClass()"></i>
<div class="showPreview"> <div class="showPreview">
<a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank"> <a data-bind="css: {'attachmentImagePreview': isImage()}, attr: { 'title': fileName, 'href': linkPreviewMain() }" target="_blank">
<i class="iconMain" data-bind="css: iconClass()"></i>
<div class="iconBG" data-bind="attr: { 'style': linkThumbnailPreviewStyle() }"></div>
<div class="iconPreview fontastic">👁</div>
</a>
</div>
<div class="showPreplay">
<i class="iconMain" data-bind="css: iconClass()"></i> <i class="iconMain" data-bind="css: iconClass()"></i>
<div class="iconPreview fontastic">▶</div> <div class="iconBG" data-bind="attr: { 'style': linkThumbnailPreviewStyle() }"></div>
</div> <div class="iconPreview fontastic">👁</div>
</a>
</div> </div>
<div class="attachmentNameParent"> <div class="showPreplay">
<div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="attachmentName" data-bind="text: fileName"></div> <i class="iconMain" data-bind="css: iconClass()"></i>
<div class="attachmentSize" data-bind="text: friendlySize"></div> <div class="iconPreview fontastic">▶</div>
</div> </div>
<div class="checkboxAttachment fontastic" </div>
data-bind="text: checked() ? '☑' : '☐', <div class="attachmentNameParent">
click: function () { checked(!checked()); return false }"></div> <div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden;" class="attachmentName" data-bind="text: fileName"></div>
</li> <div class="attachmentSize" data-bind="text: friendlySize"></div>
</ul> </div>
<i class="fontastic controls-handle" data-bind="visible: allowAttachmnetControls() && !showAttachmnetControls(), click: function () { showAttachmnetControls(true); showAttachmnetControlsState(true); }">⚙</i> <div class="checkboxAttachment fontastic"
</div> data-bind="text: checked() ? '☑' : '☐',
click: function () { checked(!checked()); return false }"></div>
<div class="attachmentsControls" </li>
data-bind="visible: showAttachmnetControls() && message() && message().attachments().hasVisible()"> </ul>
<i class="fontastic controls-handle" data-bind="visible: allowAttachmnetControls() && !showAttachmnetControls(), click: function () { showAttachmnetControls(true); showAttachmnetControlsState(true); }">⚙</i>
<span data-bind="visible: downloadAsZipAllowed">
<i class="fontastic iconcolor-red" data-bind="visible: downloadAsZipError">✖</i>
<i class="icon-file-archive" data-bind="visible: !downloadAsZipError(),
css: {'icon-file-archive': !downloadAsZipLoading(), 'icon-spinner': downloadAsZipLoading()}"></i>
<span class="g-ui-link" data-bind="click: downloadAsZip"
data-i18n="MESSAGE/LINK_DOWNLOAD_AS_ZIP"></span>
</span>
<button type="button" class="close" style="margin-right: 5px;"
data-bind="click: function () { showAttachmnetControls(false); showAttachmnetControlsState(false); }">×</button>
</div>
</div> </div>
<div class="bodyText g-ui-min-height-300" <div class="attachmentsControls"
data-bind="initDom: messagesBodiesDom"></div> data-bind="visible: showAttachmnetControls() && message() && message().attachments().hasVisible()">
<span data-bind="visible: downloadAsZipAllowed">
<i class="fontastic iconcolor-red" data-bind="visible: downloadAsZipError">✖</i>
<i class="icon-file-archive" data-bind="visible: !downloadAsZipError(),
css: {'icon-file-archive': !downloadAsZipLoading(), 'icon-spinner': downloadAsZipLoading()}"></i>
<span class="g-ui-link" data-bind="click: downloadAsZip"
data-i18n="MESSAGE/LINK_DOWNLOAD_AS_ZIP"></span>
</span>
<button type="button" class="close" style="margin-right: 5px;"
data-bind="click: function () { showAttachmnetControls(false); showAttachmnetControlsState(false); }">×</button>
</div>
</div> </div>
<div class="bodyText g-ui-min-height-300"
data-bind="initDom: messagesBodiesDom"></div>
</div> </div>
</div> </div>
</div> </div>

48
snappymail/v/0.0.0/app/templates/Views/User/PopupsCompose.html
View file

@ -161,32 +161,28 @@
</div> </div>
<div class="attachmentAreaParent b-content" data-bind="visible: attachmentsPlace"> <div class="attachmentAreaParent b-content" data-bind="visible: attachmentsPlace">
<div class="content"> <div class="b-attachment-place" data-bind="visible: addAttachmentEnabled() && dragAndDropEnabled() && dragAndDropVisible(), initDom: composeUploaderDropPlace, css: {'dragAndDropOver': dragAndDropOver}"
<div class="content-wrapper"> data-i18n="COMPOSE/ATTACH_DROP_FILES_DESC"></div>
<div class="b-attachment-place" data-bind="visible: addAttachmentEnabled() && dragAndDropEnabled() && dragAndDropVisible(), initDom: composeUploaderDropPlace, css: {'dragAndDropOver': dragAndDropOver}" <ul class="attachmentList" data-bind="foreach: attachments">
data-i18n="COMPOSE/ATTACH_DROP_FILES_DESC"></div> <li class="attachmentItem" data-bind="attr: { 'title': title }, css: { 'waiting': waiting, 'error': '' !== error() }">
<ul class="attachmentList" data-bind="foreach: attachments"> <div class="attachmentIconParent">
<li class="attachmentItem" data-bind="attr: { 'title': title }, css: { 'waiting': waiting, 'error': '' !== error() }"> <i class="iconMain" data-bind="css: iconClass(), visible: !uploading() || 0 === progress()"></i>
<div class="attachmentIconParent"> <div class="iconProgress" data-bind="attr: { 'style': progressStyle }, visible: uploading"></div>
<i class="iconMain" data-bind="css: iconClass(), visible: !uploading() || 0 === progress()"></i> <div class="iconBG" data-bind="text: progressText, visible: uploading"></div>
<div class="iconProgress" data-bind="attr: { 'style': progressStyle }, visible: uploading"></div> </div>
<div class="iconBG" data-bind="text: progressText, visible: uploading"></div> <div class="attachmentNameParent">
</div> <button type="button" class="close pull-right" style="margin-top:-4px;" data-bind="click: cancel">×</button>
<div class="attachmentNameParent"> <div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden;">
<button type="button" class="close pull-right" style="margin-top:-4px;" data-bind="click: cancel">×</button> <span class="attachmentName" data-bind="text: fileName"></span>&nbsp;
<div style="white-space: nowrap; text-overflow: ellipsis; overflow: hidden;"> </div>
<span class="attachmentName" data-bind="text: fileName"></span>&nbsp; <div>
</div> <span class="attachmentSize" data-bind="text: friendlySize"></span>&nbsp;
<div> </div>
<span class="attachmentSize" data-bind="text: friendlySize"></span>&nbsp; </div>
</div> </li>
</div> </ul>
</li> <div class="no-attachments-desc" data-bind="visible: 0 === attachments().length"
</ul> data-i18n="COMPOSE/NO_ATTACHMENTS_HERE_DESC"></div>
<div class="no-attachments-desc" data-bind="visible: 0 === attachments().length"
data-i18n="COMPOSE/NO_ATTACHMENTS_HERE_DESC"></div>
</div>
</div>
</div> </div>
<div class="textAreaParent" data-bind="visible: !attachmentsPlace(), initDom: composeEditorArea"></div> <div class="textAreaParent" data-bind="visible: !attachmentsPlace(), initDom: composeEditorArea"></div>

180
snappymail/v/0.0.0/app/templates/Views/User/PopupsContacts.html
View file

@ -52,25 +52,23 @@
</div> </div>
<div class="b-list-content g-ui-user-select-none" data-bind="css: {'hideContactListCheckbox': !useCheckboxesInList()}"> <div class="b-list-content g-ui-user-select-none" data-bind="css: {'hideContactListCheckbox': !useCheckboxesInList()}">
<div class="content"> <div class="content">
<div class="content-wrapper"> <div class="listClear" data-bind="visible: viewClearSearch() && '' !== search()">
<div class="listClear" data-bind="visible: viewClearSearch() && '' !== search()"> <span class="g-ui-link" data-i18n="CONTACTS/CLEAR_SEARCH" data-bind="command: clearCommand"></span>
<span class="g-ui-link" data-i18n="CONTACTS/CLEAR_SEARCH" data-bind="command: clearCommand"></span> </div>
</div> <div class="listEmptyList" data-bind="visible: 0 === contacts().length && '' === search() && !contacts.loading()"
<div class="listEmptyList" data-bind="visible: 0 === contacts().length && '' === search() && !contacts.loading()" data-i18n="CONTACTS/EMPTY_LIST"></div>
data-i18n="CONTACTS/EMPTY_LIST"></div> <div class="listEmptyListLoading" data-bind="visible: 0 === contacts().length && '' === search() && contacts.loading()">
<div class="listEmptyListLoading" data-bind="visible: 0 === contacts().length && '' === search() && contacts.loading()"> <span data-i18n="GLOBAL/LOADING"></span>
<span data-i18n="GLOBAL/LOADING"></span> <span class="textLoadingAnimationD1">.</span>
<span class="textLoadingAnimationD1">.</span> <span class="textLoadingAnimationD2">.</span>
<span class="textLoadingAnimationD2">.</span> <span class="textLoadingAnimationD3">.</span>
<span class="textLoadingAnimationD3">.</span> </div>
</div> <div class="listEmptySearchList" data-bind="visible: 0 === contacts().length && '' !== search() && !contacts.loading()"
<div class="listEmptySearchList" data-bind="visible: 0 === contacts().length && '' !== search() && !contacts.loading()" data-i18n="CONTACTS/EMPTY_SEARCH"></div>
data-i18n="CONTACTS/EMPTY_SEARCH"></div> <div class="e-contact-foreach g-ui-user-select-none" data-bind="foreach: contacts, visible: 0 < contacts().length">
<div class="e-contact-foreach g-ui-user-select-none" data-bind="foreach: contacts, visible: 0 < contacts().length"> <div class="e-contact-item g-ui-user-select-none" data-bind="css: lineAsCss()">
<div class="e-contact-item g-ui-user-select-none" data-bind="css: lineAsCss()"> <div class="checkboxItem fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
<div class="checkboxItem fontastic" data-bind="text: checked() ? '☑' : '☐'"></div> <div class="nameParent actionHandle" data-bind="text: display"></div>
<div class="nameParent actionHandle" data-bind="text: display"></div>
</div>
</div> </div>
</div> </div>
</div> </div>
@ -127,87 +125,83 @@
</div> </div>
</div> </div>
<div class="b-view-content" data-bind="css: {'read-only': viewReadOnly}"> <div class="b-view-content" data-bind="css: {'read-only': viewReadOnly}">
<div class="content"> <div class="b-contact-view-desc" data-bind="visible: emptySelection"
<div class="content-wrapper"> data-i18n="CONTACTS/CONTACT_VIEW_DESC"></div>
<div class="b-contact-view-desc" data-bind="visible: emptySelection" <div data-bind="visible: !emptySelection()">
data-i18n="CONTACTS/CONTACT_VIEW_DESC"></div> <div class="form-horizontal top-part">
<div data-bind="visible: !emptySelection()"> <div class="control-group" data-bind="visible: !viewReadOnly() || contactHasValidName()">
<div class="form-horizontal top-part"> <label class="control-label fontastic iconsize24">👤</label>
<div class="control-group" data-bind="visible: !viewReadOnly() || contactHasValidName()"> <div class="controls">
<label class="control-label fontastic iconsize24">👤</label> <div data-bind="foreach: viewPropertiesNames">
<div class="controls"> <div class="property-line">
<div data-bind="foreach: viewPropertiesNames"> <span data-bind="text: value"></span>
<div class="property-line"> <input type="text"
<span data-bind="text: value"></span> autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
<input type="text" data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}" />
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}" />
</div>
</div>
<div data-bind="visible: 0 < viewPropertiesOther().length, foreach: viewPropertiesOther">
<div class="property-line">
<!-- ko if: !largeValue() -->
<span data-bind="text: value"></span>
<input type="text"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}" />
<!-- /ko -->
<!-- ko if: largeValue -->
<span data-bind="text: value"></span>
<textarea
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}"></textarea>
<!-- /ko -->
</div>
</div>
</div> </div>
</div> </div>
<div class="control-group" data-bind="visible: !viewReadOnly() || 0 < viewPropertiesEmails().length"> <div data-bind="visible: 0 < viewPropertiesOther().length, foreach: viewPropertiesOther">
<label class="control-label fontastic iconsize24" data-i18n="[title]GLOBAL/EMAIL">@</label> <div class="property-line">
<div class="controls"> <!-- ko if: !largeValue() -->
<div data-bind="foreach: viewPropertiesEmails"> <span data-bind="text: value"></span>
<div class="property-line"> <input type="text"
<span data-bind="text: value"></span> autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
<input type="text" data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}" />
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" <!-- /ko -->
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" /> <!-- ko if: largeValue -->
</div> <span data-bind="text: value"></span>
</div> <textarea
<a href="javascript:void(0);" class="g-ui-link add-link" data-bind="visible: !viewReadOnly(), click: addNewEmail" data-i18n="CONTACTS/LINK_ADD_EMAIL"></a> autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
</div> data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup', attr: {'placeholder': placeholderValue}"></textarea>
</div> <!-- /ko -->
<div class="control-group" data-bind="visible: 0 < viewPropertiesPhones().length"> </div>
<label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_PHONE">📞</label> </div>
<div class="controls"> </div>
<div data-bind="foreach: viewPropertiesPhones"> </div>
<div class="property-line"> <div class="control-group" data-bind="visible: !viewReadOnly() || 0 < viewPropertiesEmails().length">
<span data-bind="text: value"></span> <label class="control-label fontastic iconsize24" data-i18n="[title]GLOBAL/EMAIL">@</label>
<input type="text" <div class="controls">
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" <div data-bind="foreach: viewPropertiesEmails">
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" /> <div class="property-line">
</div> <span data-bind="text: value"></span>
</div> <input type="text"
</div> autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
</div> data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" />
<div class="control-group" data-bind="visible: 0 < viewPropertiesWeb().length"> </div>
<label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_WEB">🌍</label> </div>
<div class="controls"> <a href="javascript:void(0);" class="g-ui-link add-link" data-bind="visible: !viewReadOnly(), click: addNewEmail" data-i18n="CONTACTS/LINK_ADD_EMAIL"></a>
<div data-bind="foreach: viewPropertiesWeb"> </div>
<div class="property-line"> </div>
<span data-bind="text: value"></span> <div class="control-group" data-bind="visible: 0 < viewPropertiesPhones().length">
<input type="text" placeholder="https://" <label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_PHONE">📞</label>
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" <div class="controls">
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" /> <div data-bind="foreach: viewPropertiesPhones">
</div> <div class="property-line">
</div> <span data-bind="text: value"></span>
<input type="text"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" />
</div>
</div>
</div>
</div>
<div class="control-group" data-bind="visible: 0 < viewPropertiesWeb().length">
<label class="control-label fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_WEB">🌍</label>
<div class="controls">
<div data-bind="foreach: viewPropertiesWeb">
<div class="property-line">
<span data-bind="text: value"></span>
<input type="text" placeholder="https://"
autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" />
</div> </div>
</div> </div>
</div> </div>
<!--
<div class="e-read-only-sign fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_READ_ONLY">🔒</div>
-->
</div> </div>
</div> </div>
<!--
<div class="e-read-only-sign fontastic iconsize24" data-i18n="[title]CONTACTS/LABEL_READ_ONLY">🔒</div>
-->
</div> </div>
</div> </div>
</div> </div>

12
snappymail/v/0.0.0/app/templates/Views/User/SettingsMenu.html
View file

@ -1,17 +1,13 @@
<div class="b-settins-left"> <div class="b-settins-left">
<div class="b-content opacity-on-panel-disabled"> <div class="b-content">
<nav class="b-settings-menu" data-bind="foreach: menu"> <nav class="b-settings-menu" data-bind="foreach: menu">
<a data-bind="css: {'selected': selected }, attr: { 'href': $root.link(route), 'data-i18n': label }"></a> <a data-bind="css: {'selected': selected }, attr: { 'href': $root.link(route), 'data-i18n': label }"></a>
</nav> </nav>
</div> </div>
<div class="b-content show-on-panel-disabled" data-bind="click: function () { leftPanelDisabled(false); }"></div> <div class="b-content show-on-panel-disabled" data-bind="click: function () { leftPanelDisabled(false); }"></div>
<div class="b-footer"> <div class="b-footer">
<div class="btn-toolbar"> <a class="btn buttonResize" data-bind="click: function () { leftPanelDisabled(!leftPanelDisabled()); }">
<div class="btn-group"> <i data-bind="css: {'icon-resize-out': leftPanelDisabled(), 'icon-resize-in': !leftPanelDisabled()}"></i>
<a class="btn buttonResize" data-bind="click: function () { leftPanelDisabled(!leftPanelDisabled()); }"> </a>
<i data-bind="css: {'icon-resize-out': leftPanelDisabled(), 'icon-resize-in': !leftPanelDisabled()}"></i>
</a>
</div>
</div>
</div> </div>
</div> </div>

6
snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html
View file

@ -14,10 +14,6 @@
</div> </div>
</div> </div>
<div class="b-content"> <div class="b-content">
<div class="content"> <div id="rl-settings-subscreen"></div>
<div class="content-wrapper">
<div id="rl-settings-subscreen" class="b-settings-content"></div>
</div>
</div>
</div> </div>
</div> </div>