mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-09-02 05:59:21 +03:00
New spinner icon
This commit is contained in:
parent
1613a4528b
commit
46187d0749
11 changed files with 95 additions and 56 deletions
|
|
@ -1,12 +1,13 @@
|
|||
|
||||
.b-admin-general {
|
||||
|
||||
|
||||
.flag-selector {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.flag-name {
|
||||
border-bottom: 1px dashed #555;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -70,16 +70,16 @@
|
|||
height: 18px;
|
||||
vertical-align: bottom;
|
||||
margin-bottom: 3px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.sub-label {
|
||||
padding-left: 8px;
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
.sub-checkbox {
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
margin-top: 1px;
|
||||
|
||||
.checkbox-box-sizes();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,25 +1,26 @@
|
|||
|
||||
.b-settings-general {
|
||||
|
||||
.notification-desc-denied {
|
||||
color: #999;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.denied-by-browser {
|
||||
.notification-desc-denied {
|
||||
display: inline;
|
||||
}
|
||||
.notification-desc {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
.flag-selector {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.flag-name {
|
||||
border-bottom: 1px dashed #555;
|
||||
}
|
||||
}
|
||||
|
||||
.b-settings-general {
|
||||
|
||||
.notification-desc-denied {
|
||||
color: #999;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.denied-by-browser {
|
||||
.notification-desc-denied {
|
||||
display: inline;
|
||||
}
|
||||
.notification-desc {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
|
||||
.flag-selector {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.flag-name {
|
||||
border-bottom: 1px dashed #555;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,6 +70,7 @@
|
|||
line-height: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
@keyframes rotation {
|
||||
to {transform: rotate(1turn);}
|
||||
}
|
||||
|
|
@ -86,19 +87,56 @@
|
|||
line-height: 100%;
|
||||
}
|
||||
}
|
||||
*/
|
||||
|
||||
@keyframes rotation {
|
||||
to {transform: rotate(1turn);}
|
||||
}
|
||||
|
||||
.icon-spinner {
|
||||
|
||||
font-family: Arial;
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
}
|
||||
|
||||
height: 11px;
|
||||
width: 11px;
|
||||
|
||||
margin-right: -1px;
|
||||
background: none;
|
||||
|
||||
border: 3px solid #aaa;
|
||||
border-top-color: #333;
|
||||
border-radius: 100%;
|
||||
|
||||
animation: none;
|
||||
|
||||
&.animated {
|
||||
border-color: transparent;
|
||||
border-top-color: #999;
|
||||
|
||||
animation: rotation .8s infinite linear;
|
||||
}
|
||||
}
|
||||
|
||||
html.no-cssanimations .icon-spinner {
|
||||
background: none;
|
||||
background-image: url('@{rlSyncFileStop}');
|
||||
background-repeat: no-repeat;
|
||||
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
|
||||
font-family: Arial;
|
||||
&:before {
|
||||
content: "";
|
||||
}
|
||||
&.animated {
|
||||
background: none;
|
||||
background-image: url('@{rlSyncFile}');
|
||||
}
|
||||
}
|
||||
|
||||
html.cssanimations .icon-spinner.animated:before {
|
||||
animation: rotation 1s infinite steps(40);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
Language
|
||||
</label>
|
||||
<div class="controls">
|
||||
<label class="flag-selector">
|
||||
<div class="flag-selector">
|
||||
<span class="flag-wrapper">
|
||||
<span data-bind="css: 'flag flag-' + mainLanguage()" style=""></span>
|
||||
</span>
|
||||
|
|
@ -28,7 +28,7 @@
|
|||
name: 'SaveTrigger',
|
||||
params: { value: languageTrigger }
|
||||
}"></div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
|
|||
|
|
@ -36,7 +36,7 @@
|
|||
params: { value: verifySslCertificate, label: 'Require verification of SSL certificate used (IMAP/SMTP)', inline: true }
|
||||
}"></div>
|
||||
|
||||
<span style="color:red">(beta)</span>
|
||||
<span style="color:red">(unstable)</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<label class="e-component e-checkbox" data-bind="click: click, css: {'inline': inline, 'disabled': disable() || !enable() }">
|
||||
<label class="e-component e-checkbox inline" data-bind="click: click, css: { 'disabled': disable() || !enable() }">
|
||||
<i data-bind="css: value() ?
|
||||
(inverted ? 'icon-checkbox-unchecked' : 'icon-checkbox-checked') :
|
||||
(inverted ? 'icon-checkbox-checked' : 'icon-checkbox-unchecked')
|
||||
"></i>
|
||||
<!-- ko if: labeled -->
|
||||
|
||||
|
||||
<span class="sub-label i18n" data-bind="attr: {'data-i18n-text': label}"></span>
|
||||
<!-- /ko -->
|
||||
</label>
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<label class="e-component e-checkbox" data-bind="css: {'inline': inline, 'disabled': disable() || !enable() }">
|
||||
<input type="checkbox" data-bind="checked: value, disable: disable() || !enable()" />
|
||||
<label class="e-component e-checkbox inline" data-bind="css: { 'disabled': disable() || !enable() }">
|
||||
<input type="checkbox" data-bind="checked: value, disable: disable() || !enable()" style="margin: 0 0 1px 0;" />
|
||||
<!-- ko if: labeled -->
|
||||
|
||||
<span class="sub-label i18n" data-bind="attr: {'data-i18n-text': label}"></span>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,10 @@
|
|||
<label class="e-component e-checkbox material-design" data-bind="click: click, css: {'inline': inline, 'disabled': disable() || !enable() }">
|
||||
<label class="e-component e-checkbox material-design inline" data-bind="click: click, css: { 'disabled': disable() || !enable() }">
|
||||
<div class="sub-checkbox-container">
|
||||
<div class="sub-checkbox" data-bind="css: {'checked': (value() && !inverted) || (!value() && inverted),
|
||||
'unchecked': (!value() && !inverted) || (value() && inverted),
|
||||
'box': animationBox, 'checkmark': animationCheckmark}"></div>
|
||||
</div>
|
||||
<!-- ko if: labeled -->
|
||||
|
||||
<span class="sub-label i18n" data-bind="attr: {'data-i18n-text': label}"></span>
|
||||
<!-- /ko -->
|
||||
</label>
|
||||
|
|
@ -8,7 +8,7 @@
|
|||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_LANGUAGE"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
<label class="flag-selector">
|
||||
<div class="flag-selector">
|
||||
<span class="flag-wrapper">
|
||||
<span data-bind="css: 'flag flag-' + mainLanguage()" style=""></span>
|
||||
</span>
|
||||
|
|
@ -18,11 +18,11 @@
|
|||
name: 'SaveTrigger',
|
||||
params: { value: languageTrigger }
|
||||
}"></div>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label" style="padding-top: 0;">
|
||||
<label class="control-label">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_EDITOR"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
|
|
@ -39,7 +39,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="control-group">
|
||||
<label class="control-label" style="padding-top: 0;">
|
||||
<label class="control-label">
|
||||
<span class="i18n" data-i18n-text="SETTINGS_GENERAL/LABEL_LAYOUT"></span>
|
||||
</label>
|
||||
<div class="controls">
|
||||
|
|
|
|||
|
|
@ -25,22 +25,22 @@ module.exports = {
|
|||
},
|
||||
externals: {
|
||||
'window': 'window',
|
||||
'JSON': 'JSON',
|
||||
'JSON': 'window.JSON',
|
||||
'JSEncrypt': 'window.JSEncrypt',
|
||||
'$LAB': 'window.$LAB',
|
||||
'SimplePace': 'window.SimplePace',
|
||||
'PhotoSwipe': 'window.PhotoSwipe',
|
||||
'PhotoSwipeUI_Default': 'window.PhotoSwipeUI_Default',
|
||||
'queue': 'window.queue',
|
||||
'moment': 'moment',
|
||||
'ifvisible': 'ifvisible',
|
||||
'crossroads': 'crossroads',
|
||||
'hasher': 'hasher',
|
||||
'Jua': 'Jua',
|
||||
'Autolinker': 'Autolinker',
|
||||
'ssm': 'ssm',
|
||||
'key': 'key',
|
||||
'_': '_',
|
||||
'$': 'jQuery'
|
||||
'moment': 'window.moment',
|
||||
'ifvisible': 'window.ifvisible',
|
||||
'crossroads': 'window.crossroads',
|
||||
'hasher': 'window.hasher',
|
||||
'Jua': 'window.Jua',
|
||||
'Autolinker': 'window.Autolinker',
|
||||
'ssm': 'window.ssm',
|
||||
'key': 'window.key',
|
||||
'_': 'window._',
|
||||
'$': 'window.jQuery'
|
||||
}
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue