mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-09-08 17:07:03 +03:00
Cleanup some CSS and improve mail compose screen
This commit is contained in:
djmaze
parent
09a9a45e98
commit
2efa0d8eb7
6 changed files with 108 additions and 145 deletions
|
|
@ -19,13 +19,11 @@
|
|||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="b-header g-ui-user-select-none">
|
||||
<div class="g-ui-table">
|
||||
<div class="e-row" style="height: 40px;">
|
||||
<div class="e-cell e-label">
|
||||
<label class="control-label" data-i18n="GLOBAL/FROM"></label>
|
||||
</div>
|
||||
<div class="e-cell e-value">
|
||||
<div class="dropdown pull-left" data-bind="registerBootstrapDropdown: true, openDropdownTrigger: identitiesDropdownTrigger">
|
||||
<table>
|
||||
<tr>
|
||||
<td data-i18n="GLOBAL/FROM"></td>
|
||||
<td>
|
||||
<div class="dropdown" style="display:inline-block" data-bind="registerBootstrapDropdown: true, openDropdownTrigger: identitiesDropdownTrigger">
|
||||
<a class="dropdown-toggle e-identity" href="#" tabindex="-1"
|
||||
id="identity-label-id" role="button"
|
||||
data-bind="text: currentIdentityView, css: {'multiply': 1 < identitiesOptions().length }">
|
||||
|
|
@ -39,9 +37,30 @@
|
|||
<!-- /ko -->
|
||||
</div>
|
||||
<div class="pull-right">
|
||||
<div class="btn-group dropdown colored-toggle pull-right" style="margin-right: 4px;" data-bind="registerBootstrapDropdown: true">
|
||||
<a class="btn" data-i18n="GLOBAL/BCC"
|
||||
data-bind="visible: !showBcc(), click: function () { showBcc(true); }"></a>
|
||||
<a class="btn fontastic" data-bind="visible: allowContacts, command: contactsCommand" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
|
||||
<div class="btn-group dropdown colored-toggle" data-bind="registerBootstrapDropdown: true" style="display:inline;vertical-align:top">
|
||||
<a class="btn dropdown-toggle fontastic">☰</a>
|
||||
<ul class="dropdown-menu right-edge g-ui-menu" role="menu">
|
||||
<li class="e-item" data-bind="click: function () { showBcc(!showBcc()); }">
|
||||
<a class="e-link">
|
||||
<i class="fontastic" data-bind="text: showBcc() ? '☑' : '☐'"></i>
|
||||
<span data-i18n="GLOBAL/BCC"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="e-item" data-bind="click: function () { showCc(!showCc()); }">
|
||||
<a class="e-link">
|
||||
<i class="fontastic" data-bind="text: showCc() ? '☑' : '☐'"></i>
|
||||
<span data-i18n="GLOBAL/CC"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="e-item" data-bind="click: function () { showReplyTo(!showReplyTo()); }">
|
||||
<a class="e-link">
|
||||
<i class="fontastic" data-bind="text: showReplyTo() ? '☑' : '☐'"></i>
|
||||
<span data-i18n="GLOBAL/REPLY_TO"></span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="e-item" data-bind="click: function () { requestReadReceipt(!requestReadReceipt()); }">
|
||||
<a class="e-link">
|
||||
<i class="fontastic" data-bind="text: requestReadReceipt() ? '☑' : '☐'"></i>
|
||||
|
|
@ -68,92 +87,70 @@
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="btn-group pull-right">
|
||||
<a class="btn fontastic" data-bind="visible: allowContacts, command: contactsCommand" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
|
||||
</div>
|
||||
</div>
|
||||
<span class="pull-right">
|
||||
<span class="g-ui-link" data-i18n="GLOBAL/CC"
|
||||
data-bind="visible: !showCc(), click: function () { showCc(true); }"></span>
|
||||
|
||||
<span data-bind="visible: !showBcc()">
|
||||
<span class="g-ui-link" data-i18n="GLOBAL/BCC"
|
||||
data-bind="click: function () { showBcc(true); }"></span>
|
||||
|
||||
</span>
|
||||
<span class="g-ui-link" data-i18n="GLOBAL/REPLY_TO"
|
||||
data-bind="visible: !showReplyTo(), click: function () { showReplyTo(true); }"></span>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row">
|
||||
<div class="e-cell e-label">
|
||||
<label class="control-label" data-bind="css: {'error-to': emptyToError}, tooltipErrorTip: emptyToErrorTooltip"
|
||||
data-i18n="GLOBAL/TO"</label>
|
||||
</div>
|
||||
<div class="e-cell e-value">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<label data-bind="css: {'error-to': emptyToError}, tooltipErrorTip: emptyToErrorTooltip"
|
||||
data-i18n="GLOBAL/TO"></label>
|
||||
</td>
|
||||
<td>
|
||||
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" data-bind="emailsTags: to, autoCompleteSource: emailsSource" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row cc-row" data-bind="visible: showCc">
|
||||
<div class="e-cell e-label" data-i18n="GLOBAL/CC"></div>
|
||||
<div class="e-cell e-value">
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="cc-row" data-bind="visible: showCc">
|
||||
<td data-i18n="GLOBAL/CC"></div>
|
||||
<td>
|
||||
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" data-bind="emailsTags: cc, autoCompleteSource: emailsSource" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row bcc-row" data-bind="visible: showBcc">
|
||||
<div class="e-cell e-label" data-i18n="GLOBAL/BCC"></div>
|
||||
<div class="e-cell e-value">
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="bcc-row" data-bind="visible: showBcc">
|
||||
<td data-i18n="GLOBAL/BCC"></div>
|
||||
<td>
|
||||
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" data-bind="emailsTags: bcc, autoCompleteSource: emailsSource" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row reply-to-row" data-bind="visible: showReplyTo">
|
||||
<div class="e-cell e-label" data-i18n="GLOBAL/REPLY_TO"></div>
|
||||
<div class="e-cell e-value">
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="reply-to-row" data-bind="visible: showReplyTo">
|
||||
<td data-i18n="GLOBAL/REPLY_TO"></div>
|
||||
<td>
|
||||
<input type="text" autocomplete="off" autocorrect="off" autocapitalize="off" spellcheck="false" data-bind="emailsTags: replyTo, autoCompleteSource: emailsSource" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row">
|
||||
<div class="e-cell e-label" data-i18n="GLOBAL/SUBJECT"></div>
|
||||
<div class="e-cell e-value">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-i18n="GLOBAL/SUBJECT"></div>
|
||||
<td>
|
||||
<input type="text" size="70" autocomplete="off" data-bind="textInput: subject" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="e-row">
|
||||
<div class="e-cell e-label"></div>
|
||||
<div class="e-cell e-value">
|
||||
<div>
|
||||
<div class="pull-left">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn" data-bind="click: function () { attachmentsPlace(false); },
|
||||
css: { 'active': !attachmentsPlace() }">
|
||||
<i class="icon-file-text"></i>
|
||||
</button>
|
||||
<button type="button" class="btn" data-bind="click: function () { attachmentsPlace(true); },
|
||||
css: { 'btn-danger': 0 < attachmentsInErrorCount(), 'active': attachmentsPlace() },
|
||||
tooltipErrorTip: attachmentsErrorTooltip">
|
||||
<span data-bind="visible: 0 < attachmentsCount()">
|
||||
<b data-bind="text: attachmentsCount"></b>
|
||||
|
||||
</span>
|
||||
<i data-bind="css: { 'icon-attachment': 0 === attachmentsInProcessCount(), 'icon-spinner': 0 < attachmentsInProcessCount()}"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="pull-right" style="margin-right: 4px;">
|
||||
<div class="btn-group pull-right">
|
||||
<a class="btn"
|
||||
style="padding-left: 10px; padding-right: 10px;"
|
||||
data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton" data-i18n="[title]COMPOSE/ATTACH_FILES">
|
||||
<sup style="font-weight: bold; font-size: 100%; top: -0.3em;">+</sup><i class="icon-attachment"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>
|
||||
<div class="btn-group pull-left">
|
||||
<button type="button" class="btn" data-bind="click: function () { attachmentsPlace(false); },
|
||||
css: { 'active': !attachmentsPlace() }">
|
||||
<i class="icon-file-text"></i>
|
||||
</button>
|
||||
<button type="button" class="btn" data-bind="click: function () { attachmentsPlace(true); },
|
||||
css: { 'btn-danger': 0 < attachmentsInErrorCount(), 'active': attachmentsPlace() },
|
||||
tooltipErrorTip: attachmentsErrorTooltip">
|
||||
<span data-bind="visible: 0 < attachmentsCount()">
|
||||
<b data-bind="text: attachmentsCount"></b>
|
||||
|
||||
</span>
|
||||
<i data-bind="css: { 'icon-attachment': 0 === attachmentsInProcessCount(), 'icon-spinner': 0 < attachmentsInProcessCount()}"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-group pull-right">
|
||||
<a class="btn"
|
||||
style="padding-left: 10px; padding-right: 10px;"
|
||||
data-bind="visible: addAttachmentEnabled(), initDom: composeUploaderButton" data-i18n="[title]COMPOSE/ATTACH_FILES">
|
||||
<sup style="font-weight: bold; font-size: 100%; top: -0.3em;">+</sup><i class="icon-attachment"></i>
|
||||
</a>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="attachmentAreaParent b-content" data-bind="visible: attachmentsPlace">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue