UI polish

public/partialClient.html

@@ -32,7 +32,7 @@
               </section>
               <section class="middle tab-bar-section">
                 <h1 class="title ellipsis" id="name1Color"
-                    style="color: rgb(74, 144, 226);">
+                    style="color: '#E4E8EC';">
                   <span id="name1"></span>
                 </h1>
               </section>
@@ -50,7 +50,7 @@
                     </div>
                     <div class="pr columns line-b">
                       <div class="avatar-wallet left" id="subStrName"
-                           style="background-color: rgb(74, 144, 226);">S
+                           style="background-color: '#E4E8EC';">
                       </div>
                       <div class="wallet-info">
                         <p class="m0" id="name2"></p>
@@ -78,4 +78,4 @@
   <div>
     <img style="width: auto;height: 75px;" src="img/icons/obyte-logo-negative.svg">
   </div>
-</div>
+</div>

public/views/acceptCorrespondentInvitation.html

@@ -27,7 +27,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 
 
 
-    
+
   <div class="onGoingProcess" ng-show="onGoingProcess">
     <div class="onGoingProcess-content" ng-style="{'background-color':backgroundColor}">
       <div class="spinner">
@@ -45,23 +45,23 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
     <div class="columns m20t m20b" >
         <form name="pairingCodeForm" class="p10" no-validate>
 		  <span translate>Enter the pairing code received from the other device, or use your camera (icon at the upper right corner) to scan the QR code displayed on the other device.</span>
-          <div class="text-warning size-12 m10b" ng-show="error">{{error|translate}}</div>
-          <input type="text" placeholder="{{'Pairing code'|translate}}" id="code" name="code" ng-model="code" required>
+          <div class="text-warning size-13 m10b" ng-show="error">{{error|translate}}</div>
+          <input type="text" placeholder="{{'Pairing code'|translate}}" id="code" name="code" ng-model="code" required style="margin-top:20px;">
           <div class="row">
             <div>
-              <input type="submit" 
-                     class="button expand round" 
+              <input type="submit"
+                     class="button expand round"
                      value="{{'Pair'|translate}}"
                      ng-disabled="!pairingCodeForm.$valid"
-                     ng-style="{'background-color':backgroundColor}" 
+                     ng-style="{'background-color':backgroundColor}"
                      ng-click="pair()">
             </div>
           </div>
         </form>
     </div>
-      
+
 
 
     <div class="extra-margin-bottom"></div>
 </div>
-<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>
+<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>

public/views/addCorrespondentDevice.html

@@ -1,5 +1,5 @@
-<div 
-  class="topbar-container" 
+<div
+  class="topbar-container"
   ng-include="'views/includes/topbar.html'"
   ng-init="titleSection='Add a new device'; goBackToState = true; noColor = true; index.tab = 'chat'">
 </div>
@@ -10,15 +10,15 @@
 <ul class="no-bullet manage size-12">
 	<li>
 		<a ng-click="$root.go('correspondentDevices.addCorrespondentDevice.inviteCorrespondentDevice')">
-			<i class="fi-die-four circle plus-fixed"></i>	
-			<i class="icon-arrow-right3 size-18 right m20t"></i>  
-			<span translate style="max-width: 60%">Invite the other device</span>
+			<i class="fi-die-four circle plus-fixed"></i>
+			<i class="icon-arrow-right3 size-18 right m20t"></i>
+			<span translate style="max-width: 60%; margin-top: 15px;">Invite the other device</span>
 		</a>
 	</li>
 	<li>
 		<a ng-click="$root.go('correspondentDevices.addCorrespondentDevice.acceptCorrespondentInvitation')">
-			<i class="icon-scan circle"></i>	  
-			<i class="icon-arrow-right3 size-18 right m20t"></i>  
+			<i class="icon-scan circle"></i>
+			<i class="icon-arrow-right3 size-18 right m20t"></i>
 			<span translate style="max-width: 60%">Accept invitation from the other device</span>
 		</a>
 	</li>

public/views/backup.html

@@ -35,7 +35,7 @@ <h4></h4>
         Wallet seed not available.
     </div>
   </div>
- 
+
   <div ng-show="wordsC.mnemonicWords || (wordsC.credentialsEncrypted && !wordsC.deleted)">
     <div class="row">
         <div class="m10t columns">
@@ -65,7 +65,7 @@ <h4></h4>
     <div class="row" ng-show="wordsC.show">
         <div class="columns">
         <div class="p10" style="background:white;-webkit-user-select: text;" ng-class="{'enable_text_select': index.network == 'testnet'}">
-          <span ng-repeat="word in wordsC.mnemonicWords track by $index"><span style="white-space:nowrap">{{word}}</span><span ng-show="wordsC.useIdeograms">&#x3000;</span> </span>  
+          <span ng-repeat="word in wordsC.mnemonicWords track by $index"><span style="white-space:nowrap">{{word}}</span><span ng-show="wordsC.useIdeograms">&#x3000;</span> </span>
         </div>
         </div>
     </div>
@@ -83,13 +83,13 @@ <h4></h4>
 
     <div class="row" ng-show="wordsC.show">
         <div class="m10t text-center columns">
-          <div class="size-12 text-gray">
+          <div class="size-13 text-gray">
             <span translate>
               Once you have written your wallet seed down, it is recommended to delete it from this device.
             </span>
           </div>
           <button class="button outline m10t round dark-gray tiny" ng-click="wordsC.delete()">
-            <i class="fi-trash"></i> 
+            <i class="fi-trash"></i>
             <span translate>
               DELETE WORDS
             </span>

public/views/bot.html

@@ -28,18 +28,18 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 
 <div class="columns m20t" style="position: absolute; padding-bottom: 60px;">
 	<h1 style="font-weight: 200; margin-bottom: 25px">{{bot.name}}</h1>
-  	<div class="m30b" translate dynamic="bot.description" style="-webkit-user-select: text;"></div>
-  
+  	<div class="m30b" style="font-size:14px;" translate dynamic="bot.description" style="-webkit-user-select: text;"></div>
+
   <div class="row">
     <div>
       <input ng-if="bot.isPaired" type="button" class="button expand round" value="{{'Open chat'|translate}}" ng-style="{'background-color':backgroundColor}" ng-click="open(bot)" ng-disabled="!bot">
       <input ng-if="!bot.isPaired" type="button" class="button expand round" value="{{'Add Bot'|translate}}" ng-style="{'background-color':backgroundColor}" ng-click="pair(bot)" ng-disabled="!bot">
     </div>
   </div>
 </div>
-      
+
 
 
     <div class="extra-margin-bottom"></div>
 </div>
-<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>
+<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>

public/views/copayers.html

@@ -28,7 +28,7 @@ <h4 class="title oh m0">
     </h4>
     <div class="p10 line-b" ng-include="'views/includes/copayers.html'"></div>
     <div ng-if="!index.isComplete" class="p10 line-b m20b">
-      <p class="size-12 m0">
+      <p class="size-13 m0">
       <i class="fi-loop"></i>
       <span translate>Waiting...</span>
       </p>

public/views/correspondentDevice.html

@@ -17,10 +17,11 @@
 
     <section class="middle tab-bar-section" style="overflow: hidden;">
 	    <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backgroundColor}">
-	      {{correspondent.name}}
+        {{correspondent.name}}
+        <span class="color-indicator" ng-style="{'background-color': noColor ? '#red' : index.backgroundColor}"><span>
 	    </h1>
     </section>
-      
+
     <section class="right-small" ng-click="editCorrespondent()">
       <a href class="p10">
         <span class="text-close" translate>More</span>
@@ -117,7 +118,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
     	left: 50%;
     	margin-left: -75px;
     }
