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

Some small UI design improvements

Browse source
This commit is contained in:
djmaze 2021-08-27 09:59:13 +02:00
parent c8678953fe
commit 202fac8295
6 changed files with 85 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

15
dev/Styles/Ui.less
View file

@ -91,21 +91,24 @@ textarea + .settings-save-trigger {
// Actual tabs // Actual tabs
.tabs label { .tabs label {
grid-row-start: 1;
color: #555;
margin: 0 2px -1px 0;
line-height: @baseLineHeight;
border: 1px solid transparent; border: 1px solid transparent;
border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0;
cursor: pointer;
grid-row-start: 1;
line-height: @baseLineHeight;
opacity: 0.6;
margin: 0 2px -1px 0;
padding: 5px; padding: 5px;
text-align: center;
&:hover { &:hover {
border-color: @grayLighter @grayLighter #ddd; border-color: @grayLighter;
opacity: 0.8;
} }
} }
.tabs [id^="tab"]:checked + label { .tabs [id^="tab"]:checked + label {
color: @gray;
background-color: @white; background-color: @white;
border-color: #ddd #ddd transparent #ddd; border-color: #ddd #ddd transparent #ddd;
opacity: 1;
z-index: 1; z-index: 1;
} }

136
snappymail/v/0.0.0/app/templates/Views/Admin/PopupsDomain.html
View file

@ -26,38 +26,38 @@
data-bind="css: { 'testing-done': testingDone, 'testing-error': testingImapError }, tooltipErrorTip: testingImapErrorDesc" data-bind="css: { 'testing-done': testingDone, 'testing-error': testingImapError }, tooltipErrorTip: testingImapErrorDesc"
data-i18n="POPUPS_DOMAIN/LABEL_IMAP"></label> data-i18n="POPUPS_DOMAIN/LABEL_IMAP"></label>
<div class="tab-content" role="tabpanel" aria-hidden="false"> <div class="tab-content" role="tabpanel" aria-hidden="false">
<div class="row"> <div class="row">
<div class="span3"> <div class="span3">
<span data-i18n="POPUPS_DOMAIN/LABEL_SERVER"></span> <span data-i18n="POPUPS_DOMAIN/LABEL_SERVER"></span>
<br /> <br />
<input type="text" class="span3" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" <input type="text" class="span3" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
data-bind="textInput: imapServer, hasfocus: imapServerFocus" /> data-bind="textInput: imapServer, hasfocus: imapServerFocus" />
</div>
<div class="span2">
<span data-i18n="POPUPS_DOMAIN/LABEL_PORT"></span>
<br />
<input type="number" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
style="width:6em" data-bind="textInput: imapPort" />
</div>
</div> </div>
<span data-i18n="POPUPS_DOMAIN/LABEL_SECURE"></span> <div class="span2">
<br /> <span data-i18n="POPUPS_DOMAIN/LABEL_PORT"></span>
<select data-bind="value: imapSecure"> <br />
<option value="0" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_NONE"></option> <input type="number" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
<option value="1" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_SSL"></option> style="width:6em" data-bind="textInput: imapPort" />
<option value="2" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_STARTTLS"></option> </div>
</select> </div>
<br /><br /> <span data-i18n="POPUPS_DOMAIN/LABEL_SECURE"></span>
<div data-bind="component: { <br />
name: 'Checkbox', <select data-bind="value: imapSecure">
params: { <option value="0" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_NONE"></option>
label: 'POPUPS_DOMAIN/LABEL_USE_SHORT_LOGIN', <option value="1" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_SSL"></option>
value: imapShortLogin, <option value="2" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_STARTTLS"></option>
inline: true </select>
} <br /><br />
}"></div> <div data-bind="component: {
&nbsp;&nbsp; name: 'Checkbox',
<span style="color: #aaa">(user@domain.com → user)</span> params: {
label: 'POPUPS_DOMAIN/LABEL_USE_SHORT_LOGIN',
value: imapShortLogin,
inline: true
}
}"></div>
&nbsp;&nbsp;
<span style="color: #aaa">(user@domain.com → user)</span>
</div> </div>
<input type="radio" name="helptabs" id="tab-help2" /> <input type="radio" name="helptabs" id="tab-help2" />
@ -135,40 +135,40 @@
<span data-i18n="POPUPS_DOMAIN/LABEL_SIEVE"></span> <span data-i18n="POPUPS_DOMAIN/LABEL_SIEVE"></span>
</label> </label>
<div class="tab-content" role="tabpanel" aria-hidden="true"> <div class="tab-content" role="tabpanel" aria-hidden="true">
<div class="row">
<div class="span5">
<div data-bind="component: {
name: 'Checkbox',
params: {
label: 'POPUPS_DOMAIN/LABEL_ALLOW_SIEVE_SCRIPTS',
value: useSieve
}
}"></div>
</div>
</div>
<div data-bind="visible: useSieve">
<div class="row"> <div class="row">
<div class="span5"> <div class="span3">
<div data-bind="component: { <span data-i18n="POPUPS_DOMAIN/LABEL_SERVER"></span>
name: 'Checkbox', <br />
params: { <input type="text" class="span3" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
label: 'POPUPS_DOMAIN/LABEL_ALLOW_SIEVE_SCRIPTS', data-bind="textInput: sieveServer, hasfocus: sieveServerFocus" />
value: useSieve </div>
} <div class="span1">
}"></div> <span data-i18n="POPUPS_DOMAIN/LABEL_PORT"></span>
<br />
<input type="number" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
style="width:6em" data-bind="textInput: sievePort" />
</div> </div>
</div> </div>
<div data-bind="visible: useSieve"> <span data-i18n="POPUPS_DOMAIN/LABEL_SECURE"></span>
<div class="row"> <br />
<div class="span3"> <select data-bind="value: sieveSecure">
<span data-i18n="POPUPS_DOMAIN/LABEL_SERVER"></span> <option value="0" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_NONE"></option>
<br /> <option value="1" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_SSL"></option>
<input type="text" class="span3" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" <option value="2" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_STARTTLS"></option>
data-bind="textInput: sieveServer, hasfocus: sieveServerFocus" /> </select>
</div> </div>
<div class="span1">
<span data-i18n="POPUPS_DOMAIN/LABEL_PORT"></span>
<br />
<input type="number" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false"
style="width:6em" data-bind="textInput: sievePort" />
</div>
</div>
<span data-i18n="POPUPS_DOMAIN/LABEL_SECURE"></span>
<br />
<select data-bind="value: sieveSecure">
<option value="0" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_NONE"></option>
<option value="1" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_SSL"></option>
<option value="2" data-i18n="POPUPS_DOMAIN/SECURE_OPTION_STARTTLS"></option>
</select>
</div>
</div> </div>
<input type="radio" name="helptabs" id="tab-help4" /> <input type="radio" name="helptabs" id="tab-help4" />
@ -194,11 +194,13 @@
<i class="fontastic">✖</i> <i class="fontastic">✖</i>
<span data-i18n="POPUPS_DOMAIN/BUTTON_CLOSE"></span> <span data-i18n="POPUPS_DOMAIN/BUTTON_CLOSE"></span>
</a> </a>
<a class="btn buttonClear" data-bind="command: createOrAddCommand"> <a class="btn" data-bind="command: createOrAddCommand, visible: edit()">
<i class="fontastic" data-bind="text: edit() ? '✔' : '✚', visible: !saving()"></i> <i class="fontastic" data-bind="css: {'icon-spinner': saving()}">✔</i>
<i class="icon-spinner" data-bind="visible: saving"></i> <span data-i18n="POPUPS_DOMAIN/BUTTON_UPDATE"></span>
<span data-bind="visible: !edit()" data-i18n="POPUPS_DOMAIN/BUTTON_ADD"></span> </a>
<span data-bind="visible: edit()" data-i18n="POPUPS_DOMAIN/BUTTON_UPDATE"></span> <a class="btn" data-bind="command: createOrAddCommand, visible: !edit()">
<i class="fontastic" data-bind="css: {'icon-spinner': saving()}">✚</i>
<span data-i18n="POPUPS_DOMAIN/BUTTON_ADD"></span>
</a> </a>
</div> </div>
</div> </div>

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

@ -40,7 +40,7 @@
<i class="fontastic">✖</i> <i class="fontastic">✖</i>
<span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_CLOSE"></span> <span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_CLOSE"></span>
</a> </a>
<a class="btn buttonClear" data-bind="command: createCommand"> <a class="btn" data-bind="command: createCommand">
<i class="fontastic" data-bind="visible: !saving()">✚</i> <i class="fontastic" data-bind="visible: !saving()">✚</i>
<i class="icon-spinner" data-bind="visible: saving"></i> <i class="icon-spinner" data-bind="visible: saving"></i>
<span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_ADD"></span> <span data-i18n="POPUPS_DOMAIN_ALIAS/BUTTON_ADD"></span>

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

@ -25,7 +25,7 @@
<i class="fontastic">✖</i> <i class="fontastic">✖</i>
<span data-i18n="POPUPS_PLUGIN/BUTTON_CLOSE"></span> <span data-i18n="POPUPS_PLUGIN/BUTTON_CLOSE"></span>
</a> </a>
<a class="btn buttonClear" data-bind="command: saveCommand, visible: hasConfiguration"> <a class="btn" data-bind="command: saveCommand, visible: hasConfiguration">
<i class="fontastic">✔</i> <i class="fontastic">✔</i>
<span data-i18n="POPUPS_PLUGIN/BUTTON_SAVE"></span> <span data-i18n="POPUPS_PLUGIN/BUTTON_SAVE"></span>
</a> </a>

2
snappymail/v/0.0.0/app/templates/Views/User/PopupsFolderClear.html
View file

@ -19,7 +19,7 @@
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<a class="btn btn-danger buttonClear" data-bind="command: clearCommand"> <a class="btn btn-danger" data-bind="command: clearCommand">
<i class="fontastic" data-bind="css: {'icon-spinner white': clearingProcess()}">🔥</i> <i class="fontastic" data-bind="css: {'icon-spinner white': clearingProcess()}">🔥</i>
<span data-i18n="GLOBAL/CLEAR"></span> <span data-i18n="GLOBAL/CLEAR"></span>
</a> </a>

4
snappymail/v/0.0.0/themes/SquaresDark/styles.less
View file

@ -143,3 +143,7 @@
.b-folders li a.focused { .b-folders li a.focused {
background-color: #111; background-color: #111;
} }
.tabs [id^="tab"]:checked + label {
color: #000;
}