Improve font middle arrows

Simplify login spinner

dev/Styles/Login.less

@@ -39,7 +39,7 @@
 			margin: 0;
 		}
 
-		.input-append .add-on i,
+		.input-append .add-on *,
 		.loginForm, .legend, .e-checkbox-icon, .g-ui-link, .language-button {
 			color: var(--login-color, @glass-m-color);
 			text-shadow: none !important;
@@ -99,7 +99,7 @@
 			}
 
 			&.error {
-				.input-append .add-on i {
+				.input-append .add-on * {
 					color: @glass-error-color;
 				}
 
@@ -123,20 +123,15 @@
 			border: 0;
 		}
 
-		.input-append .add-on i {
+		.input-append .add-on * {
 			font-size: 17px;
 			line-height: 29px;
 			outline: none !important;
 			box-shadow: none !important;
-
-			&.login-submit-icon{
-				font-size: 24px;
-				padding-top: 2px;
-				cursor: pointer;
-			}
 		}
 
-		.controls.error .add-on i, .control-group.error .add-on i {
+		.controls.error .add-on *,
+		.control-group.error .add-on * {
 			color: #b94a48;
 		}
 	}
@@ -181,19 +176,10 @@
 
 .submitting-pane {
 	position: relative;
-	&.submitting:before{
+	&.submitting > * {
-		content: '';
+		opacity: 0.3;
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		background: var(---spinner-bg, rgba(0,0,0,.3));
-		border-radius: var(--login-border-radius, 7px);
-		z-index: 1051;
-		border-radius: 8px;
 	}
-	html &.submitting:after{
+	html &.submitting::after{
 		content: '';
 		position: absolute;
 		width: 60px;

snappymail/v/0.0.0/app/templates/Views/Admin/AdminLogin.html

@@ -26,9 +26,7 @@
 							data-bind="textInput: password, disable: submitRequest" />
 						<span class="add-on" tabindex="-1" data-bind="command: submitCommand, tooltip: 'LOGIN/BUTTON_LOGIN'">
 							<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
-							<button type="submit" class="btn-submit-icon-wrp" data-bind="visible: '' !== password()">
+							<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
-								<i class="icon-right-middle login-submit-icon"></i>
-							</button>
 						</span>
 					</div>
 				</div>

snappymail/v/0.0.0/app/templates/Views/Admin/AdminPane.html

@@ -1,11 +1,7 @@
 <div class="b-settings b-admin-right">
 	<div class="b-toolbar g-ui-user-select-none">
-		<a class="btn btn-thin-2 show-mobile" data-bind="click: showLeft, visible: leftPanelDisabled()">
+		<a class="btn btn-thin-2 show-mobile fontastic" data-bind="click: hideLeft, visible: !leftPanelDisabled()">❮</a>
-			<i class="icon-right-middle"></i>
+		<a class="btn btn-thin-2 show-mobile fontastic" data-bind="click: showLeft, visible: leftPanelDisabled()">❯</a>
-		</a>
-		<a class="btn btn-thin-2 show-mobile" data-bind="click: hideLeft, visible: !leftPanelDisabled()">
-			<i class="icon-left-middle"></i>
-		</a>
 		<i class="icon-spinner" style="margin: 10px" data-bind="style: {'visibility': adminManLoadingVisibility }"></i>
 		<h4>SnappyMail - <span data-i18n="TOP_PANEL/LABEL_ADMIN_PANEL"></span></h4>
 		<a class="btn btn-logout fontastic" data-bind="click: logoutClick">⏻</a>

snappymail/v/0.0.0/app/templates/Views/User/Login.html

@@ -39,9 +39,7 @@
 						<span class="add-on" tabindex="-1"
 							data-bind="command: submitCommand, tooltip: 'LOGIN/BUTTON_SIGN_IN'">
 							<i class="fontastic" data-bind="visible: '' === password()">🔑</i>
-							<button type="submit" class="btn-submit-icon-wrp" data-bind="visible: '' !== password()">
+							<button type="submit" class="btn-submit-icon-wrp login-submit-icon fontastic" data-bind="visible: '' !== password()">❯</button>
-								<i class="icon-right-middle login-submit-icon"></i>
-							</button>
 						</span>
 					</div>
 				</div>

snappymail/v/0.0.0/app/templates/Views/User/MailMessageList.html

@@ -4,12 +4,8 @@
 		<div class="toolbar">
 			<div class="btn-toolbar">
 				<!-- ko if: allowFolders -->
-				<a class="btn btn-thin-2 show-mobile" data-bind="click: showLeft, visible: leftPanelDisabled()">
+				<a class="btn btn-thin-2 fontastic show-mobile" data-bind="click: hideLeft, visible: !leftPanelDisabled()">❮</a>
-					<i class="icon-right-middle"></i>
+				<a class="btn btn-thin-2 fontastic show-mobile" data-bind="click: showLeft, visible: leftPanelDisabled()">❯</a>
-				</a>
-				<a class="btn btn-thin-2 show-mobile" data-bind="click: hideLeft, visible: !leftPanelDisabled()">
-					<i class="icon-left-middle"></i>
-				</a>
 				<!-- /ko -->
 				<a class="btn buttonCompose show-mobile" data-bind="click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_NEW_MESSAGE', css: {'btn-warning': composeInEdit, 'btn-success': !composeInEdit()}, visible: allowComposer && mobileCheckedStateHide()">
 					<i class="icon-paper-plane"></i>

snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html

@@ -19,12 +19,8 @@
 					<a class="btn button-delete fontastic" data-bind="command: deleteCommand, tooltip: 'GLOBAL/DELETE'">🗑</a>
 				</div>
 				<div class="btn-group">
-					<a class="btn btn-thin buttonUp" data-bind="command: goUpCommand">
+					<a class="btn btn-thin buttonUp fontastic" data-bind="command: goUpCommand">❮</a>
-						<i class="icon-left-middle"></i>
+					<a class="btn btn-thin buttonDown fontastic" data-bind="command: goDownCommand">❯</a>
-					</a>
-					<a class="btn btn-thin buttonDown" data-bind="command: goDownCommand">
-						<i class="icon-right-middle"></i>
-					</a>
 				</div>
 			</div>
 		</div>
@@ -164,9 +160,7 @@
 					<div class="messageItemHeader" data-bind="css: {'emptySubject': '' === viewSubject()}">
 						<div class="subjectParent">
 							<button class="close" data-bind="command: closeMessageCommand" style="margin-top: -2px;">×</button>
-							<span class="infoParent g-ui-user-select-none" data-bind="click: function() { showFullInfo(!showFullInfo()); }">
+							<span class="infoParent g-ui-user-select-none fontastic" data-bind="click: function() { showFullInfo(!showFullInfo()); }">ℹ</span>
-								<i class="icon-info" style="padding-top: 1px;"></i>
-							</span>
 							<span class="flagParent g-ui-user-select-none flagOff fontastic" data-bind="text: viewIsFlagged() ? '★' : '☆', css: {'flagOn': viewIsFlagged, 'flagOff': !viewIsFlagged()}"></span>
 							<b style="color: red; margin-right: 5px" data-bind="visible: viewIsImportant">!</b>
 							<span class="subject" data-bind="text: viewSubject, title: viewSubject, event: { 'dblclick': toggleFullScreen }"></span>

snappymail/v/0.0.0/app/templates/Views/User/SettingsPane.html

@@ -1,15 +1,11 @@
 <div class="b-settings b-settins-right">
 	<div class="b-toolbar" style="padding-left: 0">
 		<div class="btn-toolbar" style="margin-top: 2px;">
-			<div class="btn-group show-mobile" data-bind="visible: leftPanelDisabled()">
-				<a class="btn btn-thin-2" data-bind="click: showLeft">
-					<i class="icon-right-middle"></i>
-				</a>
-			</div>
 			<div class="btn-group show-mobile" data-bind="visible: !leftPanelDisabled()" style="margin-left: -1px">
-				<a class="btn btn-thin-2" data-bind="click: hideLeft">
+				<a class="btn btn-thin-2 fontastic" data-bind="click: hideLeft">❮</a>
-					<i class="icon-left-middle"></i>
+			</div>
-				</a>
+			<div class="btn-group show-mobile" data-bind="visible: leftPanelDisabled()">
+				<a class="btn btn-thin-2 fontastic" data-bind="click: showLeft">❯</a>
 			</div>
 			<a class="btn button-back" data-bind="click: backToMailBoxClick">
 				<i class="fontastic">⬅</i>

snappymail/v/0.0.0/themes/Clear/styles.less

@@ -1,5 +1,4 @@
 
 :root {
-	--spinner-background: rgba(255,255,255,.4);
 	--spinner-color: #666;
 }

snappymail/v/0.0.0/themes/Squares/styles.less

@@ -15,8 +15,6 @@
 	--login-border: none;
 	--login-border-radius: 7px;
 
-	--spinner-background: rgba(0,0,0,.2);
-
 	// MENU
 	--dropdown-menu-color: #333;
 	--dropdown-menu-bg-color: #fff;

snappymail/v/0.0.0/themes/Wood/styles.less

@@ -15,7 +15,6 @@
 	--login-border: none;
 	--login-border-radius: 7px;
 
-	--spinner-background: rgba(255,255,255,.4);
 	--spinner-color: #666;
 
 	// MENU

snappymail/v/0.0.0/themes/example.css

@@ -20,7 +20,6 @@
 	--login-gradient-start: none;	// #f4f4f4
 	--login-gradient-end: none;		// #dfdfdf
 
-	--spinner-background: rgba(0,0,0,.3);
 	--spinner-color: #fff;
 
 // MENU

vendors/fontastic/styles.css

@@ -94,17 +94,11 @@
 .icon-popup::before {
   content: "\e045";
 }
-.icon-left-middle::before {
-  content: "\e04b"; /* ❮ */
-}
-.icon-right-middle::before {
-  content: "\e04c"; /* ❯ */
-}
 .icon-mail::before {
   content: "✉";
 }
 .icon-archive::before {
-  content: "\e05f";
+  content: "\e05f"; /* 🗃 🗄️ */
 }
 .icon-filter::before {
   content: "\e061"; /* ⊆ */
@@ -130,146 +124,3 @@
 .icon-check-mark-circle-two::before {
   content: "\e073";
 }
-/*
-.icon-sync::before {
-  content: "⇆";
-}
-.icon-radio-checked::before {
-  content: "⦿";
-}
-.icon-radio-unchecked::before {
-  content: "○";
-}
-.icon-address-book::before {
-  content: "📇";
-}
-.icon-list::before {
-  content: "☰";
-}
-.icon-telephone::before {
-  content: "📞";
-}
-.icon-braille::before {
-  content: "⬍";
-}
-.icon-checkbox-checked::before {
-  content: "☑";
-}
-.icon-checkbox-unchecked::before {
-  content: "☐";
-}
-.icon-checkbox-partial::before {
-  content: "▣";
-}
-.icon-left::before {
-  content: "⬅";
-}
-.icon-up::before {
-  content: "⬆";
-}
-.icon-down::before {
-  content: "⬇";
-}
-.icon-image::before {
-  content: "🖼";
-}
-.icon-user::before {
-  content: "👤";
-}
-.icon-fire::before {
-  content: "🔥";
-}
-.icon-remove::before {
-  content: "✖";
-}
-.icon-floppy::before {
-  content: "💾";
-}
-.icon-right-dir::before {
-  content: "▶";
-}
-.icon-play::before {
-  content: "▶️"; ⏵ ⏯
-}
-.icon-key::before {
-  content: "🔑";
-}
-.icon-world::before {
-  content: "🌍";
-}
-.icon-eye::before {
-  content: "👁";
-}
-.icon-power::before {
-  content: "⏻";
-}
-.icon-wrench::before {
-  content: "🔧";
-}
-.icon-print::before {
-  content: "🖨";
-}
-.icon-cog::before {
-  content: "⚙";
-}
-.icon-forward::before {
-  content: "→";
-}
-.icon-search::before {
-  content: "🔎";
-}
-.icon-reply::before {
-  content: "←";
-}
-.icon-reply-all::before {
-  content: "↞";
-}
-.icon-mobile::before {
-  content: "📱";
-}
-.icon-pencil::before {
-  content: "🖉";
-}
-.icon-trash::before {
-  content: "🗑";
-}
-.icon-lock::before {
-  content: "🔒";
-}
-.icon-users::before {
-  content: "👥";
-}
-.icon-ellipsis-alt::before {
-  content: "⋮";
-}
-.icon-pause::before {
-  content: "⏸︎";
-}
-.icon-laptop::before {
-  content: "💻";
-}
-.icon-at::before {
-  content: "@";
-}
-.icon-warning::before {
-  content: "⚠";
-}
-.icon-spinner::before {
-  content: "\e05e";
-}
-.icon-folder::before {
-  content: "📁";
-}
-.icon-plus::before {
-  content: "✚";
-}
-.icon-star-empty::before {
-  content: "☆";
-}
-.icon-star-half::before {
-  content: "⯪";
-}
-.icon-star::before {
-  content: "★";
-}
-*/