-    
+
 
 /*
 Chat bubble CSS credits http://codepen.io/samuelkraft/pen/Farhl
@@ -266,7 +267,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 }
 </style>
 
-    
+
   <div class="onGoingProcess" ng-show="onGoingProcess">
     <div class="onGoingProcess-content" ng-style="{'background-color':index.backgroundColor}">
       <div class="spinner">
@@ -281,7 +282,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
   </div>
 
     <!--div class="columns m20t m20b" -->
-      <!--div ng-click="editCorrespondent()" class="pointer"> 
+      <!--div ng-click="editCorrespondent()" class="pointer">
         {{correspondent.name}} ({{correspondent.device_address | limitTo:4}}...)
         <div class="right text-gray"><i class="icon-arrow-right3 size-24"></i></div>
         <div class="size-10 text-gray ellipsis">{{correspondent.device_address}}@{{correspondent.hub}}</div>
@@ -306,7 +307,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 	  </div>
 	</div>
 
-      <div class="message-log size-12 enable_text_select" scroll-bottom="messageEvents" when-scrolled="loadMoreHistory" bind-to-height="['bottom','form[name=chatForm]']" ng-mousemove="newMsgCounterEnabled ?'': newMessagesCount[correspondent.device_address] = 0">
+      <div class="message-log size-13 enable_text_select" scroll-bottom="messageEvents" when-scrolled="loadMoreHistory" bind-to-height="['bottom','form[name=chatForm]']" ng-mousemove="newMsgCounterEnabled ?'': newMessagesCount[correspondent.device_address] = 0">
         <div class="chat-message" ng-repeat="messageEvent in messageEvents">
             <!--div style="width:100%" ng-style="messageEvent.bIncoming ? {'text-align': 'left'} : {'text-align': 'right'}"-->
               <!--div style="max-width: 70%; text-align: left; display: inline-block" ng-bind-html="messageEvent.message"></div-->
@@ -317,9 +318,9 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
             <div class="clear"></div>
         </div>
       </div>
-        
+
         <form name="chatForm" class="send-form columns" no-validate ng-mousemove="newMsgCounterEnabled ?'': newMessagesCount[correspondent.device_address] = 0">
-          <div class="text-warning size-12 m10b" ng-show="error">{{error|translate}}</div>
+          <div class="text-warning size-13 m10b" ng-show="error">{{error|translate}}</div>
            <button
           	class="chatbutton left"
                      dropdown-toggle="#drop" data-options="align:top"><i class="size-18 icon-dots-three-horizontal"></i></button>
@@ -348,37 +349,37 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 			  </li>
 			</ul>
           <textarea rows="1" msd-elastic id="message" name="message" ng-model="message" ng-attr-autofocus="{{!isCordova && true || undefined}}" required ng-enter="send()" class="textinput" placeholder="{{'Text message to'|translate}} {{correspondent.name}}"></textarea>
-          <button type="submit" 
+          <button type="submit"
           	class="chatbutton right"
                      ng-disabled="!chatForm.$valid"
-                     ng-style="{'background-color':index.backgroundColor}" 
+                     ng-style="{'background-color':index.backgroundColor}"
                      ng-click="send()"><i class="size-18 icon-paperplane"></i></button>
           <!--<div class="row">
             <div class="large-4 medium-4 small-4 columns adaptive">
               <button type="button"
-                     class="button expand round outline dark-gray tiny" 
+                     class="button expand round outline dark-gray tiny"
                      ng-click="insertMyAddress()">Insert my address</button>
             </div>
             <div class="large-4 medium-4 small-4 columns adaptive">
               <button type="button"
-                     class="button expand round outline dark-gray tiny" 
+                     class="button expand round outline dark-gray tiny"
                      ng-click="requestPayment()">Request payment</button>
             </div>
             <div class="large-4 medium-4 small-4 columns adaptive">
-              <input type="submit" 
-                     class="button expand round" 
+              <input type="submit"
+                     class="button expand round"
                      value="{{'Send'}}"
                      ng-disabled="!chatForm.$valid"
                      style="padding-top: 15px; padding-bottom: 15px"
-                     ng-style="{'background-color':backgroundColor}" 
+                     ng-style="{'background-color':backgroundColor}"
                      ng-click="send()">
             </div>
           </div>-->
         </form>
     <!--/div-->
-      
+
 
 
     <div class="extra-margin-bottom"></div>
 </div>
-<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>
+<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>

public/views/correspondentDevices.html

@@ -1,9 +1,12 @@
 <style type="text/css">
-	.bots-list { padding: 10px 10px 5px 10px }
+	.bots-list {
+		 padding: 10px 10px 5px 10px;
+		 height: 50px;
+	 }
 
 	.bot_name {
 		text-overflow: ellipsis;
-		max-width: 75%;
+		max-width: 60%;
 		display: inline-block;
 		white-space: nowrap;
 		overflow: hidden;
@@ -49,7 +52,7 @@
 
 	.bots-orders-list.f-dropdown li,
 	.contacts-orders-list.f-dropdown li { fo5nt-size: 12px }
-	
+
 	.contacts-orders-list.f-dropdown li a .check, .bots-orders-list.f-dropdown li a .check {
 		position: inherit;
 	}
@@ -140,7 +143,7 @@
 					<a class="selectCorrespondentList" ng-show="editCorrespondentList" ng-click="toggleSelectCorrespondentList(correspondent.device_address)">
 						<i class="fi-trash"></i>
 					</a>
-					<div ng-click="showCorrespondent(correspondent)" class="pointer">
+					<div ng-click="showCorrespondent(correspondent)" class="pointer size-14">
 						{{correspondent.name}} ({{correspondent.device_address | limitTo:4}}...)
 						<div class="right text-gray"><i class="icon-arrow-right3 size-24" ng-show="!editCorrespondentList && hideRemove"></i></div>
 						<div class="right correspondentlist_badge" ng-show="newMessagesCount[correspondent.device_address]">{{newMessagesCount[correspondent.device_address]}}</div>
@@ -150,13 +153,13 @@
 				<li class="m10t" ng-show="!editCorrespondentList">
 					<a ng-click="beginAddCorrespondent()" class="p10">
 						<i class="fi-plus size-18 m10r" style="vertical-align: middle;"></i>
-						<span class="text-close size-12" translate>Add a new device</span>
+						<span class="text-close size-14" translate>Add a new device</span>
 					</a>
 				</li>
 				<li class="m10t m30b" ng-show="!editCorrespondentList" style="padding-bottom: env(safe-area-inset-bottom);">
 					<a ng-click="hideRemove = !hideRemove" class="p10">
 						<i class="fi-minus size-18 m10r" style="vertical-align: middle;"></i>
-						<span class="text-close size-12" translate>Remove a device</span>
+						<span class="text-close size-14" translate>Remove a device</span>
 					</a>
 				</li>
 			</ul>
@@ -188,16 +191,17 @@
 			<!--hr class="order-divider"-->
 			<ul class="no-bullet m0 correspondentList">
 				<li class="bots-list line-b" ng-repeat="bot in bots | filter:{name_and_desc: botsSearchText} | orderBy:botsSortOrder">
-					<div ng-click="showBot(bot)" class="pointer">
-						<span class="bot_name">{{bot.name}}</span>
+					<div ng-click="showBot(bot)" class="pointer" style="height:40px;">
+						<div class="label tu radius light-gray" ng-if="bot.isPaired" translate style="vertical-align:middle">Added</div>
+						<span class="bot_name size-14">{{bot.name}}</span>
 						<div class="right text-gray"><i class="icon-arrow-right3 size-24" ng-show="!editCorrespondentList && hideRemove"></i></div>
-						<div class="right label tu radius light-gray" ng-if="bot.isPaired" translate style="margin-top: 5px">Added</div>
+
 					</div>
 				</li>
 			</ul>
-			<div class="text-warning size-12 m10b" ng-show="botsError">{{botsError|translate}}</div>
+			<div class="text-warning size-13 m10b" ng-show="botsError">{{botsError|translate}}</div>
 		</div>
 	</div>
 
 </div>
-<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>
+<div ng-include="'views/includes/menu.html'" ng-show="!index.noFocusedWallet"></div>

public/views/create.html

@@ -53,7 +53,7 @@
         </div>
 
         <div ng-hide="create.hideWalletName">
-          <label><span translate class="left m10t">Single address wallet</span>
+          <label><span translate class="left ">Single address wallet</span>
             <switch name="isSingleAddress" ng-model="isSingleAddress" class="green right m10b"></switch>
           </label>
           <div class="description m10b" translate>
@@ -163,15 +163,15 @@
                 <span>Testnet</span>
                 <switch id="network-name" name="isTestnet" ng-model="isTestnet" class="green right m5t m10b"></switch>
               </label>
-            </div> 
+            </div>
           </div>
         </div--> <!-- advanced -->
 
-        <button type="submit" class="button round black expand m0" ng-show="totalCosigners != 1" ng-disabled="setupForm.$invalid || create.loading">
+        <button type="submit" class="button round black expand m20t" ng-show="totalCosigners != 1" ng-disabled="setupForm.$invalid || create.loading">
           <span translate>Create {{requiredCosigners}}-of-{{totalCosigners}} wallet</span>
         </button>
 
-        <button type="submit" class="button round black expand m0" ng-show="totalCosigners == 1" ng-disabled="setupForm.$invalid || create.loading">
+        <button type="submit" class="button round black expand m20t" ng-show="totalCosigners == 1" ng-disabled="setupForm.$invalid || create.loading">
           <span translate>Create new wallet</span>
         </button>
 

public/views/editCorrespondentDevice.html

@@ -38,7 +38,7 @@ <h1 class="title ellipsis" ng-style="{'color': noColor ? '#4A90E2' : index.backg
 	  </div>
 
         <form name="editForm" class="m20t" no-validate>
-          <div class="text-warning size-12 m10b" ng-show="error">{{error|translate}}</div>
+          <div class="text-warning size-13 m10b" ng-show="error">{{error|translate}}</div>
 		  <span translate>Rename:</span>
 	      <input type="text" id="name" name="name" ng-model="name" required>
 		  <span translate>Change hub:</span>

public/views/export.html

@@ -52,7 +52,7 @@ <h4></h4>
 				</div>
 			</div>
 		</form>
-		<div class="text-alert size-12 columns">
+		<div class="text-alert size-13 columns">
 			<span translate>WARNING:</span>
 			<ul class="warnings">
 				<li translate>If you plan to restore the wallet on another device, stop using it on the current one immediately after creating the backup.  Never clone wallets.  If you need access from several devices, use multisig.</li>

public/views/import.html

@@ -40,7 +40,7 @@ <h4></h4>
 				   value="{{'Import'|translate}}" ng-style="{'background-color':index.backgroundColor}">
 		</form>
 	</div>
-	<div class="text-alert size-12 columns">
+	<div class="text-alert size-13 columns">
 		<span translate>WARNINGS:</span>
 		<ul class="warnings">
 			<li translate>This will permanently delete all your existing wallets!</li>