Reskin (#84)

* Reskin * Fix error borders * Fix memo highlight color * Replace fee blog post url * Redirect if missing trailing slash in url * Fix text color on view all payments button * Fix hover state * Swap info icon * Link to fee docs, not blog post * Move redirect so it always runs * Fix 404ing links
stellar-deprecated · Aug 22, 2019 · d40c616 · d40c616
1 parent 13b8203
commit d40c616
Show file tree

Hide file tree

Showing 10 changed files with 144 additions and 25 deletions.
diff --git a/controllers/send-widget.controller.es6 b/controllers/send-widget.controller.es6
@@ -374,7 +374,7 @@ export default class SendWidgetController {
             alert = new Alert({
               title: 'Insufficient balance.',
               text:
-                `To maintain your <a href="https://www.stellar.org/developers/learn/concepts/fees.html#minimum-balance" target="_blank">minimum balance</a>, the most you can currently send is ${err.data.maxSend}.`,
+                `To maintain your <a href="https://www.stellar.org/developers/guides/concepts/fees.html#minimum-balance" target="_blank">minimum balance</a>, the most you can currently send is ${err.data.maxSend}.`,
               type: Alert.TYPES.ERROR
             });
             break;

diff --git a/images/info.png b/images/info.png
diff --git a/index.html b/index.html
@@ -5,6 +5,13 @@
   <title>Stellar Account Viewer</title>
   <meta name="description" content="">
   <meta name="viewport" content="width=device-width">
+  <script type="text/javascript">
+    var origin = window.location.origin;
+    var pathname = window.location.pathname;
+     if (pathname[pathname.length - 1] !== '/') {
+      window.location = `${origin}${pathname}/`
+    }
+  </script>
 </head>
 <body>
 <div ui-view>

diff --git a/styles/_historyTable.scss b/styles/_historyTable.scss
@@ -6,7 +6,7 @@
     border-bottom: 2px solid $s-color-neutral6;
   }
   .historyTable__row--data:nth-child(odd) {
-    background: $s-color-neutral8;
+    background: #fafafa;
   }
   .historyTable__row--data:hover {
     background: $s-color-neutral7;
@@ -37,15 +37,15 @@
       color: $s-color-alert;
     }
     .historyTable__amount__code {
-      background: $s-color-primary8;
+      background: rgba(125, 0, 255, .16);
       border-radius: $s-var-radius;
       white-space: nowrap;
     }
   .historyTable__memo {
 
   }
     .historyTable__memo__data {
-      background: $s-color-primary8;
+      background: rgba(125, 0, 255, .16);
       border-radius: $s-var-radius;
       border-radius: $s-var-radius;
       word-break: break-all;

diff --git a/styles/_siteHeader.scss b/styles/_siteHeader.scss
@@ -8,5 +8,5 @@
   }
 }
 .siteHeader__signout__link:hover {
-  color: $s-color-primary3;
+  color: #7D00FF;
 }
diff --git a/styles/main.header.scss b/styles/main.header.scss
diff --git a/templates/balance-widget.template.html b/templates/balance-widget.template.html
@@ -17,7 +17,7 @@
     <div class="so-chunk">
       <div class="accountUnfunded">
         <div class="s-alert s-alert--warning accountUnfunded__alert">
-          This account is currently inactive. To activate it, <a href="https://www.stellar.org/developers/learn/concepts/fees.html#minimum-balance" target="_blank">send at least 1 lumen (XLM)</a> to the Stellar public key displayed above.
+          This account is currently inactive. To activate it, <a href="https://www.stellar.org/developers/guide/concepts/fees.html#minimum-balance" target="_blank">send at least 1 lumen (XLM)</a> to the Stellar public key displayed above.
         </div>
       </div>
     </div>

diff --git a/templates/dashboard.template.html b/templates/dashboard.template.html
@@ -2,9 +2,9 @@
   <div class="so-chunk">
     <div class="so-siteHeader siteHeader">
       <span class="so-logo">
-        <a href="https://www.stellar.org/" class="so-logo__main">Stellar</a><!--
+        <a href="https://www.stellar.org/" class="so-logo__main"><svg width="100" height="61" class="Navigation__LogoEl-sc-1ng8ds2-1 kCDSHy" viewBox="0 0 799.93 200"><path d="M203 26.16l-28.46 14.5-137.43 70a82.49 82.49 0 0 1-.7-10.69A81.87 81.87 0 0 1 158.2 28.6l16.29-8.3 2.43-1.24A100 100 0 0 0 18.18 100q0 3.82.29 7.61a18.19 18.19 0 0 1-9.88 17.58L0 129.57V150l25.29-12.89 8.19-4.18 8.07-4.11L186.43 55l16.28-8.29 33.65-17.15V9.14zM236.36 50L49.78 145l-16.28 8.31L0 170.38v20.41l33.27-16.95 28.46-14.5 137.57-70.1A83.45 83.45 0 0 1 200 100a81.87 81.87 0 0 1-121.91 71.36l-1 .53-17.66 9A100 100 0 0 0 218.18 100c0-2.57-.1-5.14-.29-7.68a18.2 18.2 0 0 1 9.87-17.58l8.6-4.38zM517.39 64.18c-28.54 0-50.68 21-50.68 54.17 0 30.87 18.25 54.56 51.26 54.56 25.44 0 42.13-14.95 46.79-32.82h-18.25c-4.46 10.29-13 17.28-28.54 17.28-15.34 0-31.65-10.87-32.23-33.39h80.38c2.14-33.2-16.7-59.8-48.73-59.8zm-31.46 44.65c1.56-21 15.92-29.51 31.46-29.51 18.83 0 29.51 14.76 30.09 29.51zM359.26 89.61L343 85.92c-13.25-2.92-23-9.12-23-21.55 0-15.73 19-20.58 29.9-20.58 14 0 30.29 5.63 34.95 21.74h19.23c-5.64-27-28-38.44-53.4-38.44-22.72 0-50.87 11.46-50.87 38.44 0 23.3 19.22 34.18 38.64 38.45l17.55 3.69c17.67 4.08 30.29 9.9 30.29 24.85 0 14-11.84 23.69-32.81 23.69-21.94 0-35.14-10.1-38.83-29.51h-19.46c3.69 28 24.66 46.21 57.86 46.21 28 0 53.59-14.76 53.59-42.14 0-28.34-25.82-36.5-47.38-41.16zM444.58 39.71h-17.67v26.21H410.4V80.1h16.51v64.07c0 21.75 4.66 26.21 24.66 26.21h12.81v-14.75h-8.93c-10.1 0-10.87-2.72-10.87-13.59V80.1h19.8V65.92h-19.8zM794.69 65.34c-13.79.58-24.27 7-29.51 18.83V65.92h-17.29v104.46h17.67v-54.75c0-23.3 8.16-32 24.47-32a63.44 63.44 0 0 1 9.9.78V65.53a52 52 0 0 0-5.24-.19zM730.89 131l.19-24.08c.2-29.71-12.23-43.1-41.55-43.1-20.19 0-40.39 12.62-41.94 35.14h18.25c.78-13 9.13-20.77 23.88-20.77 13.21 0 23.69 6.21 23.69 25.43v2.52c-42.71 4.67-70.67 12-70.67 36.7 0 19.22 16.31 30.1 35.92 30.1 18.64 0 29.32-6 35.72-16.89a114.46 114.46 0 0 0 1.36 14.36h17.86c-2.13-9.93-2.91-21.77-2.71-39.41zm-16.12-4.27c0 24.65-15.72 32.23-32.23 32.23-12.62 0-20.19-6.6-20.19-16.51 0-14.37 20.38-19.22 52.42-22.33zM578.01 29.54h17.67v140.84h-17.67zM613.34 29.54h17.67v140.84h-17.67z"></path></svg></a><!--
         --><span class="so-logo__separator"> </span><!--
-        --><a href="https://www.stellar.org/account-viewer/" class="so-logo__subSite">account viewer</a>
+        --><a href="https://www.stellar.org/account-viewer/" class="so-logo__subSite">Account Viewer</a>
       </span>
       <span class="so-siteHeader__simpleAlign siteHeader__signout"><a href="#" ng-click="header.logout()" class="siteHeader__signout__link">Sign out</a></span>
     </div>

diff --git a/templates/login.template.html b/templates/login.template.html
@@ -2,9 +2,9 @@
   <div class="so-chunk">
     <div class="so-siteHeader siteHeader">
       <span class="so-logo">
-        <a href="https://www.stellar.org/" class="so-logo__main">Stellar</a><!--
+        <a href="https://www.stellar.org/" class="so-logo__main"><svg width="100" height="61" class="Navigation__LogoEl-sc-1ng8ds2-1 kCDSHy" viewBox="0 0 799.93 200"><path d="M203 26.16l-28.46 14.5-137.43 70a82.49 82.49 0 0 1-.7-10.69A81.87 81.87 0 0 1 158.2 28.6l16.29-8.3 2.43-1.24A100 100 0 0 0 18.18 100q0 3.82.29 7.61a18.19 18.19 0 0 1-9.88 17.58L0 129.57V150l25.29-12.89 8.19-4.18 8.07-4.11L186.43 55l16.28-8.29 33.65-17.15V9.14zM236.36 50L49.78 145l-16.28 8.31L0 170.38v20.41l33.27-16.95 28.46-14.5 137.57-70.1A83.45 83.45 0 0 1 200 100a81.87 81.87 0 0 1-121.91 71.36l-1 .53-17.66 9A100 100 0 0 0 218.18 100c0-2.57-.1-5.14-.29-7.68a18.2 18.2 0 0 1 9.87-17.58l8.6-4.38zM517.39 64.18c-28.54 0-50.68 21-50.68 54.17 0 30.87 18.25 54.56 51.26 54.56 25.44 0 42.13-14.95 46.79-32.82h-18.25c-4.46 10.29-13 17.28-28.54 17.28-15.34 0-31.65-10.87-32.23-33.39h80.38c2.14-33.2-16.7-59.8-48.73-59.8zm-31.46 44.65c1.56-21 15.92-29.51 31.46-29.51 18.83 0 29.51 14.76 30.09 29.51zM359.26 89.61L343 85.92c-13.25-2.92-23-9.12-23-21.55 0-15.73 19-20.58 29.9-20.58 14 0 30.29 5.63 34.95 21.74h19.23c-5.64-27-28-38.44-53.4-38.44-22.72 0-50.87 11.46-50.87 38.44 0 23.3 19.22 34.18 38.64 38.45l17.55 3.69c17.67 4.08 30.29 9.9 30.29 24.85 0 14-11.84 23.69-32.81 23.69-21.94 0-35.14-10.1-38.83-29.51h-19.46c3.69 28 24.66 46.21 57.86 46.21 28 0 53.59-14.76 53.59-42.14 0-28.34-25.82-36.5-47.38-41.16zM444.58 39.71h-17.67v26.21H410.4V80.1h16.51v64.07c0 21.75 4.66 26.21 24.66 26.21h12.81v-14.75h-8.93c-10.1 0-10.87-2.72-10.87-13.59V80.1h19.8V65.92h-19.8zM794.69 65.34c-13.79.58-24.27 7-29.51 18.83V65.92h-17.29v104.46h17.67v-54.75c0-23.3 8.16-32 24.47-32a63.44 63.44 0 0 1 9.9.78V65.53a52 52 0 0 0-5.24-.19zM730.89 131l.19-24.08c.2-29.71-12.23-43.1-41.55-43.1-20.19 0-40.39 12.62-41.94 35.14h18.25c.78-13 9.13-20.77 23.88-20.77 13.21 0 23.69 6.21 23.69 25.43v2.52c-42.71 4.67-70.67 12-70.67 36.7 0 19.22 16.31 30.1 35.92 30.1 18.64 0 29.32-6 35.72-16.89a114.46 114.46 0 0 0 1.36 14.36h17.86c-2.13-9.93-2.91-21.77-2.71-39.41zm-16.12-4.27c0 24.65-15.72 32.23-32.23 32.23-12.62 0-20.19-6.6-20.19-16.51 0-14.37 20.38-19.22 52.42-22.33zM578.01 29.54h17.67v140.84h-17.67zM613.34 29.54h17.67v140.84h-17.67z"></path></svg></a><!--
         --><span class="so-logo__separator"> </span><!--
-        --><a href="https://www.stellar.org/account-viewer/" class="so-logo__subSite">account viewer</a>
+        --><a href="https://www.stellar.org/account-viewer/" class="so-logo__subSite">Account Viewer</a>
       </span>
     </div>
   </div>

diff --git a/templates/send-widget.template.html b/templates/send-widget.template.html
@@ -1,9 +1,9 @@
 <div class="sendPane" ng-controller="interstellar-basic-client.SendWidgetController as widget">
   <h2 class="sendPane__title">Send lumens</h2>
   <div class="sendSetup" ng-if="widget.view == 'sendSetup'">
-    <p class="sendSetup__titleBar">To</p>
+    <label for="to" class="sendSetup__titleBar">To</label>
     <div class="sendSetup__destination">
-      <input ng-model="widget.destinationAddress" ng-blur="widget.loadDestination($event);" class="sendSetup__destination__input" ng-class="{'s-inputAlert--alert': widget.addressAlerts.length > 0}" placeholder="Recipient's public key or address" type="text">
+      <input name="to" ng-model="widget.destinationAddress" ng-blur="widget.loadDestination($event);" class="sendSetup__destination__input" ng-class="{'s-inputAlert--alert': widget.addressAlerts.length > 0}" placeholder="Recipient's public key or address" type="text">
     </div>
     <div class="s-alert s-alert--info sendSetup__info" ng-if="widget.loadingDestination">
       Loading federation info...
@@ -18,9 +18,9 @@ <h2 class="sendPane__title">Send lumens</h2>
       </span>
     </div>
 
-    <p class="sendSetup__titleBar">Amount</p>
+    <label for="amount" class="sendSetup__titleBar">Amount</label>
     <div class="s-inputGroup sendSetup__amount">
-      <input ng-model="widget.amount" class="s-inputGroup__item sendSetup__amount__input" ng-class="{'s-inputAlert--alert': widget.amountAlerts.length > 0}" type="text" placeholder="Amount to send">
+      <input name="amount" ng-model="widget.amount" class="s-inputGroup__item sendSetup__amount__input" ng-class="{'s-inputAlert--alert': widget.amountAlerts.length > 0}" type="text" placeholder="Amount to send">
       <span class="s-inputGroup__item s-inputGroup__item--tag sendSetup__amount__tag">
         lumens
       </span>
@@ -35,24 +35,24 @@ <h2 class="sendPane__title">Send lumens</h2>
       <p class="sendSetup__titleBar" ng-if="!widget.memo">
         <a href="#" ng-if="!widget.memoBlocked" ng-click="widget.showMemo($event);">Add memo</a>
         <span href="" class="sendSetup__titleBar__side">
-          <a href="https://www.stellar.org/developers/learn/concepts/transactions.html#memo" target="_blank">what's a memo?</a>
+          <a href="https://www.stellar.org/developers/guide/concepts/transactions.html#memo" target="_blank">What's a memo?</a>
         </span>
       </p>
       <div ng-if="widget.memo">
-        <p class="sendSetup__titleBar">Memo
+        <label for="memo-type" class="sendSetup__titleBar">Memo
           <span href="" class="sendSetup__titleBar__side">
-            <a href="https://www.stellar.org/developers/learn/concepts/transactions.html#memo" target="_blank">what's a memo?</a>
+            <a href="https://www.stellar.org/developers/guide/concepts/transactions.html#memo" target="_blank">What's a memo?</a>
             <span ng-if="!widget.memoBlocked"> |
               <a href="#" ng-click="widget.hideMemo($event);">cancel</a>
             </span>
           </span>
-        </p>
+        </label>
         <div class="s-inputGroup sendSetup__memo__memoSetup">
           <div class="so-dropdown sendSetup__memo__memoSetup__dropdown">
             <span
               class="s-inputGroup__item s-inputGroup__item--tag sendSetup__memo__memoSetup__selectTag"
               ng-class="{'is-disabled': widget.memoBlocked}">
-              <select ng-model="widget.memoType" ng-disabled="widget.memoBlocked"
+              <select name="memo-type" ng-model="widget.memoType" ng-disabled="widget.memoBlocked"
                 class="sendSetup__memo__memoSetup__selectTag__select so-dropdown__select"
                 ng-class="{'is-disabled': widget.memoBlocked}">
                 <option>MEMO_TEXT</option>
@@ -86,16 +86,16 @@ <h2 class="sendPane__title">Send lumens</h2>
       </span>
     </div>
 
-    <p class="sendSetup__titleBar">Fee</p>
+    <label for="fee" class="sendSetup__titleBar">Fee</label>
     <div class="s-inputGroup sendSetup__fee">
-      <input ng-model="widget.fee" class="s-inputGroup__item sendSetup__fee__input" ng-class="{'s-inputAlert--alert': widget.feeAlerts.length > 0}" type="text" placeholder="Fee">
+      <input name="fee" ng-model="widget.fee" class="s-inputGroup__item sendSetup__fee__input" ng-class="{'s-inputAlert--alert': widget.feeAlerts.length > 0}" type="text" placeholder="Fee">
       <span class="s-inputGroup__item s-inputGroup__item--tag sendSetup__fee__tag">
         lumens
       </span>
     </div>
     <p class="sendSetup__titleBar">
       <span href="" class="sendSetup__titleBar__side">
-        <a href="https://medium.com/stellar-developers-blog/surge-pricing-on-stellar-faq-1cd6e4aa6010" target="_blank">what's a fee?</a>
+        <a href="https://www.stellar.org/developers/guides/concepts/fees.html" target="_blank">What's a fee?</a>
       </span>
 
       <span class="network_congestion_normal" ng-if="widget.networkCongestion == 'low'">
@@ -185,12 +185,12 @@ <h2 class="sendPane__title">Send lumens</h2>
 
   <div class="additionalSigners" ng-if="widget.view === 'additionalSigners'">
     <p class="additionalSigners__label">Requires more signatures</p>
-    
+
     <p>This transaction requires additional signatures before it can be submitted.</p>
     <p>Copy the transaction XDR below and add the required signatures before submitting it to the network.</p>
-    
+
     <pre class="additionalSigners__xdr"><code>{{widget.lastTransactionXDR}}</code></pre>
-    
+
     <button class="s-button additionalSigners__return" ng-click="widget.showView($event, 'sendSetup')">Send another transaction</button>
   </div>