Fix nav icon scaling. Fill X button with xel accent color. Revert icon href being...

diff --git a/app/pages/nemo-wallet.html b/app/pages/nemo-wallet.html
index 9b791571bebd3fcd1897a184e93c83b867617011..04817b266a6df5291a660b6095a7656b756be8f2 100644 (file)
--- a/app/pages/nemo-wallet.html
+++ b/app/pages/nemo-wallet.html
@@ -152,13 +152,15 @@
     }
   </script>
   <meta name="xel-theme" content="https://unpkg.com/xel@latest/themes/adwaita-dark.css" />
-  <meta name="xel-accent-color" content="#209CE9" />
+  <meta name="xel-accent-color" content="blue" />
   <meta name="xel-icons" content="https://unpkg.com/bootstrap-icons@latest/bootstrap-icons.svg" />
   <link rel="preload" as="image" href="https://unpkg.com/bootstrap-icons@latest/bootstrap-icons.svg" />
 
   <style>
     body {
       background-color: slategrey;
+      color: #209CE9;
+      fill: #209CE9;
     }
     .page {
       display: none;
@@ -179,20 +181,22 @@
       display: flex;
       flex: 1 0 auto;
       justify-content: center;
-      max-height: 10vh;
       padding: 1rem;
     }
     #xno {
-      border: 0;
-      color: #209CE9;
-      fill: #209CE9;
       flex: 1.5 0 auto;
     }
     nav > a > * {
-      height: 10vh;
+      aspect-ratio: 1;
+      height: 100%;
       max-height: 10vh;
+      max-width: 10vh;
       width: 100%;
     }
+    #xno > svg {
+      max-height: 15vh;
+      max-width: 15vh;
+    }
   </style>
 </head>
 
@@ -264,8 +268,7 @@
     </a>
     <a href="#transact" id="xno">
       <svg width="0px" height="0px" viewBox="0 0 1080 1080" fill="none" xmlns="http://www.w3.org/2000/svg">
-        <circle cx="540" cy="540" r="540" fill="#209CE9" />
-        <circle cx="540" cy="540" r="540" fill="#209CE9" />
+        <circle cx="540" cy="540" r="540" fill="currentcolor" />
         <path
           d="M792.911 881H740.396L541.099 570.561L338.761 881H286.68L513.452 529.3L306.882 206.222H360.42L541.95 490.393L727.322 206.222H777.555L568.762 528.379L792.911 881Z"
           fill="white" />
@@ -278,10 +281,7 @@
       <x-icon href="#person-rolodex"></x-icon>
     </a>
     <a href="#settings">
-      <img src="bootstrap-icons.svg" />
-      <svg viewBox="0 0 16 16">
-        <use href="https://unpkg.com/bootstrap-icons@latest/bootstrap-icons.svg#gear" fill="#209CE9"></use>
-      </svg>
+      <x-icon href="#gear"></x-icon>
     </a>
   </nav>
 </body>