Keyboard shortcuts optimizations (#70)

Folder list focused state

dev/Common/Constants.js

@@ -38,7 +38,7 @@ Consts.Defaults.SearchAjaxTimeout = 120000;
  * @const
  * @type {number}
  */
-Consts.Defaults.SendMessageAjaxTimeout = 200000;
+Consts.Defaults.SendMessageAjaxTimeout = 300000;
 
 /**
  * @const

dev/Common/Enums.js

@@ -35,11 +35,13 @@ Enums.KeyState = {
 	'None': 'none',
 	'ContactList': 'contact-list',
 	'MessageList': 'message-list',
+	'FolderList': 'folder-list',
 	'MessageView': 'message-view',
 	'Compose': 'compose',
 	'Settings': 'settings',
 	'Menu': 'menu',
 	'PopupComposeOpenPGP': 'compose-open-pgp',
+	'PopupKeyboardShortcutsHelp': 'popup-keyboard-shortcuts-help',
 	'PopupAsk': 'popup-ask'
 };
 

dev/Common/Globals.js

@@ -13,7 +13,7 @@ Globals.momentTrigger = ko.observable(true);
 /**
  * @type {?}
  */
-Globals.dropdownVisibility = ko.observable(false);
+Globals.dropdownVisibility = ko.observable(false).extend({'rateLimit': 0});
 
 /**
  * @type {?}

dev/Common/Knockout.js

@@ -5,22 +5,33 @@ ko.bindingHandlers.tooltip = {
 		if (!Globals.bMobileDevice)
 		{
 			var
-				sClass = $(oElement).data('tooltip-class') || '',
+				$oEl = $(oElement),
-				sPlacement = $(oElement).data('tooltip-placement') || 'top'
+				sClass = $oEl.data('tooltip-class') || '',
+				sPlacement = $oEl.data('tooltip-placement') || 'top'
 			;
 
-			$(oElement).tooltip({
+			$oEl.tooltip({
 				'delay': {
 					'show': 500,
 					'hide': 100
 				},
 				'html': true,
+				'container': 'body',
 				'placement': sPlacement,
 				'trigger': 'hover',
 				'title': function () {
-					return '<span class="tooltip-class ' + sClass + '">' +
+					return $oEl.is('.disabled') || Globals.dropdownVisibility() ? '' : '<span class="tooltip-class ' + sClass + '">' +
 						Utils.i18n(ko.utils.unwrapObservable(fValueAccessor())) + '</span>';
 				}
+			}).click(function () {
+				$oEl.tooltip('hide');
+			});
+
+			Globals.dropdownVisibility.subscribe(function (bValue) {
+				if (bValue)
+				{
+					$oEl.tooltip('hide');
+				}
 			});
 		}
 	}
@@ -29,51 +40,39 @@ ko.bindingHandlers.tooltip = {
 ko.bindingHandlers.tooltip2 = {
 	'init': function (oElement, fValueAccessor) {
 		var
-			sClass = $(oElement).data('tooltip-class') || '',
+			$oEl = $(oElement),
-			sPlacement = $(oElement).data('tooltip-placement') || 'top'
+			sClass = $oEl.data('tooltip-class') || '',
+			sPlacement = $oEl.data('tooltip-placement') || 'top'
 		;
-		$(oElement).tooltip({
+
+		$oEl.tooltip({
 			'delay': {
 				'show': 500,
 				'hide': 100
 			},
 			'html': true,
+			'container': 'body',
 			'placement': sPlacement,
 			'title': function () {
-				return '<span class="tooltip-class ' + sClass + '">' + fValueAccessor()() + '</span>';
+				return $oEl.is('.disabled') || Globals.dropdownVisibility() ? '' :
+					'<span class="tooltip-class ' + sClass + '">' + fValueAccessor()() + '</span>';
+			}
+		}).click(function () {
+			$oEl.tooltip('hide');
+		});
+
+		Globals.dropdownVisibility.subscribe(function (bValue) {
+			if (bValue)
+			{
+				$oEl.tooltip('hide');
 			}
 		});
 	}
 };
 
-ko.__detectDropdownVisibility = _.debounce(function ($el) {
+ko.bindingHandlers.registrateBootstrapDropdown = {
-	Globals.dropdownVisibility(!!$el.hasClass('open'));
-}, 50);
-
-ko.bindingHandlers.dropdownOpenStatus = {
 	'init': function (oElement) {
-		var $el = $(oElement);
+		BootstrapDropdowns.push($(oElement));
-
-		$el.find('.dropdown-toggle').click(function () {
-			ko.__detectDropdownVisibility($el);
-		});
-		
-//		$el.on('.dropdown-menu .menuitem', 'click', function () {
-//			$el.removeClass('open');
-//			ko.__detectDropdownVisibility($el);
-//		});
-
-//		$el.on('.dropdown-menu .menuitem', 'keydown', function (oEvent) {
-//			if (oEvent && Enums.EventKeyCode.Esc === oEvent.keyCode)
-//			{
-//				$el.removeClass('open');
-//				ko.__detectDropdownVisibility($el);
-//			}
-//		});
-		
-		$html.on('click.dropdown.data-api', function () {
-			ko.__detectDropdownVisibility($el);
-		});
 	}
 };
 
@@ -85,7 +84,7 @@ ko.bindingHandlers.openDropdownTrigger = {
 			if (!$el.hasClass('open'))
 			{
 				$el.find('.dropdown-toggle').dropdown('toggle');
-				ko.__detectDropdownVisibility($el);
+				Utils.detectDropdownVisibility();
 			}
 			
 			fValueAccessor()(false);
@@ -184,13 +183,16 @@ ko.bindingHandlers.clickOnTrue = {
 
 ko.bindingHandlers.modal = {
 	'init': function (oElement, fValueAccessor) {
-		$(oElement).toggleClass('fade', !Globals.bMobileDevice) .modal({
+		
+		$(oElement).toggleClass('fade', !Globals.bMobileDevice).modal({
 			'keyboard': false,
 			'show': ko.utils.unwrapObservable(fValueAccessor())
-		}).on('hidden', function () {
+		})
-			fValueAccessor()(false);
+		.on('shown', function () {
-		}).on('shown', function () {
 			Utils.windowResize();
+		})
+		.find('.close').click(function () {
+			fValueAccessor()(false);
 		});
 	},
 	'update': function (oElement, fValueAccessor) {

dev/Common/Selector.js

@@ -108,10 +108,8 @@ function Selector(oKoList, oKoSelectedItem,
 	this.sItemFocusedSelector = sItemFocusedSelector;
 	
 	this.sLastUid = '';
-	this.oCallbacks = {};
-
-	this.bUseKeyboard = true;
 	this.bAutoSelect = true;
+	this.oCallbacks = {};
 
 	this.emptyFunction = function () {};
 
@@ -320,7 +318,6 @@ Selector.prototype.init = function (oContentVisible, oContentScrollable, sKeySco
 			})
 		;
 
-// TODO
 		key('enter', sKeyScope, function () {
 			if (self.focusedItem())
 			{
@@ -379,11 +376,6 @@ Selector.prototype.init = function (oContentVisible, oContentScrollable, sKeySco
 	}
 };
 
-Selector.prototype.useKeyboard = function (bValue)
-{
-	this.bUseKeyboard = !!bValue;
-};
-
 Selector.prototype.autoSelect = function (bValue)
 {
 	this.bAutoSelect = !!bValue;

dev/Common/Utils.js

@@ -1736,7 +1736,7 @@ Utils.disableKeyFilter = function ()
 	if (window.key)
 	{
 		key.filter = function () {
-			return true;
+			return RL.data().useKeyboardShortcuts();
 		};
 	}
 };
@@ -1746,15 +1746,27 @@ Utils.restoreKeyFilter = function ()
 	if (window.key)
 	{
 		key.filter = function (event) {
-			var
-				element = event.target || event.srcElement,
-				tagName = element ? element.tagName : ''
-			;
 
-			tagName = tagName.toUpperCase();
+			if (RL.data().useKeyboardShortcuts())
-			return !(tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA' ||
+			{
-				(element && tagName === 'DIV' && 'editorHtmlArea' === element.className && element.contentEditable)
+				var
-			);
+					element = event.target || event.srcElement,
+					tagName = element ? element.tagName : ''
+				;
+
+				tagName = tagName.toUpperCase();
+				return !(tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA' ||
+					(element && tagName === 'DIV' && 'editorHtmlArea' === element.className && element.contentEditable)
+				);
+			}
+
+			return false;
 		};
 	}
 };
+
+Utils.detectDropdownVisibility = _.debounce(function () {
+	Globals.dropdownVisibility(!!_.find(BootstrapDropdowns, function (oItem) {
+		return oItem.hasClass('open');
+	}));
+}, 50);

dev/Common/_Begin.js

@@ -46,6 +46,11 @@ var
 		'settings-disabled': []
 	},
 
+	/**
+	 * @type {Array}
+	 */
+	BootstrapDropdowns = [],
+
 	/**
 	 * @type {*}
 	 */

dev/Common/_End.js

@@ -7,6 +7,10 @@ $window.unload(function () {
 	Globals.bUnload = true;
 });
 
+$html.on('click.dropdown.data-api', function () {
+	Utils.detectDropdownVisibility();
+});
+
 // export
 window['rl'] = window['rl'] || {};
 window['rl']['addHook'] = Plugins.addHook;

dev/Knoin/AbstractViewModel.js

@@ -16,11 +16,8 @@ function KnoinAbstractViewModel(sPosition, sTemplate)
 
 	this.viewModelName = '';
 	this.viewModelVisibility = ko.observable(false);
-	if ('Popups' === this.sPosition)
+	this.modalVisibility = ko.observable(false).extend({'rateLimit': 0});
-	{
+	
-		this.modalVisibility = ko.observable(false);
-	}
-
 	this.viewModelDom = null;
 }
 

dev/Knoin/Knoin.js

@@ -100,6 +100,32 @@ Knoin.prototype.buildViewModel = function (ViewModelClass, oScreen)
 				oViewModel.cancelCommand = oViewModel.closeCommand = Utils.createCommand(oViewModel, function () {
 					kn.hideScreenPopup(ViewModelClass);
 				});
+
+				oViewModel.modalVisibility.subscribe(function (bValue) {
+
+					var self = this;
+					if (bValue)
+					{
+						this.viewModelDom.show();
+						this.storeAndSetKeyScope();
+
+						RL.popupVisibilityNames.push(this.viewModelName);
+
+						Utils.delegateRun(this, 'onFocus', [], 500);
+					}
+					else
+					{
+						Utils.delegateRun(this, 'onHide');
+						this.restoreKeyScope();
+
+						RL.popupVisibilityNames.remove(this.viewModelName);
+
+						_.delay(function () {
+							self.viewModelDom.hide();
+						}, 300);
+					}
+					
+				}, oViewModel);
 			}
 		
 			Plugins.runHook('view-model-pre-build', [ViewModelClass.__name, oViewModel, oViewModelDom]);
@@ -142,16 +168,7 @@ Knoin.prototype.hideScreenPopup = function (ViewModelClassToHide)
 	if (ViewModelClassToHide && ViewModelClassToHide.__vm && ViewModelClassToHide.__dom)
 	{
 		ViewModelClassToHide.__vm.modalVisibility(false);
-		Utils.delegateRun(ViewModelClassToHide.__vm, 'onHide');
-		ViewModelClassToHide.__vm.restoreKeyScope();
-
-		RL.popupVisibilityNames.remove(ViewModelClassToHide.__name);
-
 		Plugins.runHook('view-model-on-hide', [ViewModelClassToHide.__name, ViewModelClassToHide.__vm]);
-		
-		_.delay(function () {
-			ViewModelClassToHide.__dom.hide();
-		}, 300);
 	}
 };
 
@@ -167,17 +184,9 @@ Knoin.prototype.showScreenPopup = function (ViewModelClassToShow, aParameters)
 
 		if (ViewModelClassToShow.__vm && ViewModelClassToShow.__dom)
 		{
-			ViewModelClassToShow.__dom.show();
 			ViewModelClassToShow.__vm.modalVisibility(true);
-
 			Utils.delegateRun(ViewModelClassToShow.__vm, 'onShow', aParameters || []);
-			ViewModelClassToShow.__vm.storeAndSetKeyScope();
-
-			RL.popupVisibilityNames.push(ViewModelClassToShow.__name);
-			
 			Plugins.runHook('view-model-on-show', [ViewModelClassToShow.__name, ViewModelClassToShow.__vm, aParameters || []]);
-
-			Utils.delegateRun(ViewModelClassToShow.__vm, 'onFocus', [], 500);
 		}
 	}
 };

dev/Storages/AbstractData.js

@@ -5,6 +5,8 @@
  */
 function AbstractData()
 {
+	this.useKeyboardShortcuts = ko.observable(true);
+	
 	this.keyScopeReal = ko.observable(Enums.KeyState.All);
 	this.keyScopeFake = ko.observable(Enums.KeyState.All);
 	
@@ -33,13 +35,12 @@ function AbstractData()
 				}
 			}
 			
-//			window.console.log(sValue + '/' + this.keyScopeFake());
 			this.keyScopeReal(sValue);
 		}
 	});
 	
 	this.keyScopeReal.subscribe(function (sValue) {
-		window.console.log(sValue);
+//		window.console.log(sValue);
 		key.setScope(sValue);
 	});
 

dev/Storages/WebMailData.js

@@ -85,6 +85,7 @@ function WebMailDataStorage()
 	// folders
 	this.namespace = '';
 	this.folderList = ko.observableArray([]);
+	this.folderList.focused = ko.observable(false);
 
 	this.foldersListError = ko.observable('');
 
@@ -279,6 +280,7 @@ function WebMailDataStorage()
 	this.message.focused.subscribe(function (bValue) {
 		if (bValue)
 		{
+			RL.data().folderList.focused(false);
 			RL.data().keyScope(Enums.KeyState.MessageView);
 		}
 		else if (Enums.KeyState.MessageView === RL.data().keyScope())
@@ -287,6 +289,17 @@ function WebMailDataStorage()
 		}
 	});
 	
+	this.folderList.focused.subscribe(function (bValue) {
+		if (bValue)
+		{
+			RL.data().keyScope(Enums.KeyState.FolderList);
+		}
+		else if (Enums.KeyState.FolderList === RL.data().keyScope())
+		{
+			RL.data().keyScope(Enums.KeyState.MessageList);
+		}
+	});
+	
 	this.messageLoading.subscribe(function (bValue) {
 		this.messageLoadingThrottle(bValue);
 	}, this);
@@ -363,8 +376,6 @@ function WebMailDataStorage()
 	}, this);
 
 	// other
-	this.useKeyboardShortcuts = ko.observable(true);
-	
 	this.allowOpenPGP = ko.observable(false);
 	this.openpgpkeys = ko.observableArray([]);
 	this.openpgpKeyring = null;

dev/Styles/@Main.less

@@ -23,6 +23,12 @@
 @import "../../vendors/bootstrap/less/button-groups.less";
 @import "../../vendors/bootstrap/less/alerts.less";
 
+@import "../../vendors/bootstrap/less/navs.less";
+@import "../../vendors/bootstrap/less/navbar.less";
+@import "../../vendors/bootstrap/less/breadcrumbs.less";
+// @import "../../vendors/bootstrap/less/pagination.less";
+// @import "../../vendors/bootstrap/less/pager.less";
+
 @import "../../vendors/bootstrap/less/modals.less";
 @import "../../vendors/bootstrap/less/tooltip.less";
 @import "../../vendors/bootstrap/less/popovers.less";

dev/Styles/Compose.less

@@ -54,13 +54,22 @@
 		color: #333;
 
 		.e-identity {
+
+			color: #333;
+			text-decoration: none;
 			font-weight: bold;
 
+			&:hover {
+				color: #333;
+				text-decoration: none;
+			}
+
 			&.multiply {
 				cursor: pointer;
 				border-bottom: 1px dashed #555;
 			}
 		}
+		
 		.e-row {
 			line-height: 30px;
 		}

dev/Styles/FolderList.less

@@ -4,6 +4,9 @@
 
 .b-folders {
 
+	&.focused .b-content {
+	}
+
 	.b-toolbar {
 		position: absolute;
 		top: 0;
@@ -75,10 +78,14 @@
 				color: #000;
 				cursor: pointer;
 
-				&:hover, &.selected, &.droppableHover {
+				&:hover, &.selected, &.focused, &.droppableHover {
 					background-color: #555;
 					color: #fff;
 				}
+				&.focused {
+					background-color: #888;
+					color: #fff;
+				}
 			}
 
 			&.system {

dev/Styles/Shortcuts.less

@@ -1,10 +1,8 @@
 .popups {
 	.b-shortcuts-content {
-
 		&.modal {
-			width: 1025px;
+			width: 700px;
 		}
-
 		.modal-header {
 			background-color: #fff;
 		}

dev/Styles/_BootstrapFix.less

@@ -115,6 +115,8 @@ html.rgba.textshadow {
 
 .tooltip {
 	font-size: 14px;
+    z-index: 2000 !important;
+
 	&.in {
 		.opacity(100);
 	}
@@ -203,6 +205,10 @@ select {
 	color: #b94a48;
 }
 
+.nav-tabs > li > a {
+	color: #555;
+}
+
 html.no-rgba .modal {
 	border-width: 0px !important;
 }

dev/ViewModels/AbstractSystemDropDownViewModel.js

@@ -75,7 +75,7 @@ AbstractSystemDropDownViewModel.prototype.onBuild = function ()
 {
 	var self = this;
 	key('`', [Enums.KeyState.MessageList, Enums.KeyState.MessageView, Enums.KeyState.Settings], function () {
-		if (RL.data().useKeyboardShortcuts() && !RL.popupVisibility() && !Globals.dropdownVisibility() && self.viewModelVisibility())
+		if (self.viewModelVisibility())
 		{
 			self.accountMenuDropdownTrigger(true);
 		}

dev/ViewModels/MailBoxFolderListViewModel.js

@@ -7,11 +7,14 @@
 function MailBoxFolderListViewModel()
 {
 	KnoinAbstractViewModel.call(this, 'Left', 'MailFolderList');
+
+	var oData = RL.data();
 	
-	this.folderList = RL.data().folderList;
+	this.messageList = oData.messageList;
-	this.folderListSystem = RL.data().folderListSystem;
+	this.folderList = oData.folderList;
-	this.foldersChanging = RL.data().foldersChanging;
+	this.folderListSystem = oData.folderListSystem;
-	
+	this.foldersChanging = oData.foldersChanging;
+
 	this.iDropOverTimer = 0;
 
 	this.allowContacts = !!RL.settingsGet('ContactsIsAllowed');
@@ -23,16 +26,12 @@ Utils.extendAsViewModel('MailBoxFolderListViewModel', MailBoxFolderListViewModel
 
 MailBoxFolderListViewModel.prototype.onBuild = function (oDom)
 {
+	var self = this;
+
 	oDom
-		.on('click', '.b-folders .b-content', function () {
-			if (RL.data().useKeyboardShortcuts() && RL.data().message.focused())
-			{
-				RL.data().message.focused(false);
-			}
-		})
 		.on('click', '.b-folders .e-item .e-link .e-collapsed-sign', function (oEvent) {
 
-					var
+			var
 				oFolder = ko.dataFor(this),
 				bCollapsed = false
 			;
@@ -72,6 +71,61 @@ MailBoxFolderListViewModel.prototype.onBuild = function (oDom)
 			}
 		})
 	;
+
+	key('up, down', Enums.KeyState.FolderList, function (event, handler) {
+
+		var
+			iIndex = -1,
+			iKeyCode = handler && 'up' === handler.shortcut ? 38 : 40,
+			$items = $('.b-folders .e-item .e-link:not(.hidden):visible', oDom)
+		;
+
+		if (event && $items.length)
+		{
+			iIndex = $items.index($items.filter('.focused'));
+			if (-1 < iIndex)
+			{
+				$items.eq(iIndex).removeClass('focused');
+			}
+
+			if (iKeyCode === 38 && iIndex > 0)
+			{
+				iIndex--;
+			}
+			else if (iKeyCode === 40 && iIndex < $items.length - 1)
+			{
+				iIndex++;
+			}
+
+			$items.eq(iIndex).addClass('focused');
+		}
+		
+		return false;
+	});
+
+	key('enter', Enums.KeyState.FolderList, function () {
+		var $items = $('.b-folders .e-item .e-link:not(.hidden).focused', oDom);
+		if ($items.length && $items[0])
+		{
+			self.folderList.focused(false);
+			$items.click();
+		}
+
+		return false;
+	});
+
+	key('esc, tab, shift+tab', Enums.KeyState.FolderList, function () {
+		self.folderList.focused(false);
+		return false;
+	});
+
+	self.folderList.focused.subscribe(function (bValue) {
+		$('.b-folders .e-item .e-link.focused', oDom).removeClass('focused');
+		if (bValue)
+		{
+			$('.b-folders .e-item .e-link.selected', oDom).addClass('focused');
+		}
+	});
 };
 
 MailBoxFolderListViewModel.prototype.messagesDropOver = function (oFolder)

dev/ViewModels/MailBoxMessageListViewModel.js

@@ -18,6 +18,7 @@ function MailBoxMessageListViewModel()
 
 	this.message = oData.message;
 	this.messageList = oData.messageList;
+	this.folderList = oData.folderList;
 	this.currentMessage = oData.currentMessage;
 	this.isMessageSelected = oData.isMessageSelected;
 	this.messageListSearch = oData.messageListSearch;
@@ -207,7 +208,6 @@ function MailBoxMessageListViewModel()
 		return oMessage ? oMessage.generateUid() : '';
 	});
 
-//	this.selector.autoSelect(false);
 	oData.layout.subscribe(function (mValue) {
 		this.selector.autoSelect(Enums.Layout.NoPreview !== mValue);
 	}, this);
@@ -618,7 +618,7 @@ MailBoxMessageListViewModel.prototype.onBuild = function (oDom)
 
 	oDom
 		.on('click', '.messageList .b-message-list-wrapper', function () {
-			if (oData.useKeyboardShortcuts() && self.message.focused())
+			if (self.message.focused())
 			{
 				self.message.focused(false);
 			}
@@ -657,30 +657,28 @@ MailBoxMessageListViewModel.prototype.onBuild = function (oDom)
 
 MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 {
-	var
+	var self = this;
-		self = this,
-		oData = RL.data()
-	;
 
 	// disable print
 	key('ctrl+p, command+p', Enums.KeyState.MessageList, function () {
-		if (oData.useKeyboardShortcuts())
+		return false;
-		{
-			return false;
-		}
 	});
 
+	// TODO // more toggle
+//	key('', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+//		self.moreDropdownTrigger(true);
+//		return false;
+//	});
+
+	// archive (zip)
 	key('z', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.archiveCommand();
-		{
+		return false;
-			self.moreDropdownTrigger(true);
-			return false;
-		}
 	});
-
+	
 	// delete
 	key('delete, shift+delete', Enums.KeyState.MessageList, function (event, handler) {
-		if (oData.useKeyboardShortcuts() && event)
+		if (event)
 		{
 			if (0 < RL.data().messageListCheckedOrSelected().length)
 			{
@@ -700,92 +698,60 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 
 	// check all
 	key('ctrl+a, command+a', Enums.KeyState.MessageList, function () {
-		if (oData.useKeyboardShortcuts())
+		self.checkAll(!(self.checkAll() && !self.isIncompleteChecked()));
-		{
+		return false;
-			self.checkAll(!(self.checkAll() && !self.isIncompleteChecked()));
-			return false;
-		}
 	});
 
 	// write/compose (open compose popup)
 	key('w,c', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		kn.showScreenPopup(PopupsComposeViewModel);
-		{
+		return false;
-			kn.showScreenPopup(PopupsComposeViewModel);
-			return false;
-		}
 	});
 
 	// important - star/flag messages
 	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.flagMessagesFast();
-		{
+		return false;
-			self.flagMessagesFast();
-			return false;
-		}
 	});
 
 	// move
 	key('m', Enums.KeyState.MessageList, function () {
-		if (oData.useKeyboardShortcuts())
+		self.moveDropdownTrigger(true);
-		{
+		return false;
-			self.moveDropdownTrigger(true);
-			return false;
-		}
 	});
 
 	// read
 	key('q', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.seenMessagesFast(true);
-		{
+		return false;
-			self.seenMessagesFast(true);
-			return false;
-		}
 	});
 
 	// unread
 	key('u', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.seenMessagesFast(false);
-		{
+		return false;
-			self.seenMessagesFast(false);
-			return false;
-		}
 	});
 
 	// shortcuts help
 	key('shift+/', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		kn.showScreenPopup(PopupsKeyboardShortcutsHelpViewModel);
-		{
+		return false;
-			kn.showScreenPopup(PopupsKeyboardShortcutsHelpViewModel);
-			return false;
-		}
 	});
 
 	key('shift+f', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.multyForwardCommand();
-		{
+		return false;
-			self.multyForwardCommand();
-			return false;
-		}
 	});
 
 	// search input focus
 	key('/', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts())
+		self.inputMessageListSearchFocus(true);
-		{
+		return false;
-			if (self.message())
-			{
-				self.message.focused(false);
-			}
-			
-			self.inputMessageListSearchFocus(true);
-			return false;
-		}
 	});
 
 	// cancel search
 	key('esc', Enums.KeyState.MessageList, function () {
-		if (oData.useKeyboardShortcuts() && '' !== self.messageListSearchDesc())
+		if ('' !== self.messageListSearchDesc())
 		{
 			self.cancelSearch();
 			return false;
@@ -793,32 +759,27 @@ MailBoxMessageListViewModel.prototype.initShortcuts = function ()
 	});
 
 	// change focused state
-	key('tab, shift+tab', Enums.KeyState.MessageList, function () {
+	key('tab, shift+tab', Enums.KeyState.MessageList, function (event, handler) {
-		if (oData.useKeyboardShortcuts())
+		if (event && handler && 'shift+tab' === handler.shortcut)
 		{
-			if (self.message())
+			self.folderList.focused(true);
-			{
-				self.message.focused(true);
-			}
-
-			return false;
 		}
+		else if (self.message())
+		{
+			self.message.focused(true);
+		}
+
+		return false;
 	});
 
+	// TODO
 	key('ctrl+left, command+left', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		return false;
-		{
-			// TODO
-			return false;
-		}
 	});
 
+	// TODO
 	key('ctrl+right, command+right', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		return false;
-		{
-			// TODO
-			return false;
-		}
 	});
 };
 

dev/ViewModels/MailBoxMessageViewViewModel.js

@@ -386,7 +386,7 @@ MailBoxMessageViewViewModel.prototype.onBuild = function (oDom)
  */
 MailBoxMessageViewViewModel.prototype.escShortcuts = function ()
 {
-	if (this.viewModelVisibility() && RL.data().useKeyboardShortcuts() && this.message())
+	if (this.viewModelVisibility() && this.message())
 	{
 		if (this.fullScreenMode())
 		{
@@ -417,24 +417,19 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// fullscreen
 	key('enter', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		self.toggleFullScreen();
-		{
+		return false;
-			self.toggleFullScreen();
-			return false;
-		}
 	});
 
-	key('x', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
+	// TODO // more toggle
-		if (oData.useKeyboardShortcuts())
+//	key('', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		{
+//		self.moreDropdownTrigger(true);
-			self.moreDropdownTrigger(true);
+//		return false;
-			return false;
+//	});
-		}
-	});
 
 	// reply
 	key('r', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts() && oData.message())
+		if (oData.message())
 		{
 			self.replyCommand();
 			return false;
@@ -443,7 +438,7 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// replaAll
 	key('a', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts() && oData.message())
+		if (oData.message())
 		{
 			self.replyAllCommand();
 			return false;
@@ -452,7 +447,7 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// forward
 	key('f', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts() && oData.message())
+		if (oData.message())
 		{
 			self.forwardCommand();
 			return false;
@@ -461,7 +456,7 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// message information
 //	key('i', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-//		if (oData.useKeyboardShortcuts())
+//		if (oData.message())
 //		{
 //			self.showFullInfo(!self.showFullInfo());
 //			return false;
@@ -470,7 +465,7 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// toggle message blockquotes
 	key('b', [Enums.KeyState.MessageList, Enums.KeyState.MessageView], function () {
-		if (oData.useKeyboardShortcuts() && oData.message() && oData.message().body)
+		if (oData.message() && oData.message().body)
 		{
 			Utils.toggleMessageBlockquote(oData.message().body);
 			return false;
@@ -478,37 +473,28 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 	});
 
 	key('ctrl+left, command+left, ctrl+up, command+up', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		self.goUpCommand();
-		{
+		return false;
-			self.goUpCommand();
-			return false;
-		}
 	});
 
 	key('ctrl+right, command+right, ctrl+down, command+down', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		self.goDownCommand();
-		{
+		return false;
-			self.goDownCommand();
-			return false;
-		}
 	});
 
 	// print
 	key('ctrl+p, command+p', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		if (self.message())
 		{
-			if (self.message())
+			self.message().printMessage();
-			{
-				self.message().printMessage();
-			}
-			
-			return false;
 		}
+		
+		return false;
 	});
 
 	// delete
 	key('delete, shift+delete', Enums.KeyState.MessageView, function (event, handler) {
-		if (oData.useKeyboardShortcuts() && event)
+		if (event)
 		{
 			if (handler && 'shift+delete' === handler.shortcut)
 			{
@@ -525,15 +511,12 @@ MailBoxMessageViewViewModel.prototype.initShortcuts = function ()
 
 	// change focused state
 	key('tab, shift+tab', Enums.KeyState.MessageView, function () {
-		if (oData.useKeyboardShortcuts())
+		if (!self.fullScreenMode() && self.message())
 		{
-			if (!self.fullScreenMode() && self.message())
+			self.message.focused(false);
-			{
-				self.message.focused(false);
-			}
-
-			return false;
 		}
+
+		return false;
 	});
 };
 

dev/ViewModels/PopupsAskViewModel.js

@@ -21,8 +21,6 @@ function PopupsAskViewModel()
 	this.bDisabeCloseOnEsc = true;
 	this.sDefaultKeyScope = Enums.KeyState.PopupAsk;
 
-	this.sKeyScope = Enums.KeyState.MessageList;
-
 	Knoin.constructorEnd(this);
 }
 
@@ -94,7 +92,7 @@ PopupsAskViewModel.prototype.onFocus = function ()
 
 PopupsAskViewModel.prototype.onBuild = function ()
 {
-	key('tab, right, left', Enums.KeyState.PopupAsk, _.bind(function () {
+	key('tab, shift+tab, right, left', Enums.KeyState.PopupAsk, _.bind(function () {
 		if (this.yesFocus())
 		{
 			this.noFocus(true);

dev/ViewModels/PopupsComposeViewModel.js

@@ -31,6 +31,8 @@ function PopupsComposeViewModel()
 
 	this.resizer = ko.observable(false).extend({'throttle': 50});
 
+	this.identitiesDropdownTrigger = ko.observable(false);
+
 	this.to = ko.observable('');
 	this.to.focusTrigger = ko.observable(false);
 	this.cc = ko.observable('');
@@ -915,43 +917,33 @@ PopupsComposeViewModel.prototype.tryToClosePopup = function ()
 	}]);
 };
 
-PopupsComposeViewModel.prototype.useShortcuts = function ()
-{
-	return RL.data().useKeyboardShortcuts();
-};
-
 PopupsComposeViewModel.prototype.onBuild = function ()
 {
 	this.initUploader();
 
 	var 
 		self = this,
-		oData = RL.data(),
 		oScript = null
 	;
 
+	key('ctrl+q, command+q', Enums.KeyState.Compose, function () {
+		self.identitiesDropdownTrigger(true);
+		return false;
+	});
+
 	key('ctrl+s, command+s', Enums.KeyState.Compose, function () {
-		if (oData.useKeyboardShortcuts())
+		self.saveCommand();
-		{
+		return false;
-			self.saveCommand();
-			return false;
-		}
 	});
 
 	key('ctrl+enter, command+enter', Enums.KeyState.Compose, function () {
-		if (oData.useKeyboardShortcuts())
+		self.sendCommand();
-		{
+		return false;
-			self.sendCommand();
-			return false;
-		}
 	});
 	
 	key('esc', Enums.KeyState.Compose, function () {
-		if (oData.useKeyboardShortcuts())
+		self.tryToClosePopup();
-		{
+		return false;
-			self.tryToClosePopup();
-			return false;
-		}
 	});
 
 	$window.on('resize', function () {

dev/ViewModels/PopupsContactsViewModel.js

@@ -582,11 +582,8 @@ PopupsContactsViewModel.prototype.onBuild = function (oDom)
 	var self = this;
 
 	key('delete', Enums.KeyState.ContactList, function () {
-		if (RL.data().useKeyboardShortcuts())
+		self.deleteCommand();
-		{
+		return false;
-			self.deleteCommand();
-			return false;
-		}
 	});
 
 	oDom

dev/ViewModels/PopupsKeyboardShortcutsHelpViewModel.js

@@ -8,7 +8,39 @@ function PopupsKeyboardShortcutsHelpViewModel()
 {
 	KnoinAbstractViewModel.call(this, 'Popups', 'PopupsKeyboardShortcutsHelp');
 
+	this.sDefaultKeyScope = Enums.KeyState.PopupKeyboardShortcutsHelp;
+
 	Knoin.constructorEnd(this);
 }
 
 Utils.extendAsViewModel('PopupsKeyboardShortcutsHelpViewModel', PopupsKeyboardShortcutsHelpViewModel);
+
+PopupsKeyboardShortcutsHelpViewModel.prototype.onBuild = function (oDom)
+{
+	key('tab, shift+tab', Enums.KeyState.PopupKeyboardShortcutsHelp, _.bind(function (event, handler) {
+		if (event && handler)
+		{
+			var
+				$tabs = oDom.find('.nav.nav-tabs > li'),
+				bNext = handler && 'tab' === handler.shortcut,
+				iIndex = $tabs.index($tabs.filter('.active'))
+			;
+
+			if (!bNext && iIndex > 0)
+			{
+				iIndex--;
+			}
+			else if (bNext && iIndex < $tabs.length - 1)
+			{
+				iIndex++;
+			}
+			else
+			{
+				iIndex = bNext ? 0 : $tabs.length - 1;
+			}
+
+			$tabs.eq(iIndex).find('a[data-toggle="tab"]').tab('show');
+			return false;
+		}
+	}, this));
+};

dev/ViewModels/SettingsPaneViewModel.js

@@ -17,10 +17,7 @@ SettingsPaneViewModel.prototype.onBuild = function ()
 {
 	var self = this;
 	key('esc', Enums.KeyState.Settings, function () {
-		if (RL.data().useKeyboardShortcuts())
+		self.backToMailBoxClick();
-		{
-			self.backToMailBoxClick();
-		}
 	});
 };
 

rainloop/v/0.0.0/app/templates/Themes/custom-values-dark.less

@@ -29,6 +29,9 @@
 @folders-selected-color: #fff;
 @folders-selected-background-color: #2b333d;
 @folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-color: #fff;
+@folders-focused-background-color: #2b333d;
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
 @folders-hover-color: #fff;
 @folders-hover-background-color: #2b333d;
 @folders-hover-rgba-background-color: rgba(0,0,0,0.5);

rainloop/v/0.0.0/app/templates/Themes/custom-values-light.less

@@ -28,6 +28,9 @@
 @folders-selected-color: #eee;
 @folders-selected-background-color: #757575;
 @folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-color: #eee;
+@folders-focused-background-color: #757575;
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
 @folders-hover-color: #eee;
 @folders-hover-background-color: #757575;
 @folders-hover-rgba-background-color: rgba(0,0,0,0.5);

rainloop/v/0.0.0/app/templates/Themes/template.less

@@ -130,6 +130,11 @@
 		.thm-rgba-background-color(@folders-selected-background-color, @folders-selected-rgba-background-color);
 	}
 
+	&.selectable.focused {
+		color: @folders-focused-color !important;
+		.thm-rgba-background-color(@folders-focused-background-color, @folders-focused-rgba-background-color);
+	}
+
 	&.selectable.droppableHover {
 		color: @folders-drop-color !important;
 		.thm-rgba-background-color(@folders-drop-background-color, @folders-drop-rgba-background-color);

rainloop/v/0.0.0/app/templates/Themes/values.less

@@ -33,6 +33,9 @@
 @folders-selected-color: #eee;
 @folders-selected-background-color: #333;
 @folders-selected-rgba-background-color: false;
+@folders-focused-color: #eee;
+@folders-focused-background-color: #333;
+@folders-focused-rgba-background-color: false;
 @folders-hover-color: #eee;
 @folders-hover-background-color: #333;
 @folders-hover-rgba-background-color: false;

rainloop/v/0.0.0/app/templates/Views/MailFolderList.html

@@ -1,4 +1,4 @@
-<div class="b-folders g-ui-user-select-none thm-folders">
+<div class="b-folders g-ui-user-select-none thm-folders" data-bind="css: {'focused': folderList.focused}">
 	<div class="b-toolbar btn-toolbar">
 		<a class="btn buttonCompose" data-tooltip-placement="bottom" data-bind="click: composeClick, tooltip: 'FOLDER_LIST/BUTTON_COMPOSE'">
 			<i class="icon-paper-plane"></i>

rainloop/v/0.0.0/app/templates/Views/MailMessageList.html

@@ -9,7 +9,7 @@
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moveDropdownTrigger">
+				<div class="btn-group dropdown" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: moveDropdownTrigger">
 					<a id="move-dropdown-id" href="#" tabindex="-1" class="btn dropdown-toggle buttonMove" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="command: moveCommand, tooltip: 'MESSAGE_LIST/BUTTON_MOVE_TO'">
 						<i class="icon-folder"></i>
 						&nbsp;&nbsp;
@@ -35,11 +35,11 @@
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moreDropdownTrigger">
+				<div class="btn-group dropdown" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: moreDropdownTrigger">
-					<a class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="tooltip: 'MESSAGE_LIST/BUTTON_MORE'">
+					<a id="more-list-dropdown-id" class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="tooltip: 'MESSAGE_LIST/BUTTON_MORE'">
 						<i class="icon-list"></i>
 					</a>
-					<ul class="dropdown-menu g-ui-menu" role="menu">
+					<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="more-list-dropdown-id">
 						<li class="e-item" role="presentation" data-bind="click: listUnsetSeen, css: {'disabled': !hasCheckedOrSelectedLines()}">
 							<a class="e-link menuitem" href="#" tabindex="-1">
 								<i class="icon-none"></i>

rainloop/v/0.0.0/app/templates/Views/MailMessageView.html

@@ -37,11 +37,11 @@
 					</a>
 				</div>
 				<div class="btn-group">&nbsp;</div>
-				<div class="btn-group dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: moreDropdownTrigger"">
+				<div class="btn-group dropdown" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: moreDropdownTrigger">
-					<a class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="command: messageVisibilityCommand, tooltip: 'MESSAGE/BUTTON_MORE'">
+					<a id="more-view-dropdown-id" class="btn dropdown-toggle buttonMore" href="#" tabindex="-1" data-toggle="dropdown" data-tooltip-placement="bottom" data-bind="command: messageVisibilityCommand, tooltip: 'MESSAGE/BUTTON_MORE'">
 						<i class="icon-list"></i>
 					</a>
-					<ul class="dropdown-menu g-ui-menu" role="menu">
+					<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="more-view-dropdown-id">
 						<li class="e-item" role="presentation" data-bind="visible: !isDraftFolder()">
 							<a class="e-link menuitem" href="#" tabindex="-1" data-bind="command: forwardAsAttachmentCommand">
 								<i class="icon-reply"></i>

rainloop/v/0.0.0/app/templates/Views/PopupsCompose.html

@@ -28,16 +28,16 @@
 								</label>
 							</div>
 							<div class="e-cell e-value">
-								<div class="dropdown pull-left">
+								<div class="dropdown pull-left" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: identitiesDropdownTrigger">
-									<span class="dropdown-toggle g-ui-dropdown e-identity" 
+									<a class="dropdown-toggle g-ui-dropdown e-identity" href="#" tabindex="-1"
-										id="IdentityLabel" role="button" data-toggle="dropdown"
+										id="identity-label-id" role="button" data-toggle="dropdown"
 										data-bind="text: currentIdentityString, dropdownCloser: true, css: {'multiply': 1 < identitiesOptions().length }">
-									</span>
+									</a>
 									<!-- ko if: 1 < identitiesOptions().length -->
-										<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="IdentityLabel">
+										<ul class="dropdown-menu g-ui-menu" role="menu" aria-labelledby="identity-label-id">
 											<!-- ko foreach: identitiesOptions -->
-												<li class="e-item">
+												<li class="e-item" role="presentation">
-													<a class="e-link" tabindex="-1" href="#" data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }">
+													<a class="e-link menuitem" tabindex="-1" href="#" data-bind="click: function (oIdentity) { $root.selectIdentity(oIdentity); return true; }">
 														<span data-bind="text: optText"></span>
 													</a>
 												</li>

rainloop/v/0.0.0/app/templates/Views/PopupsKeyboardShortcutsHelp.html

@@ -7,44 +7,36 @@
 			</h3>
 		</div>
 		<div class="modal-body">
-			<div class="row" style="margin-left: 0">
+			<ul class="nav nav-tabs">
-				<div class="span6">
+				<li class="active"><a href="#mailbox-shortcuts-id" data-toggle="tab">Mailbox</a></li>
-
+				<li><a href="#message-list-shortcuts-id" data-toggle="tab">Message list (focused)</a></li>
-<table class="table table-condensed table-striped">
+				<li><a href="#message-view-shortcuts-id" data-toggle="tab">Message view (focused)</a></li>
-<thead><tr><th>Mailbox</th></tr></thead>
+				<li><a href="#compose-shortcuts-id" data-toggle="tab">Compose</a></li>
+			</ul>
+			<br  />
+			<div class="tab-content span8">
+				<div class="tab-pane active" id="mailbox-shortcuts-id">
+<table class="table table-striped table-bordered">
 <tbody>
-	<tr><td>Open user dropdown</td><td>`</td></tr>
+	<tr><td>Open user dropdown</td><td>` (tilde)</td></tr>
-	<tr><td>Compose popup</td><td>W, C</td></tr>
-	<tr><td>Open message list more dropdown</td><td>Z</td></tr>
-	<tr><td>Open message view  more dropdown</td><td>X</td></tr>
-	<tr><td>Help</td><td>?, Shift + /</td></tr>
-</tbody>
-</table>
-
-<table class="table table-condensed table-striped">
-<thead><tr><th>Message view (focused)</th></tr></thead>
-<tbody>
-	<tr><td>Toggle fullscreen mode</td><td>Enter</td></tr>
-	<tr><td>Toggle message blockquotes</td><td>B</td></tr>
-	<tr><td>Print</td><td>Ctrl + P, Command + P</td></tr>
-	<tr><td>Exit fullscreen mode</td><td>Esc</td></tr>
-	<tr><td>Close message (No preview pane layout)</td><td>Esc</td></tr>
-	<tr><td>Switch focus back to message list</td><td>Tab, Shift + Tab</td></tr>
-</tbody>
-</table>
-
-				</div>
-				<div class="span6">
-
-<table class="table table-condensed table-striped">
-<thead><tr><th>Message list</th></tr></thead>
-<tbody>
-	<tr><td>Check All</td><td>Ctrl + A, Command + A</td></tr>
-	<tr><td>Delete selected messages</td><td>Delete, Shift + delete</td></tr>
 	<tr><td>Reply selected message</td><td>R</td></tr>
 	<tr><td>Reply All selected message</td><td>A</td></tr>
 	<tr><td>Froward selected message</td><td>F</td></tr>
 	<tr><td>Froward (multiply) selected messages</td><td>Shift + F</td></tr>
+	<tr><td>Open message list more dropdown</td><td></td></tr>
+	<tr><td>Open message view  more dropdown</td><td></td></tr>
+	<tr><td>Help</td><td>?, Shift + /</td></tr>
+</tbody>
+</table>
+
+				</div>
+				<div class="tab-pane" id="message-list-shortcuts-id">
+
+<table class="table table-striped table-bordered">
+<tbody>
+	<tr><td>Check All messages</td><td>Ctrl + A, Command + A</td></tr>
+	<tr><td>Archive selected messages</td><td>Z</td></tr>
+	<tr><td>Delete selected messages</td><td>Delete, Shift + delete</td></tr>
 	<tr><td>Move selected messages</td><td>M</td></tr>
 	<tr><td>Read selected messages</td><td>R</td></tr>
 	<tr><td>UnRead selected messages</td><td>U</td></tr>
@@ -57,8 +49,34 @@
 </table>
 
 				</div>
-			</div>
+				<div class="tab-pane" id="message-view-shortcuts-id">
 
+<table class="table table-striped table-bordered">
+<tbody>
+	<tr><td>Toggle fullscreen mode</td><td>Enter</td></tr>
+	<tr><td>Toggle message blockquotes</td><td>B</td></tr>
+	<tr><td>Print</td><td>Ctrl + P, Command + P</td></tr>
+	<tr><td>Exit fullscreen mode</td><td>Esc</td></tr>
+	<tr><td>Close message (No preview pane layout)</td><td>Esc</td></tr>
+	<tr><td>Switch focus back to message list</td><td>Tab, Shift + Tab</td></tr>
+</tbody>
+</table>
+
+				</div>
+				<div class="tab-pane" id="compose-shortcuts-id">
+
+<table class="table table-striped table-bordered">
+<tbody>
+	<tr><td>Open popup</td><td>W, C</td></tr>
+	<tr><td>Open identities dropdown</td><td>Ctrl + Q, Command + Q</td></tr>
+	<tr><td>Save message</td><td>Ctrl + S, Command + S</td></tr>
+	<tr><td>Send message</td><td>Ctrl + Enter, Command + Enter</td></tr>
+	<tr><td>Close compose</td><td>Esc</td></tr>
+</tbody>
+</table>
+
+				</div>
+			</div>
 		</div>
 	</div>
 </div>

rainloop/v/0.0.0/app/templates/Views/SystemDropDown.html

@@ -9,7 +9,7 @@
 			<div class="btn-group pull-right">
 				&nbsp;&nbsp;&nbsp;
 			</div>-->
-			<div class="btn-group pull-right dropdown" data-bind="dropdownOpenStatus: true, openDropdownTrigger: accountMenuDropdownTrigger">
+			<div class="btn-group pull-right dropdown" data-bind="registrateBootstrapDropdown: true, openDropdownTrigger: accountMenuDropdownTrigger">
 				<a id="top-system-dropdown-id" href="#" tabindex="-1" class="btn btn-ellipsis btn-block dropdown-toggle system-dropdown"
 					data-toggle="dropdown" data-tooltip-placement="left"
 					data-tooltip-class="tooltip-big" data-bind="tooltip2: emailTitle">

rainloop/v/0.0.0/static/css/app.css

@@ -4676,6 +4676,824 @@ input[type="submit"].btn.btn-mini {
 .alert-block p + p {
   margin-top: 5px;
 }
+.nav {
+  margin-left: 0;
+  margin-bottom: 20px;
+  list-style: none;
+}
+.nav > li > a {
+  display: block;
+}
+.nav > li > a:hover {
+  text-decoration: none;
+  background-color: #eeeeee;
+}
+.nav > .pull-right {
+  float: right;
+}
+.nav-header {
+  display: block;
+  padding: 3px 15px;
+  font-size: 11px;
+  font-weight: bold;
+  line-height: 20px;
+  color: #999999;
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+  text-transform: uppercase;
+}
+.nav li + .nav-header {
+  margin-top: 9px;
+}
+.nav-list {
+  padding-left: 15px;
+  padding-right: 15px;
+  margin-bottom: 0;
+}
+.nav-list > li > a,
+.nav-list .nav-header {
+  margin-left: -15px;
+  margin-right: -15px;
+  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
+}
+.nav-list > li > a {
+  padding: 3px 15px;
+}
+.nav-list > .active > a,
+.nav-list > .active > a:hover {
+  color: #ffffff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
+  background-color: #0088cc;
+}
+.nav-list [class^="icon-"] {
+  margin-right: 2px;
+}
+.nav-list .divider {
+  *width: 100%;
+  height: 1px;
+  margin: 9px 1px;
+  *margin: -5px 0 5px;
+  overflow: hidden;
+  background-color: #e5e5e5;
+  border-bottom: 1px solid #ffffff;
+}
+.nav-tabs,
+.nav-pills {
+  *zoom: 1;
+}
+.nav-tabs:before,
+.nav-pills:before,
+.nav-tabs:after,
+.nav-pills:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.nav-tabs:after,
+.nav-pills:after {
+  clear: both;
+}
+.nav-tabs > li,
+.nav-pills > li {
+  float: left;
+}
+.nav-tabs > li > a,
+.nav-pills > li > a {
+  padding-right: 12px;
+  padding-left: 12px;
+  margin-right: 2px;
+  line-height: 14px;
+}
+.nav-tabs {
+  border-bottom: 1px solid #ddd;
+}
+.nav-tabs > li {
+  margin-bottom: -1px;
+}
+.nav-tabs > li > a {
+  padding-top: 8px;
+  padding-bottom: 8px;
+  line-height: 20px;
+  border: 1px solid transparent;
+  -webkit-border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  border-radius: 4px 4px 0 0;
+}
+.nav-tabs > li > a:hover {
+  border-color: #eeeeee #eeeeee #dddddd;
+}
+.nav-tabs > .active > a,
+.nav-tabs > .active > a:hover {
+  color: #555555;
+  background-color: #ffffff;
+  border: 1px solid #ddd;
+  border-bottom-color: transparent;
+  cursor: default;
+}
+.nav-pills > li > a {
+  padding-top: 8px;
+  padding-bottom: 8px;
+  margin-top: 2px;
+  margin-bottom: 2px;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
+}
+.nav-pills > .active > a,
+.nav-pills > .active > a:hover {
+  color: #ffffff;
+  background-color: #0088cc;
+}
+.nav-stacked > li {
+  float: none;
+}
+.nav-stacked > li > a {
+  margin-right: 0;
+}
+.nav-tabs.nav-stacked {
+  border-bottom: 0;
+}
+.nav-tabs.nav-stacked > li > a {
+  border: 1px solid #ddd;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.nav-tabs.nav-stacked > li:first-child > a {
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  border-top-right-radius: 4px;
+  -webkit-border-top-left-radius: 4px;
+  -moz-border-radius-topleft: 4px;
+  border-top-left-radius: 4px;
+}
+.nav-tabs.nav-stacked > li:last-child > a {
+  -webkit-border-bottom-right-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  border-bottom-right-radius: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomleft: 4px;
+  border-bottom-left-radius: 4px;
+}
+.nav-tabs.nav-stacked > li > a:hover {
+  border-color: #ddd;
+  z-index: 2;
+}
+.nav-pills.nav-stacked > li > a {
+  margin-bottom: 3px;
+}
+.nav-pills.nav-stacked > li:last-child > a {
+  margin-bottom: 1px;
+}
+.nav-tabs .dropdown-menu {
+  -webkit-border-radius: 0 0 6px 6px;
+  -moz-border-radius: 0 0 6px 6px;
+  border-radius: 0 0 6px 6px;
+}
+.nav-pills .dropdown-menu {
+  -webkit-border-radius: 6px;
+  -moz-border-radius: 6px;
+  border-radius: 6px;
+}
+.nav .dropdown-toggle .caret {
+  border-top-color: #0088cc;
+  border-bottom-color: #0088cc;
+  margin-top: 6px;
+}
+.nav .dropdown-toggle:hover .caret {
+  border-top-color: #005580;
+  border-bottom-color: #005580;
+}
+/* move down carets for tabs */
+.nav-tabs .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+.nav .active .dropdown-toggle .caret {
+  border-top-color: #fff;
+  border-bottom-color: #fff;
+}
+.nav-tabs .active .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+.nav > .dropdown.active > a:hover {
+  cursor: pointer;
+}
+.nav-tabs .open .dropdown-toggle,
+.nav-pills .open .dropdown-toggle,
+.nav > li.dropdown.open.active > a:hover {
+  color: #ffffff;
+  background-color: #999999;
+  border-color: #999999;
+}
+.nav li.dropdown.open .caret,
+.nav li.dropdown.open.active .caret,
+.nav li.dropdown.open a:hover .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+.tabs-stacked .open > a:hover {
+  border-color: #999999;
+}
+.tabbable {
+  *zoom: 1;
+}
+.tabbable:before,
+.tabbable:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.tabbable:after {
+  clear: both;
+}
+.tab-content {
+  overflow: auto;
+}
+.tabs-below > .nav-tabs,
+.tabs-right > .nav-tabs,
+.tabs-left > .nav-tabs {
+  border-bottom: 0;
+}
+.tab-content > .tab-pane,
+.pill-content > .pill-pane {
+  display: none;
+}
+.tab-content > .active,
+.pill-content > .active {
+  display: block;
+}
+.tabs-below > .nav-tabs {
+  border-top: 1px solid #ddd;
+}
+.tabs-below > .nav-tabs > li {
+  margin-top: -1px;
+  margin-bottom: 0;
+}
+.tabs-below > .nav-tabs > li > a {
+  -webkit-border-radius: 0 0 4px 4px;
+  -moz-border-radius: 0 0 4px 4px;
+  border-radius: 0 0 4px 4px;
+}
+.tabs-below > .nav-tabs > li > a:hover {
+  border-bottom-color: transparent;
+  border-top-color: #ddd;
+}
+.tabs-below > .nav-tabs > .active > a,
+.tabs-below > .nav-tabs > .active > a:hover {
+  border-color: transparent #ddd #ddd #ddd;
+}
+.tabs-left > .nav-tabs > li,
+.tabs-right > .nav-tabs > li {
+  float: none;
+}
+.tabs-left > .nav-tabs > li > a,
+.tabs-right > .nav-tabs > li > a {
+  min-width: 74px;
+  margin-right: 0;
+  margin-bottom: 3px;
+}
+.tabs-left > .nav-tabs {
+  float: left;
+  margin-right: 19px;
+  border-right: 1px solid #ddd;
+}
+.tabs-left > .nav-tabs > li > a {
+  margin-right: -1px;
+  -webkit-border-radius: 4px 0 0 4px;
+  -moz-border-radius: 4px 0 0 4px;
+  border-radius: 4px 0 0 4px;
+}
+.tabs-left > .nav-tabs > li > a:hover {
+  border-color: #eeeeee #dddddd #eeeeee #eeeeee;
+}
+.tabs-left > .nav-tabs .active > a,
+.tabs-left > .nav-tabs .active > a:hover {
+  border-color: #ddd transparent #ddd #ddd;
+  *border-right-color: #ffffff;
+}
+.tabs-right > .nav-tabs {
+  float: right;
+  margin-left: 19px;
+  border-left: 1px solid #ddd;
+}
+.tabs-right > .nav-tabs > li > a {
+  margin-left: -1px;
+  -webkit-border-radius: 0 4px 4px 0;
+  -moz-border-radius: 0 4px 4px 0;
+  border-radius: 0 4px 4px 0;
+}
+.tabs-right > .nav-tabs > li > a:hover {
+  border-color: #eeeeee #eeeeee #eeeeee #dddddd;
+}
+.tabs-right > .nav-tabs .active > a,
+.tabs-right > .nav-tabs .active > a:hover {
+  border-color: #ddd #ddd #ddd transparent;
+  *border-left-color: #ffffff;
+}
+.nav > .disabled > a {
+  color: #999999;
+}
+.nav > .disabled > a:hover {
+  text-decoration: none;
+  background-color: transparent;
+  cursor: default;
+}
+.navbar {
+  overflow: visible;
+  margin-bottom: 20px;
+  color: #555555;
+  *position: relative;
+  *z-index: 2;
+}
+.navbar-inner {
+  min-height: 40px;
+  padding-left: 20px;
+  padding-right: 20px;
+  background-color: #fafafa;
+  background-image: -moz-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#f2f2f2));
+  background-image: -webkit-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: -o-linear-gradient(top, #ffffff, #f2f2f2);
+  background-image: linear-gradient(to bottom, #ffffff, #f2f2f2);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
+  border: 1px solid #d4d4d4;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
+}
+.navbar .container {
+  width: auto;
+}
+.nav-collapse.collapse {
+  height: auto;
+}
+.navbar .brand {
+  float: left;
+  display: block;
+  padding: 10px 20px 10px;
+  margin-left: -20px;
+  font-size: 20px;
+  font-weight: 200;
+  color: #555555;
+  text-shadow: 0 1px 0 #ffffff;
+}
+.navbar .brand:hover {
+  text-decoration: none;
+}
+.navbar-text {
+  margin-bottom: 0;
+  line-height: 40px;
+}
+.navbar-link {
+  color: #555555;
+}
+.navbar-link:hover {
+  color: #333333;
+}
+.navbar .divider-vertical {
+  height: 40px;
+  margin: 0 9px;
+  border-left: 1px solid #f2f2f2;
+  border-right: 1px solid #ffffff;
+}
+.navbar .btn,
+.navbar .btn-group {
+  margin-top: 6px;
+}
+.navbar .btn-group .btn {
+  margin: 0;
+}
+.navbar-form {
+  margin-bottom: 0;
+  *zoom: 1;
+}
+.navbar-form:before,
+.navbar-form:after {
+  display: table;
+  content: "";
+  line-height: 0;
+}
+.navbar-form:after {
+  clear: both;
+}
+.navbar-form input,
+.navbar-form select,
+.navbar-form .radio,
+.navbar-form .checkbox {
+  margin-top: 5px;
+}
+.navbar-form input,
+.navbar-form select,
+.navbar-form .btn {
+  display: inline-block;
+  margin-bottom: 0;
+}
+.navbar-form input[type="image"],
+.navbar-form input[type="checkbox"],
+.navbar-form input[type="radio"] {
+  margin-top: 3px;
+}
+.navbar-form .input-append,
+.navbar-form .input-prepend {
+  margin-top: 6px;
+  white-space: nowrap;
+}
+.navbar-form .input-append input,
+.navbar-form .input-prepend input {
+  margin-top: 0;
+}
+.navbar-search {
+  position: relative;
+  float: left;
+  margin-top: 5px;
+  margin-bottom: 0;
+}
+.navbar-search .search-query {
+  margin-bottom: 0;
+  padding: 4px 14px;
+  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+  font-size: 13px;
+  font-weight: normal;
+  line-height: 1;
+  -webkit-border-radius: 15px;
+  -moz-border-radius: 15px;
+  border-radius: 15px;
+}
+.navbar-static-top {
+  position: static;
+  width: 100%;
+  margin-bottom: 0;
+}
+.navbar-static-top .navbar-inner {
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+  position: fixed;
+  right: 0;
+  left: 0;
+  z-index: 1030;
+  margin-bottom: 0;
+}
+.navbar-fixed-top .navbar-inner,
+.navbar-fixed-bottom .navbar-inner,
+.navbar-static-top .navbar-inner {
+  border: 0;
+}
+.navbar-fixed-top .navbar-inner,
+.navbar-fixed-bottom .navbar-inner {
+  padding-left: 0;
+  padding-right: 0;
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  border-radius: 0;
+}
+.navbar-static-top .container,
+.navbar-fixed-top .container,
+.navbar-fixed-bottom .container {
+  width: 940px;
+}
+.navbar-fixed-top {
+  top: 0;
+}
+.navbar-fixed-top .navbar-inner,
+.navbar-static-top .navbar-inner {
+  -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1);
+  -moz-box-shadow: inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1);
+  box-shadow: inset 0 -1px 0 rgba(0,0,0,.1), 0 1px 10px rgba(0,0,0,.1);
+}
+.navbar-fixed-bottom {
+  bottom: 0;
+}
+.navbar-fixed-bottom .navbar-inner {
+  -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1);
+  -moz-box-shadow: inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1);
+  box-shadow: inset 0 1px 0 rgba(0,0,0,.1), 0 -1px 10px rgba(0,0,0,.1);
+}
+.navbar .nav {
+  position: relative;
+  left: 0;
+  display: block;
+  float: left;
+  margin: 0 10px 0 0;
+}
+.navbar .nav.pull-right {
+  float: right;
+}
+.navbar .nav > li {
+  float: left;
+}
+.navbar .nav > li > a {
+  float: none;
+  padding: 10px 15px 10px;
+  color: #555555;
+  text-decoration: none;
+  text-shadow: 0 1px 0 #ffffff;
+}
+.navbar .nav .dropdown-toggle .caret {
+  margin-top: 8px;
+}
+.navbar .nav > li > a:focus,
+.navbar .nav > li > a:hover {
+  background-color: transparent;
+  color: #333333;
+  text-decoration: none;
+}
+.navbar .nav > .active > a,
+.navbar .nav > .active > a:hover,
+.navbar .nav > .active > a:focus {
+  color: #555555;
+  text-decoration: none;
+  background-color: #e5e5e5;
+  -webkit-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+  -moz-box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+  box-shadow: inset 0 3px 8px rgba(0, 0, 0, 0.125);
+}
+.navbar .btn-navbar {
+  display: none;
+  float: right;
+  padding: 7px 10px;
+  margin-left: 5px;
+  margin-right: 5px;
+  color: #ffffff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+  background-color: #ededed;
+  background-image: -moz-linear-gradient(top, #f2f2f2, #e5e5e5);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f2f2f2), to(#e5e5e5));
+  background-image: -webkit-linear-gradient(top, #f2f2f2, #e5e5e5);
+  background-image: -o-linear-gradient(top, #f2f2f2, #e5e5e5);
+  background-image: linear-gradient(to bottom, #f2f2f2, #e5e5e5);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2f2f2', endColorstr='#ffe5e5e5', GradientType=0);
+  border-color: #e5e5e5 #e5e5e5 #bfbfbf;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  *background-color: #e5e5e5;
+  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
+  -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
+  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 0 rgba(255,255,255,.075);
+}
+.navbar .btn-navbar:hover,
+.navbar .btn-navbar:active,
+.navbar .btn-navbar.active,
+.navbar .btn-navbar.disabled,
+.navbar .btn-navbar[disabled] {
+  color: #ffffff;
+  background-color: #e5e5e5;
+  *background-color: #d9d9d9;
+}
+.navbar .btn-navbar:active,
+.navbar .btn-navbar.active {
+  background-color: #cccccc \9;
+}
+.navbar .btn-navbar .icon-bar {
+  display: block;
+  width: 18px;
+  height: 2px;
+  background-color: #f5f5f5;
+  -webkit-border-radius: 1px;
+  -moz-border-radius: 1px;
+  border-radius: 1px;
+  -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+  -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
+}
+.btn-navbar .icon-bar + .icon-bar {
+  margin-top: 3px;
+}
+.navbar .nav > li > .dropdown-menu:before {
+  content: '';
+  display: inline-block;
+  border-left: 7px solid transparent;
+  border-right: 7px solid transparent;
+  border-bottom: 7px solid #ccc;
+  border-bottom-color: rgba(0, 0, 0, 0.2);
+  position: absolute;
+  top: -7px;
+  left: 9px;
+}
+.navbar .nav > li > .dropdown-menu:after {
+  content: '';
+  display: inline-block;
+  border-left: 6px solid transparent;
+  border-right: 6px solid transparent;
+  border-bottom: 6px solid #ffffff;
+  position: absolute;
+  top: -6px;
+  left: 10px;
+}
+.navbar-fixed-bottom .nav > li > .dropdown-menu:before {
+  border-top: 7px solid #ccc;
+  border-top-color: rgba(0, 0, 0, 0.2);
+  border-bottom: 0;
+  bottom: -7px;
+  top: auto;
+}
+.navbar-fixed-bottom .nav > li > .dropdown-menu:after {
+  border-top: 6px solid #ffffff;
+  border-bottom: 0;
+  bottom: -6px;
+  top: auto;
+}
+.navbar .nav li.dropdown.open > .dropdown-toggle,
+.navbar .nav li.dropdown.active > .dropdown-toggle,
+.navbar .nav li.dropdown.open.active > .dropdown-toggle {
+  background-color: #e5e5e5;
+  color: #555555;
+}
+.navbar .nav li.dropdown > .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
+.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
+.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {
+  border-top-color: #555555;
+  border-bottom-color: #555555;
+}
+.navbar .pull-right > li > .dropdown-menu,
+.navbar .nav > li > .dropdown-menu.pull-right {
+  left: auto;
+  right: 0;
+}
+.navbar .pull-right > li > .dropdown-menu:before,
+.navbar .nav > li > .dropdown-menu.pull-right:before {
+  left: auto;
+  right: 12px;
+}
+.navbar .pull-right > li > .dropdown-menu:after,
+.navbar .nav > li > .dropdown-menu.pull-right:after {
+  left: auto;
+  right: 13px;
+}
+.navbar .pull-right > li > .dropdown-menu .dropdown-menu,
+.navbar .nav > li > .dropdown-menu.pull-right .dropdown-menu {
+  left: auto;
+  right: 100%;
+  margin-left: 0;
+  margin-right: -1px;
+  -webkit-border-radius: 6px 0 6px 6px;
+  -moz-border-radius: 6px 0 6px 6px;
+  border-radius: 6px 0 6px 6px;
+}
+.navbar-inverse {
+  color: #999999;
+}
+.navbar-inverse .navbar-inner {
+  background-color: #1b1b1b;
+  background-image: -moz-linear-gradient(top, #222222, #111111);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#222222), to(#111111));
+  background-image: -webkit-linear-gradient(top, #222222, #111111);
+  background-image: -o-linear-gradient(top, #222222, #111111);
+  background-image: linear-gradient(to bottom, #222222, #111111);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff111111', GradientType=0);
+  border-color: #252525;
+}
+.navbar-inverse .brand,
+.navbar-inverse .nav > li > a {
+  color: #999999;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+}
+.navbar-inverse .brand:hover,
+.navbar-inverse .nav > li > a:hover {
+  color: #ffffff;
+}
+.navbar-inverse .nav > li > a:focus,
+.navbar-inverse .nav > li > a:hover {
+  background-color: transparent;
+  color: #ffffff;
+}
+.navbar-inverse .nav .active > a,
+.navbar-inverse .nav .active > a:hover,
+.navbar-inverse .nav .active > a:focus {
+  color: #ffffff;
+  background-color: #111111;
+}
+.navbar-inverse .navbar-link {
+  color: #999999;
+}
+.navbar-inverse .navbar-link:hover {
+  color: #ffffff;
+}
+.navbar-inverse .divider-vertical {
+  border-left-color: #111111;
+  border-right-color: #222222;
+}
+.navbar-inverse .nav li.dropdown.open > .dropdown-toggle,
+.navbar-inverse .nav li.dropdown.active > .dropdown-toggle,
+.navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle {
+  background-color: #111111;
+  color: #ffffff;
+}
+.navbar-inverse .nav li.dropdown > .dropdown-toggle .caret {
+  border-top-color: #999999;
+  border-bottom-color: #999999;
+}
+.navbar-inverse .nav li.dropdown.open > .dropdown-toggle .caret,
+.navbar-inverse .nav li.dropdown.active > .dropdown-toggle .caret,
+.navbar-inverse .nav li.dropdown.open.active > .dropdown-toggle .caret {
+  border-top-color: #ffffff;
+  border-bottom-color: #ffffff;
+}
+.navbar-inverse .navbar-search .search-query {
+  color: #ffffff;
+  background-color: #515151;
+  border-color: #111111;
+  -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15);
+  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15);
+  box-shadow: inset 0 1px 2px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.15);
+  -webkit-transition: none;
+  -moz-transition: none;
+  -o-transition: none;
+  transition: none;
+}
+.navbar-inverse .navbar-search .search-query:-moz-placeholder {
+  color: #cccccc;
+}
+.navbar-inverse .navbar-search .search-query:-ms-input-placeholder {
+  color: #cccccc;
+}
+.navbar-inverse .navbar-search .search-query::-webkit-input-placeholder {
+  color: #cccccc;
+}
+.navbar-inverse .navbar-search .search-query:focus,
+.navbar-inverse .navbar-search .search-query.focused {
+  padding: 5px 15px;
+  color: #333333;
+  text-shadow: 0 1px 0 #ffffff;
+  background-color: #ffffff;
+  border: 0;
+  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
+  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
+  box-shadow: 0 0 3px rgba(0, 0, 0, 0.15);
+  outline: 0;
+}
+.navbar-inverse .btn-navbar {
+  color: #ffffff;
+  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
+  background-color: #0e0e0e;
+  background-image: -moz-linear-gradient(top, #151515, #040404);
+  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#151515), to(#040404));
+  background-image: -webkit-linear-gradient(top, #151515, #040404);
+  background-image: -o-linear-gradient(top, #151515, #040404);
+  background-image: linear-gradient(to bottom, #151515, #040404);
+  background-repeat: repeat-x;
+  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff151515', endColorstr='#ff040404', GradientType=0);
+  border-color: #040404 #040404 #000000;
+  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+  *background-color: #040404;
+  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
+
+  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
+}
+.navbar-inverse .btn-navbar:hover,
+.navbar-inverse .btn-navbar:active,
+.navbar-inverse .btn-navbar.active,
+.navbar-inverse .btn-navbar.disabled,
+.navbar-inverse .btn-navbar[disabled] {
+  color: #ffffff;
+  background-color: #040404;
+  *background-color: #000000;
+}
+.navbar-inverse .btn-navbar:active,
+.navbar-inverse .btn-navbar.active {
+  background-color: #000000 \9;
+}
+.breadcrumb {
+  padding: 8px 15px;
+  margin: 0 0 20px;
+  list-style: none;
+  background-color: #f5f5f5;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  border-radius: 4px;
+}
+.breadcrumb li {
+  display: inline-block;
+  *display: inline;
+  /* IE7 inline-block hack */
+
+  *zoom: 1;
+  text-shadow: 0 1px 0 #ffffff;
+}
+.breadcrumb .divider {
+  padding: 0 5px;
+  color: #ccc;
+}
+.breadcrumb .active {
+  color: #999999;
+}
 .modal-open .dropdown-menu {
   z-index: 2050;
 }
@@ -5499,6 +6317,7 @@ html.rgba.textshadow .btn.btn-primary {
 }
 .tooltip {
   font-size: 14px;
+  z-index: 2000 !important;
 }
 .tooltip.in {
   opacity: 1;
@@ -5585,6 +6404,9 @@ select {
 .alert.alert-error a {
   color: #b94a48;
 }
+.nav-tabs > li > a {
+  color: #555;
+}
 html.no-rgba .modal {
   border-width: 0px !important;
 }
@@ -6418,7 +7240,7 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
   font-size: 18px;
 }
 .popups .b-shortcuts-content.modal {
-  width: 1025px;
+  width: 700px;
 }
 .popups .b-shortcuts-content .modal-header {
   background-color: #fff;
@@ -6485,10 +7307,15 @@ html.rl-no-preview-pane #rl-right .ui-resizable-handle {
 }
 .b-folders .b-content .e-item .e-link.selectable:hover,
 .b-folders .b-content .e-item .e-link.selectable.selected,
+.b-folders .b-content .e-item .e-link.selectable.focused,
 .b-folders .b-content .e-item .e-link.selectable.droppableHover {
   background-color: #555;
   color: #fff;
 }
+.b-folders .b-content .e-item .e-link.selectable.focused {
+  background-color: #888;
+  color: #fff;
+}
 .b-folders .b-content .e-item .e-link.system {
   cursor: default;
   color: grey;
@@ -7872,8 +8699,14 @@ html.rl-message-fullscreen .messageView .b-content .buttonFull {
   color: #333;
 }
 .b-compose .b-header .e-identity {
+  color: #333;
+  text-decoration: none;
   font-weight: bold;
 }
+.b-compose .b-header .e-identity:hover {
+  color: #333;
+  text-decoration: none;
+}
 .b-compose .b-header .e-identity.multiply {
   cursor: pointer;
   border-bottom: 1px dashed #555;

rainloop/v/0.0.0/static/js/admin.js

@@ -48,6 +48,11 @@ var
 		'settings-disabled': []
 	},
 
+	/**
+	 * @type {Array}
+	 */
+	BootstrapDropdowns = [],
+
 	/**
 	 * @type {*}
 	 */
@@ -91,7 +96,7 @@ Globals.momentTrigger = ko.observable(true);
 /**
  * @type {?}
  */
-Globals.dropdownVisibility = ko.observable(false);
+Globals.dropdownVisibility = ko.observable(false).extend({'rateLimit': 0});
 
 /**
  * @type {?}
@@ -265,7 +270,7 @@ Consts.Defaults.SearchAjaxTimeout = 120000;
  * @const
  * @type {number}
  */
-Consts.Defaults.SendMessageAjaxTimeout = 200000;
+Consts.Defaults.SendMessageAjaxTimeout = 300000;
 
 /**
  * @const
@@ -380,11 +385,13 @@ Enums.KeyState = {
 	'None': 'none',
 	'ContactList': 'contact-list',
 	'MessageList': 'message-list',
+	'FolderList': 'folder-list',
 	'MessageView': 'message-view',
 	'Compose': 'compose',
 	'Settings': 'settings',
 	'Menu': 'menu',
 	'PopupComposeOpenPGP': 'compose-open-pgp',
+	'PopupKeyboardShortcutsHelp': 'popup-keyboard-shortcuts-help',
 	'PopupAsk': 'popup-ask'
 };
 
@@ -2459,7 +2466,7 @@ Utils.disableKeyFilter = function ()
 	if (window.key)
 	{
 		key.filter = function () {
-			return true;
+			return RL.data().useKeyboardShortcuts();
 		};
 	}
 };
@@ -2469,19 +2476,30 @@ Utils.restoreKeyFilter = function ()
 	if (window.key)
 	{
 		key.filter = function (event) {
-			var
-				element = event.target || event.srcElement,
-				tagName = element ? element.tagName : ''
-			;
 
-			tagName = tagName.toUpperCase();
+			if (RL.data().useKeyboardShortcuts())
-			return !(tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA' ||
+			{
-				(element && tagName === 'DIV' && 'editorHtmlArea' === element.className && element.contentEditable)
+				var
-			);
+					element = event.target || event.srcElement,
+					tagName = element ? element.tagName : ''
+				;
+
+				tagName = tagName.toUpperCase();
+				return !(tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA' ||
+					(element && tagName === 'DIV' && 'editorHtmlArea' === element.className && element.contentEditable)
+				);
+			}
+
+			return false;
 		};
 	}
 };
 
+Utils.detectDropdownVisibility = _.debounce(function () {
+	Globals.dropdownVisibility(!!_.find(BootstrapDropdowns, function (oItem) {
+		return oItem.hasClass('open');
+	}));
+}, 50);
 // Base64 encode / decode
 // http://www.webtoolkit.info/
  
@@ -2650,22 +2668,33 @@ ko.bindingHandlers.tooltip = {
 		if (!Globals.bMobileDevice)
 		{
 			var
-				sClass = $(oElement).data('tooltip-class') || '',
+				$oEl = $(oElement),
-				sPlacement = $(oElement).data('tooltip-placement') || 'top'
+				sClass = $oEl.data('tooltip-class') || '',
+				sPlacement = $oEl.data('tooltip-placement') || 'top'
 			;
 
-			$(oElement).tooltip({
+			$oEl.tooltip({
 				'delay': {
 					'show': 500,
 					'hide': 100
 				},
 				'html': true,
+				'container': 'body',
 				'placement': sPlacement,
 				'trigger': 'hover',
 				'title': function () {
-					return '<span class="tooltip-class ' + sClass + '">' +
+					return $oEl.is('.disabled') || Globals.dropdownVisibility() ? '' : '<span class="tooltip-class ' + sClass + '">' +
 						Utils.i18n(ko.utils.unwrapObservable(fValueAccessor())) + '</span>';
 				}
+			}).click(function () {
+				$oEl.tooltip('hide');
+			});
+
+			Globals.dropdownVisibility.subscribe(function (bValue) {
+				if (bValue)
+				{
+					$oEl.tooltip('hide');
+				}
 			});
 		}
 	}
@@ -2674,51 +2703,39 @@ ko.bindingHandlers.tooltip = {
 ko.bindingHandlers.tooltip2 = {
 	'init': function (oElement, fValueAccessor) {
 		var
-			sClass = $(oElement).data('tooltip-class') || '',
+			$oEl = $(oElement),
-			sPlacement = $(oElement).data('tooltip-placement') || 'top'
+			sClass = $oEl.data('tooltip-class') || '',
+			sPlacement = $oEl.data('tooltip-placement') || 'top'
 		;
-		$(oElement).tooltip({
+
+		$oEl.tooltip({
 			'delay': {
 				'show': 500,
 				'hide': 100
 			},
 			'html': true,
+			'container': 'body',
 			'placement': sPlacement,
 			'title': function () {
-				return '<span class="tooltip-class ' + sClass + '">' + fValueAccessor()() + '</span>';
+				return $oEl.is('.disabled') || Globals.dropdownVisibility() ? '' :
+					'<span class="tooltip-class ' + sClass + '">' + fValueAccessor()() + '</span>';
+			}
+		}).click(function () {
+			$oEl.tooltip('hide');
+		});
+
+		Globals.dropdownVisibility.subscribe(function (bValue) {
+			if (bValue)
+			{
+				$oEl.tooltip('hide');
 			}
 		});
 	}
 };
 
-ko.__detectDropdownVisibility = _.debounce(function ($el) {
+ko.bindingHandlers.registrateBootstrapDropdown = {
-	Globals.dropdownVisibility(!!$el.hasClass('open'));
-}, 50);
-
-ko.bindingHandlers.dropdownOpenStatus = {
 	'init': function (oElement) {
-		var $el = $(oElement);
+		BootstrapDropdowns.push($(oElement));
-
-		$el.find('.dropdown-toggle').click(function () {
-			ko.__detectDropdownVisibility($el);
-		});
-		
-//		$el.on('.dropdown-menu .menuitem', 'click', function () {
-//			$el.removeClass('open');
-//			ko.__detectDropdownVisibility($el);
-//		});
-
-//		$el.on('.dropdown-menu .menuitem', 'keydown', function (oEvent) {
-//			if (oEvent && Enums.EventKeyCode.Esc === oEvent.keyCode)
-//			{
-//				$el.removeClass('open');
-//				ko.__detectDropdownVisibility($el);
-//			}
-//		});
-		
-		$html.on('click.dropdown.data-api', function () {
-			ko.__detectDropdownVisibility($el);
-		});
 	}
 };
 
@@ -2730,7 +2747,7 @@ ko.bindingHandlers.openDropdownTrigger = {
 			if (!$el.hasClass('open'))
 			{
 				$el.find('.dropdown-toggle').dropdown('toggle');
-				ko.__detectDropdownVisibility($el);
+				Utils.detectDropdownVisibility();
 			}
 			
 			fValueAccessor()(false);
@@ -2829,13 +2846,16 @@ ko.bindingHandlers.clickOnTrue = {
 
 ko.bindingHandlers.modal = {
 	'init': function (oElement, fValueAccessor) {
-		$(oElement).toggleClass('fade', !Globals.bMobileDevice) .modal({
+		
+		$(oElement).toggleClass('fade', !Globals.bMobileDevice).modal({
 			'keyboard': false,
 			'show': ko.utils.unwrapObservable(fValueAccessor())
-		}).on('hidden', function () {
+		})
-			fValueAccessor()(false);
+		.on('shown', function () {
-		}).on('shown', function () {
 			Utils.windowResize();
+		})
+		.find('.close').click(function () {
+			fValueAccessor()(false);
 		});
 	},
 	'update': function (oElement, fValueAccessor) {
@@ -3959,11 +3979,8 @@ function KnoinAbstractViewModel(sPosition, sTemplate)
 
 	this.viewModelName = '';
 	this.viewModelVisibility = ko.observable(false);
-	if ('Popups' === this.sPosition)
+	this.modalVisibility = ko.observable(false).extend({'rateLimit': 0});
-	{
+	
-		this.modalVisibility = ko.observable(false);
-	}
-
 	this.viewModelDom = null;
 }
 
@@ -4208,6 +4225,32 @@ Knoin.prototype.buildViewModel = function (ViewModelClass, oScreen)
 				oViewModel.cancelCommand = oViewModel.closeCommand = Utils.createCommand(oViewModel, function () {
 					kn.hideScreenPopup(ViewModelClass);
 				});
+
+				oViewModel.modalVisibility.subscribe(function (bValue) {
+
+					var self = this;
+					if (bValue)
+					{
+						this.viewModelDom.show();
+						this.storeAndSetKeyScope();
+
+						RL.popupVisibilityNames.push(this.viewModelName);
+
+						Utils.delegateRun(this, 'onFocus', [], 500);
+					}
+					else
+					{
+						Utils.delegateRun(this, 'onHide');
+						this.restoreKeyScope();
+
+						RL.popupVisibilityNames.remove(this.viewModelName);
+
+						_.delay(function () {
+							self.viewModelDom.hide();
+						}, 300);
+					}
+					
+				}, oViewModel);
 			}
 		
 			Plugins.runHook('view-model-pre-build', [ViewModelClass.__name, oViewModel, oViewModelDom]);
@@ -4250,16 +4293,7 @@ Knoin.prototype.hideScreenPopup = function (ViewModelClassToHide)
 	if (ViewModelClassToHide && ViewModelClassToHide.__vm && ViewModelClassToHide.__dom)
 	{
 		ViewModelClassToHide.__vm.modalVisibility(false);
-		Utils.delegateRun(ViewModelClassToHide.__vm, 'onHide');
-		ViewModelClassToHide.__vm.restoreKeyScope();
-
-		RL.popupVisibilityNames.remove(ViewModelClassToHide.__name);
-
 		Plugins.runHook('view-model-on-hide', [ViewModelClassToHide.__name, ViewModelClassToHide.__vm]);
-		
-		_.delay(function () {
-			ViewModelClassToHide.__dom.hide();
-		}, 300);
 	}
 };
 
@@ -4275,17 +4309,9 @@ Knoin.prototype.showScreenPopup = function (ViewModelClassToShow, aParameters)
 
 		if (ViewModelClassToShow.__vm && ViewModelClassToShow.__dom)
 		{
-			ViewModelClassToShow.__dom.show();
 			ViewModelClassToShow.__vm.modalVisibility(true);
-
 			Utils.delegateRun(ViewModelClassToShow.__vm, 'onShow', aParameters || []);
-			ViewModelClassToShow.__vm.storeAndSetKeyScope();
-
-			RL.popupVisibilityNames.push(ViewModelClassToShow.__name);
-			
 			Plugins.runHook('view-model-on-show', [ViewModelClassToShow.__name, ViewModelClassToShow.__vm, aParameters || []]);
-
-			Utils.delegateRun(ViewModelClassToShow.__vm, 'onFocus', [], 500);
 		}
 	}
 };
@@ -5413,8 +5439,6 @@ function PopupsAskViewModel()
 	this.bDisabeCloseOnEsc = true;
 	this.sDefaultKeyScope = Enums.KeyState.PopupAsk;
 
-	this.sKeyScope = Enums.KeyState.MessageList;
-
 	Knoin.constructorEnd(this);
 }
 
@@ -5486,7 +5510,7 @@ PopupsAskViewModel.prototype.onFocus = function ()
 
 PopupsAskViewModel.prototype.onBuild = function ()
 {
-	key('tab, right, left', Enums.KeyState.PopupAsk, _.bind(function () {
+	key('tab, shift+tab, right, left', Enums.KeyState.PopupAsk, _.bind(function () {
 		if (this.yesFocus())
 		{
 			this.noFocus(true);
@@ -6623,6 +6647,8 @@ AdminLicensing.prototype.licenseExpiredMomentValue = function ()
  */
 function AbstractData()
 {
+	this.useKeyboardShortcuts = ko.observable(true);
+	
 	this.keyScopeReal = ko.observable(Enums.KeyState.All);
 	this.keyScopeFake = ko.observable(Enums.KeyState.All);
 	
@@ -6651,13 +6677,12 @@ function AbstractData()
 				}
 			}
 			
-//			window.console.log(sValue + '/' + this.keyScopeFake());
 			this.keyScopeReal(sValue);
 		}
 	});
 	
 	this.keyScopeReal.subscribe(function (sValue) {
-		window.console.log(sValue);
+//		window.console.log(sValue);
 		key.setScope(sValue);
 	});
 
@@ -8150,6 +8175,10 @@ $window.unload(function () {
 	Globals.bUnload = true;
 });
 
+$html.on('click.dropdown.data-api', function () {
+	Utils.detectDropdownVisibility();
+});
+
 // export
 window['rl'] = window['rl'] || {};
 window['rl']['addHook'] = Plugins.addHook;

rainloop/v/0.0.0/themes/A/styles.less

@@ -1,52 +1,55 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #48525C;
+@main-background-color: #48525C;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #fff;
+@loading-color: #fff;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #141213;
+@login-background-color: #141213;
-@login-rgba-background-color: rgba(0,0,0,0.8);
+@login-rgba-background-color: rgba(0,0,0,0.8);
-@login-box-shadow: none;
+@login-box-shadow: none;
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #48525C;
+@dropdown-menu-hover-background-color: #48525C;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #aaa;
+@folders-disabled-color: #aaa;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #2b333d;
+@folders-selected-background-color: #2b333d;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #2b333d;
+@folders-focused-background-color: #2b333d;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #2b333d;
+@folders-hover-background-color: #2b333d;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #2b333d;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #aaa;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #2b333d;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #aaa;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #2b333d;
+@settings-menu-selected-background-color: #2b333d;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #2b333d;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Blurred/styles.less

@@ -30,6 +30,9 @@
 @folders-selected-color: #fff;
 @folders-selected-background-color: #2b333d;
 @folders-selected-rgba-background-color: rgba(255,255,255,0.3);
+@folders-focused-color: #fff;
+@folders-focused-background-color: #2b333d;
+@folders-focused-rgba-background-color: rgba(255,255,255,0.3);
 @folders-hover-color: #fff;
 @folders-hover-background-color: #2b333d;
 @folders-hover-rgba-background-color: rgba(255,255,255,0.3);

rainloop/v/0.0.0/themes/Default/styles.less

@@ -1,52 +1,55 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #48525C;
+@main-background-color: #48525C;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #ddd;
+@loading-color: #ddd;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #2b333d;
+@login-background-color: #2b333d;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
+@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #48525C;
+@dropdown-menu-hover-background-color: #48525C;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #aaa;
+@folders-disabled-color: #aaa;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #2b333d;
+@folders-selected-background-color: #2b333d;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #2b333d;
+@folders-focused-background-color: #2b333d;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #2b333d;
+@folders-hover-background-color: #2b333d;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #2b333d;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #aaa;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #2b333d;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #aaa;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #2b333d;
+@settings-menu-selected-background-color: #2b333d;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #2b333d;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Linen/styles.less

@@ -1,51 +1,54 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #eee;
+@main-background-color: #eee;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #000;
+@loading-color: #000;
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #757575;
+@login-background-color: #757575;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: none;
+@login-box-shadow: none;
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #757575;
+@dropdown-menu-hover-background-color: #757575;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #333;
+@folders-color: #333;
-@folders-disabled-color: #999;
+@folders-disabled-color: #999;
-@folders-selected-color: #eee;
+@folders-selected-color: #eee;
-@folders-selected-background-color: #757575;
+@folders-selected-background-color: #757575;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #eee;
+@folders-focused-color: #eee;
-@folders-hover-background-color: #757575;
+@folders-focused-background-color: #757575;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #eee;
+@folders-hover-color: #eee;
-@folders-drop-background-color: #757575;
+@folders-hover-background-color: #757575;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #eee;
-// SETTINGS
+@folders-drop-background-color: #757575;
-@settings-menu-color: #333;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #999;
+
-@settings-menu-selected-color: #eee;
+// SETTINGS
-@settings-menu-selected-background-color: #757575;
+@settings-menu-color: #333;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #999;
-@settings-menu-hover-color: #eee;
+@settings-menu-selected-color: #eee;
-@settings-menu-hover-background-color: #757575;
+@settings-menu-selected-background-color: #757575;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #eee;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #757575;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Love/styles.less

@@ -1,52 +1,55 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #B3274E;
+@main-background-color: #B3274E;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #fff;
+@loading-color: #fff;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #490915;
+@login-background-color: #490915;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
+@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #490915;
+@dropdown-menu-hover-background-color: #490915;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #aaa;
+@folders-disabled-color: #aaa;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #490915;
+@folders-selected-background-color: #490915;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.3);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.3);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #490915;
+@folders-focused-background-color: #490915;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.3);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.3);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #490915;
+@folders-hover-background-color: #490915;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.3);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.3);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #490915;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.3);
-@settings-menu-disabled-color: #aaa;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #490915;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #aaa;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #490915;
+@settings-menu-selected-background-color: #490915;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #490915;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Snow/styles.less

@@ -1,52 +1,55 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #48525C;
+@main-background-color: #48525C;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #fff;
+@loading-color: #fff;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #2b333d;
+@login-background-color: #2b333d;
-@login-rgba-background-color: rgba(0,0,0,0.6);
+@login-rgba-background-color: rgba(0,0,0,0.6);
-@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
+@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #48525C;
+@dropdown-menu-hover-background-color: #48525C;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #aaa;
+@folders-disabled-color: #aaa;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #2b333d;
+@folders-selected-background-color: #2b333d;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #2b333d;
+@folders-focused-background-color: #2b333d;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #2b333d;
+@folders-hover-background-color: #2b333d;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #2b333d;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #aaa;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #2b333d;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #aaa;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #2b333d;
+@settings-menu-selected-background-color: #2b333d;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #2b333d;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

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

@@ -1,51 +1,54 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #eee;
+@main-background-color: #eee;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #000;
+@loading-color: #000;
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #757575;
+@login-background-color: #757575;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: none;
+@login-box-shadow: none;
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #757575;
+@dropdown-menu-hover-background-color: #757575;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #333;
+@folders-color: #333;
-@folders-disabled-color: #999;
+@folders-disabled-color: #999;
-@folders-selected-color: #eee;
+@folders-selected-color: #eee;
-@folders-selected-background-color: #757575;
+@folders-selected-background-color: #757575;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #eee;
+@folders-focused-color: #eee;
-@folders-hover-background-color: #757575;
+@folders-focused-background-color: #757575;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #eee;
+@folders-hover-color: #eee;
-@folders-drop-background-color: #757575;
+@folders-hover-background-color: #757575;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #eee;
-// SETTINGS
+@folders-drop-background-color: #757575;
-@settings-menu-color: #333;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #999;
+
-@settings-menu-selected-color: #eee;
+// SETTINGS
-@settings-menu-selected-background-color: #757575;
+@settings-menu-color: #333;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #999;
-@settings-menu-hover-color: #eee;
+@settings-menu-selected-color: #eee;
-@settings-menu-hover-background-color: #757575;
+@settings-menu-selected-background-color: #757575;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #eee;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #757575;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/SquaresDark/styles.less

@@ -1,52 +1,55 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #48525C;
+@main-background-color: #48525C;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #ddd;
+@loading-color: #ddd;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #2b333d;
+@login-background-color: #2b333d;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
+@login-box-shadow: 0px 2px 10px rgba(0,0,0,0.5);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #48525C;
+@dropdown-menu-hover-background-color: #48525C;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #aaa;
+@folders-disabled-color: #aaa;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #2b333d;
+@folders-selected-background-color: #2b333d;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #2b333d;
+@folders-focused-background-color: #2b333d;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #2b333d;
+@folders-hover-background-color: #2b333d;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #2b333d;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #aaa;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #2b333d;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #aaa;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #2b333d;
+@settings-menu-selected-background-color: #2b333d;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #2b333d;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Stripes/styles.less

@@ -1,51 +1,54 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #010101;
+@main-background-color: #010101;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #fff;
+@loading-color: #fff;
-@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
+@loading-text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
-
+
-// LOGIN
+// LOGIN
-@login-color: #333;
+@login-color: #333;
-@login-background-color: #eee;
+@login-background-color: #eee;
-@login-rgba-background-color: rgba(255,255,255,0.5);
+@login-rgba-background-color: rgba(255,255,255,0.5);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #010101;
+@dropdown-menu-hover-background-color: #010101;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #fff;
+@folders-color: #fff;
-@folders-disabled-color: #999;
+@folders-disabled-color: #999;
-@folders-selected-color: #fff;
+@folders-selected-color: #fff;
-@folders-selected-background-color: #7F7F7F;
+@folders-selected-background-color: #7F7F7F;
-@folders-selected-rgba-background-color: rgba(255,255,255,0.3);
+@folders-selected-rgba-background-color: rgba(255,255,255,0.3);
-@folders-hover-color: #fff;
+@folders-focused-color: #fff;
-@folders-hover-background-color: #7F7F7F;
+@folders-focused-background-color: #7F7F7F;
-@folders-hover-rgba-background-color: rgba(255,255,255,0.3);
+@folders-focused-rgba-background-color: rgba(255,255,255,0.5);
-@folders-drop-color: #fff;
+@folders-hover-color: #fff;
-@folders-drop-background-color: #7F7F7F;
+@folders-hover-background-color: #7F7F7F;
-@folders-drop-rgba-background-color: rgba(255,255,255,0.3);
+@folders-hover-rgba-background-color: rgba(255,255,255,0.3);
-
+@folders-drop-color: #fff;
-// SETTINGS
+@folders-drop-background-color: #7F7F7F;
-@settings-menu-color: #fff;
+@folders-drop-rgba-background-color: rgba(255,255,255,0.3);
-@settings-menu-disabled-color: #999;
+
-@settings-menu-selected-color: #fff;
+// SETTINGS
-@settings-menu-selected-background-color: #7F7F7F;
+@settings-menu-color: #fff;
-@settings-menu-selected-rgba-background-color: rgba(255,255,255,0.3);
+@settings-menu-disabled-color: #999;
-@settings-menu-hover-color: #fff;
+@settings-menu-selected-color: #fff;
-@settings-menu-hover-background-color: #7F7F7F;
+@settings-menu-selected-background-color: #7F7F7F;
-@settings-menu-hover-rgba-background-color: rgba(255,255,255,0.3);
+@settings-menu-selected-rgba-background-color: rgba(255,255,255,0.3);
-
+@settings-menu-hover-color: #fff;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #7F7F7F;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(255,255,255,0.3);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
 @message-list-toolbar-gradient-end: #dfdfdf;

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

@@ -1,51 +1,54 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #F4D59F;
+@main-background-color: #F4D59F;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #000;
+@loading-color: #000;
-@loading-text-shadow: none;
+@loading-text-shadow: none;
-
+
-// LOGIN
+// LOGIN
-@login-color: #333;
+@login-color: #333;
-@login-background-color: #eee;
+@login-background-color: #eee;
-@login-rgba-background-color: rgba(255,255,255,0.7);
+@login-rgba-background-color: rgba(255,255,255,0.7);
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #F4D59F;
+@dropdown-menu-hover-background-color: #F4D59F;
-@dropdown-menu-hover-color: #333;
+@dropdown-menu-hover-color: #333;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #333;
+@folders-color: #333;
-@folders-disabled-color: #999;
+@folders-disabled-color: #999;
-@folders-selected-color: #333;
+@folders-selected-color: #333;
-@folders-selected-background-color: #FAEBD2;
+@folders-selected-background-color: #FAEBD2;
-@folders-selected-rgba-background-color: rgba(255,255,255,0.5);
+@folders-selected-rgba-background-color: rgba(255,255,255,0.5);
-@folders-hover-color: #333;
+@folders-focused-color: #333;
-@folders-hover-background-color: #FAEBD2;
+@folders-focused-background-color: #FAEBD2;
-@folders-hover-rgba-background-color: rgba(255,255,255,0.5);
+@folders-focused-rgba-background-color: rgba(255,255,255,0.7);
-@folders-drop-color: #333;
+@folders-hover-color: #333;
-@folders-drop-background-color: #FAEBD2;
+@folders-hover-background-color: #FAEBD2;
-@folders-drop-rgba-background-color: rgba(255,255,255,0.5);
+@folders-hover-rgba-background-color: rgba(255,255,255,0.5);
-
+@folders-drop-color: #333;
-// SETTINGS
+@folders-drop-background-color: #FAEBD2;
-@settings-menu-color: #333;
+@folders-drop-rgba-background-color: rgba(255,255,255,0.5);
-@settings-menu-disabled-color: #999;
+
-@settings-menu-selected-color: #333;
+// SETTINGS
-@settings-menu-selected-background-color: #FAEBD2;
+@settings-menu-color: #333;
-@settings-menu-selected-rgba-background-color: rgba(255,255,255,0.5);
+@settings-menu-disabled-color: #999;
-@settings-menu-hover-color: #333;
+@settings-menu-selected-color: #333;
-@settings-menu-hover-background-color: #FAEBD2;
+@settings-menu-selected-background-color: #FAEBD2;
-@settings-menu-hover-rgba-background-color: rgba(255,255,255,0.5);
+@settings-menu-selected-rgba-background-color: rgba(255,255,255,0.5);
-
+@settings-menu-hover-color: #333;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #FAEBD2;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(255,255,255,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;

rainloop/v/0.0.0/themes/Xv/styles.less

@@ -1,51 +1,54 @@
-
+
-// MAIN
+// MAIN
-@main-color: #333;
+@main-color: #333;
-@main-background-color: #eee;
+@main-background-color: #eee;
-@main-background-image: "images/background.jpg";
+@main-background-image: "images/background.jpg";
-
+
-// LOADING
+// LOADING
-@loading-color: #000;
+@loading-color: #000;
-
+
-// LOGIN
+// LOGIN
-@login-color: #eee;
+@login-color: #eee;
-@login-background-color: #757575;
+@login-background-color: #757575;
-@login-rgba-background-color: rgba(0,0,0,0.5);
+@login-rgba-background-color: rgba(0,0,0,0.5);
-@login-box-shadow: none;
+@login-box-shadow: none;
-@login-border: none;
+@login-border: none;
-@login-border-radius: 7px;
+@login-border-radius: 7px;
-
+
-// MENU
+// MENU
-@dropdown-menu-color: #333;
+@dropdown-menu-color: #333;
-@dropdown-menu-background-color: #fff;
+@dropdown-menu-background-color: #fff;
-@dropdown-menu-hover-background-color: #757575;
+@dropdown-menu-hover-background-color: #757575;
-@dropdown-menu-hover-color: #eee;
+@dropdown-menu-hover-color: #eee;
-@dropdown-menu-disable-color: #999;
+@dropdown-menu-disable-color: #999;
-
+
-// FOLDERS
+// FOLDERS
-@folders-color: #333;
+@folders-color: #333;
-@folders-disabled-color: #999;
+@folders-disabled-color: #999;
-@folders-selected-color: #eee;
+@folders-selected-color: #eee;
-@folders-selected-background-color: #757575;
+@folders-selected-background-color: #757575;
-@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
+@folders-selected-rgba-background-color: rgba(0,0,0,0.5);
-@folders-hover-color: #eee;
+@folders-focused-color: #eee;
-@folders-hover-background-color: #757575;
+@folders-focused-background-color: #757575;
-@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
+@folders-focused-rgba-background-color: rgba(0,0,0,0.7);
-@folders-drop-color: #eee;
+@folders-hover-color: #eee;
-@folders-drop-background-color: #757575;
+@folders-hover-background-color: #757575;
-@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
+@folders-hover-rgba-background-color: rgba(0,0,0,0.5);
-
+@folders-drop-color: #eee;
-// SETTINGS
+@folders-drop-background-color: #757575;
-@settings-menu-color: #333;
+@folders-drop-rgba-background-color: rgba(0,0,0,0.5);
-@settings-menu-disabled-color: #999;
+
-@settings-menu-selected-color: #eee;
+// SETTINGS
-@settings-menu-selected-background-color: #757575;
+@settings-menu-color: #333;
-@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-disabled-color: #999;
-@settings-menu-hover-color: #eee;
+@settings-menu-selected-color: #eee;
-@settings-menu-hover-background-color: #757575;
+@settings-menu-selected-background-color: #757575;
-@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
+@settings-menu-selected-rgba-background-color: rgba(0,0,0,0.5);
-
+@settings-menu-hover-color: #eee;
-// MESSAGE LIST
+@settings-menu-hover-background-color: #757575;
-@message-list-toolbar-background-color: #eee;
+@settings-menu-hover-rgba-background-color: rgba(0,0,0,0.5);
-@message-list-toolbar-gradient-start: #f4f4f4;
+
-@message-list-toolbar-gradient-end: #dfdfdf;
+// MESSAGE LIST
+@message-list-toolbar-background-color: #eee;
+@message-list-toolbar-gradient-start: #f4f4f4;
+@message-list-toolbar-gradient-end: #dfdfdf;