Reduce excessive DOM even more

dev/Styles/User/Animations.less

@@ -5,12 +5,6 @@
 	100% { transform: scale(1); }
 }
 
-@keyframes textLoadingAnimationKeyFrame {
-	0% { opacity: 1; }
-	33% { opacity: 0; }
-	100% { opacity: 1; }
-}
-
 @keyframes animate-stripes {
 	0% {background-position: 0 0;}
 	100% {background-position: 60px 0;}
@@ -57,15 +51,3 @@
 		animation: animate-stripes 2s linear infinite;
 	}
 }
-
-.textLoadingAnimationD1, .textLoadingAnimationD2, .textLoadingAnimationD3 {
-	animation: textLoadingAnimationKeyFrame 1s linear infinite 0s;
-}
-
-.textLoadingAnimationD2 {
-	animation-delay: 0.3s;
-}
-
-.textLoadingAnimationD3 {
-	animation-delay: 0.6s;
-}

dev/Styles/User/FolderList.less

@@ -78,26 +78,6 @@
 			font-size: 14px;
 			border-left: 3px solid transparent;
 
-			.inbox-star-icon {
-				display: none;
-				margin-left: 7px;
-
-				.flagged {
-					display: none;
-				}
-				.unflagged {
-					opacity: .5;
-
-					&:hover {
-						opacity: 1;
-					}
-				}
-			}
-
-			&.is-inbox .inbox-star-icon {
-				display: inline;
-			}
-
 			padding: 0 @folderItemPadding;
 
 			text-decoration: none;
@@ -184,13 +164,18 @@
 		text-shadow: 0 -1px 0 rgba(0,0,0,.25);
 	}
 
+	.inbox-star-icon {
+		margin-left: 7px;
+	}
+	.inbox-star-icon::after {
+		content:'☆';
+		opacity: .5;
+	}
 	&.inbox-is-starred {
-		.flagged {
+		.inbox-star-icon::after {
 			color: orange;
-			display: inline-block !important;
-		}
-		.unflagged {
-			display: none;
+			content:'★';
+			opacity: 1;
 		}
 	}
 

dev/Styles/User/MessageList.less

@@ -53,6 +53,7 @@ html.rl-no-preview-pane {
 	}
 
 	.btn.buttonMoreSearch {
+		font-size: 11px;
 		padding-left: 8px;
 		padding-right: 8px;
 	}
@@ -154,6 +155,12 @@ html.rl-no-preview-pane {
 			}
 		}
 
+		.listEmptyListLoading .icon-spinner {
+			width: 0.75em;
+			height: 0.75em;
+			margin: 0;
+		}
+
 		.listDragOver {
 			max-height: 0;
 			overflow: hidden;

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

@@ -6,7 +6,7 @@
 		</a>
 		<a class="btn buttonContacts fontastic" data-bind="visible: allowContacts, click: contactsClick" data-i18n="[title]GLOBAL/CONTACTS">📇</a>
 	</div>
-	<div class="b-content" data-bind="css: {'inbox-is-starred': isInboxStarred}">
+	<div class="b-content">
 		<div class="b-folders-system" data-bind="template: { name: 'MailFolderListSystemItem', foreach: folderListSystem }"></div>
 		<hr/>
 		<div class="b-folders-user" data-bind="template: { name: 'MailFolderListItem', foreach: folderList }"></div>

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

@@ -1,11 +1,8 @@
 <div class="e-item b-folder-system-item">
 	<a data-bind="dropmessages: $data,
-		css: { 'selected': selected, 'selectable': selectable, 'anim-action-class': actionBlink, 'is-inbox': isInbox },
+		css: { 'selected': selected, 'selectable': selectable, 'anim-action-class': actionBlink },
 		attr: { 'data-unread': printableUnreadCount }">
 		<span class="name" data-bind="text: localName()"></span>
-		<span class="inbox-star-icon">
-			<i class="fontastic flagged">★</i>
-			<i class="fontastic unflagged">☆</i>
-		</span>
+		<span class="inbox-star-icon fontastic" data-bind="visible: isInbox"></span>
 	</a>
 </div>

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

@@ -164,15 +164,13 @@
 						<a class="close" data-bind="click: cancelSearch, visible: '' !== messageListSearchDesc()">×</a>
 						<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>
-					<a class="btn buttonMoreSearch" data-bind="visible: allowSearchAdv, click: advancedSearchClick">
-						<span class="caret"></span>
-					</a>
+					<a class="btn buttonMoreSearch" data-bind="visible: allowSearchAdv, click: advancedSearchClick">▼</a>
 				</div>
 			</div>
 		</div>
 		<div class="b-content" data-bind="initDom: dragOverBodyArea">
 			<div class="listThreadUidDesc" data-bind="visible: '' !== messageListEndThreadUid(), click: cancelThreadUid">
-				<i class="fontastic" data-bind="click: cancelThreadUid">⬅</i>
+				<i class="fontastic">⬅</i>
 				<span data-i18n="MESSAGE_LIST/BACK_TO_MESSAGE_LIST"></span>
 			</div>
 			<div class="listSearchDesc" data-bind="visible: '' !== messageListSearchDesc(), text: messageListSearchDesc"></div>
@@ -181,19 +179,15 @@
 				<span data-i18n="MESSAGE_LIST/PUT_MESSAGE_HERE"></span>
 			</div>
 			<div class="listClear" data-bind="visible: clearListIsVisible()">
-				<span class="g-ui-link" data-i18n="MESSAGE_LIST/BUTTON_EMPTY_FOLDER" data-bind="command: clearCommand"></span>
-			</div>
-			<div class="listError" data-bind="visible: !dragOver() && '' !== messageListError()">
-				<span class="error" data-bind="text: messageListError"></span>
+				<a href="#" class="g-ui-link" data-i18n="MESSAGE_LIST/BUTTON_EMPTY_FOLDER" data-bind="command: clearCommand"></a>
 			</div>
+			<div class="listError error" data-bind="visible: !dragOver() && '' !== messageListError(), text: messageListError"></div>
 			<div class="listEmptyList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' === messageListSearch()"
 				data-i18n="MESSAGE_LIST/EMPTY_LIST"></div>
 			<div class="listEmptyListLoading" data-bind="visible: !dragOver() && 0 === messageList().length &&
 				messageListCompleteLoadingThrottle() && '' === messageListError()">
+				<i class="icon-spinner"></i>
 				<span data-i18n="GLOBAL/LOADING"></span>
-				<span class="textLoadingAnimationD1">.</span>
-				<span class="textLoadingAnimationD2">.</span>
-				<span class="textLoadingAnimationD3">.</span>
 			</div>
 			<div class="listEmptySearchList" data-bind="visible: !dragOver() && 0 === messageList().length && !messageListCompleteLoadingThrottle() && '' === messageListError() && '' !== messageListSearch()"
 				data-i18n="MESSAGE_LIST/EMPTY_SEARCH_LIST"></div>

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

@@ -33,9 +33,7 @@
 							<!-- ko if: 1 < identitiesOptions().length -->
 								<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="identity-label-id" data-bind="foreach: identitiesOptions">
 									<li class="e-item" role="presentation">
-										<a class="e-link menuitem" tabindex="-1" href="javascript:void(0);" data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }">
-											<span data-bind="text: optText"></span>
-										</a>
+										<a class="e-link menuitem" tabindex="-1" href="#" data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }, text: optText"></a>
 									</li>
 								</ul>
 							<!-- /ko -->

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

@@ -169,7 +169,7 @@
 										data-bind="value: value, hasfocus: focused, valueUpdate: 'keyup'" />
 								</div>
 							</div>
-							<a href="javascript:void(0);" class="g-ui-link add-link" data-bind="visible: !viewReadOnly(), click: addNewEmail" data-i18n="CONTACTS/LINK_ADD_EMAIL"></a>
+							<a href="#" class="g-ui-link add-link" data-bind="visible: !viewReadOnly(), click: addNewEmail" data-i18n="CONTACTS/LINK_ADD_EMAIL"></a>
 						</div>
 					</div>
 					<div class="control-group" data-bind="visible: 0 < viewPropertiesPhones().length">