From: Chris Duncan <chris@zoso.dev>
Date: Thu, 24 Oct 2024 04:58:03 +0000 (-0700)
Subject: Remove Xel toolkit. Add colors and fonts listed by Nano Foundation. Simplify libnemo... 
X-Git-Url: https://zoso.dev/?a=commitdiff_plain;h=737572c3b818fdb42053de4f7516c0c1129dcc51;p=nemo-wallet.git

Remove Xel toolkit. Add colors and fonts listed by Nano Foundation. Simplify libnemo import. Start troubleshooting account derivation. Define nav SVG icons explicitly from Bootstrap assets.
---

diff --git a/app/pages/nemo-wallet.html b/app/pages/nemo-wallet.html
index 179aef5..b055ac5 100644
--- a/app/pages/nemo-wallet.html
+++ b/app/pages/nemo-wallet.html
@@ -4,11 +4,12 @@
 	<meta charset="utf-8" />
 	<meta lang="en" />
 	<meta name="viewport" content="width=device-width, initial-scale=1" />
-	<meta name="xel-theme" content="https://cdn.jsdelivr.net/npm/xel@0.28.13/themes/adwaita-dark.css" />
-	<meta name="xel-accent-color" content="blue" />
-	<meta name="xel-icons" content="https://unpkg.com/bootstrap-icons@latest/bootstrap-icons.svg" />
+	<link rel="preconnect" href="https://fonts.googleapis.com">
+	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+	<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
+	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
 	<script>
-		let Account, Bip44Wallet, Blake2bWallet, SendBlock, ReceiveBlock, ChangeBlock, rpc, Rolodex, Xel
+		let libnemo, css
 
 		const observer = new MutationObserver((mutations) => {
 			for (const mutation of mutations) {
@@ -18,31 +19,21 @@
 			}
 		})
 
-		async function load () {
+		window.addEventListener('load', async (event) => {
 			try {
 				document.querySelector(location.hash).classList.add('show')
 			} catch (err) {
 				location.hash = '#transact'
 			}
-			await loadUi()
 			await loadNemo()
 			await loadData()
+			await loadUi()
 			console.log('done')
-		}
-
-		async function loadUi () {
-			console.log('loading xel')
-			Xel = await import('https://cdn.jsdelivr.net/npm/xel@0.28.13')
-			await Xel.whenThemeReady
-			setTimeout(() => {
-				document.getElementsByTagName('body')[0].style.visibility = 'visible'
-			}, 250)
-			console.log('loaded xel')
-		}
+		})
 
 		async function loadNemo () {
 			console.log('loading libnemo')
-			await ({ Account, Bip44Wallet, Blake2bWallet, SendBlock, ReceiveBlock, ChangeBlock, Node: rpc, Rolodex } = await import('https://cdn.jsdelivr.net/npm/libnemo@0.0.12'))
+			libnemo = await import('https://cdn.jsdelivr.net/npm/libnemo@0.0.12')
 			console.log('loaded libnemo')
 		}
 
@@ -73,6 +64,14 @@
 			console.log('loaded data')
 		}
 
+		async function loadUi () {
+			console.log('loading ui')
+			setTimeout(() => {
+				document.getElementsByTagName('body')[0].style.visibility = 'visible'
+			}, 250)
+			console.log('loaded ui')
+		}
+
 		function switchPage (evt) {
 			console.log(evt)
 			const oldHash = new URL(evt.oldURL)?.hash
@@ -89,6 +88,22 @@
 			}
 		}
 
+		const notify = {
+			_show: (msg, color) => {
+				const container = document.querySelector('#notifications')
+				const notification = document.createElement('dialog')
+
+				notification.innerText = msg
+				notification.style.color = color ?? notification.style.color
+
+				container.appendChild(notification)
+				notification.show()
+			},
+			info: (msg) => notify._show(`ℹ️ ${msg}`),
+			ok: (msg) => notify._show(`☑️ ${msg}`, 'Cyan'),
+			error: (msg) => notify._show(`⚠️ ${msg}`, 'Gold')
+		}
+
 		function addToStorage (key, value) {
 			if (typeof value !== 'string') {
 				throw new TypeError(`Cannot add ${typeof value} to storage`)
@@ -127,11 +142,11 @@
 		function getWalletClass (algorithm) {
 			switch (algorithm) {
 				case 'blake2b': {
-					return Blake2bWallet
+					return libnemo.Blake2bWallet
 				}
 				case 'bip44':
 				default: {
-					return Bip44Wallet
+					return libnemo.Bip44Wallet
 				}
 			}
 		}
@@ -264,9 +279,14 @@
 				return
 			}
 			const index = form.querySelector('#account-new-index input')?.value
+			const password = form.querySelector('#account-new-password input')?.value
 			let account
 			try {
+				console.log('locking')
+				console.log(await wallet.unlock(password))
 				account = await wallet.accounts(index)
+				console.log('locking')
+				console.log(await wallet.lock(password))
 				const accountData = {
 					id: index,
 					name: name || index
@@ -336,7 +356,7 @@
 			}
 			const walletElements = []
 			for (const wallet of wallets) {
-				const walletElement = document.createElement('x-label')
+				const walletElement = document.createElement('label')
 				await wallet.unlock('password')
 				walletElement.innerText = `${wallet.name}: ${wallet.mnemonic}`
 				await wallet.lock('password')
@@ -358,29 +378,28 @@
 			await updateWalletSelect()
 			notify.info(`Session storage cleared`)
 		}
-
-		const notify = {
-			_show: (msg, color) => {
-				const container = document.querySelector('#notifications')
-				const notification = document.createElement('x-card')
-
-				notification.innerText = msg
-				notification.style.color = color ?? notification.style.color
-
-				notification.addEventListener('click', notification.remove)
-				container.appendChild(notification)
-			},
-			info: (msg) => notify._show(`ℹ️ ${msg}`),
-			ok: (msg) => notify._show(`☑️ ${msg}`, 'Cyan'),
-			error: (msg) => notify._show(`⚠️ ${msg}`, 'Gold')
-		}
 	</script>
 	<style>
+    html {
+			--color-blue: #209CE9;
+      --color-dark: #20204C;
+			--color-light: #F4FAFF;
+			--color-gray: #676686;
+			--color-black: #070707;
+			--color-white: #FFFFFF;
+			--text-body: 'Open Sans';
+			--text-heading: 'Montserrat';
+    }
     body {
-      background-color: slategrey;
-      color: #209CE9;
-      fill: #209CE9;
+			background-color: var(--color-dark);
+      color: var(--color-light);
+      fill: var(--color-blue);
+			font-family: var(--text-body);
+			margin: 0;
     }
+		h1, h2, h3, h4, h5, h6 {
+			font-family: var(--text-heading);
+		}
 		.flex {
 			display: flex;
 		}
@@ -392,6 +411,7 @@
 		.flex.x-center,
 		.flex.x-right,
 		.flex.x-full {
+			flex: 1 0 0;
 			flex-direction: row;
 			justify-content: center;
 		}
@@ -430,6 +450,7 @@
 		.flex.y-mid,
 		.flex.y-bottom,
 		.flex.full {
+			flex: 1 0 0;
 			flex-direction: column;
 			justify-content: center;
 		}
@@ -534,7 +555,7 @@
       width: 100%;
       z-index: 100;
     }
-    #notifications > x-card {
+    #notifications > dialog {
       align-items: center;
       display: flex;
       margin: 1px 0px;
@@ -556,18 +577,13 @@
     dialog {
       padding: 1rem !important;
     }
-		label:has(+ input:required)::after {
+		label:has(+ :required)::after {
 			color: red;
 			content: '*';
 		}
-		input:required:invalid {
+		:required:invalid {
 			border: 1px solid red;
 		}
-		x-button[skin="nav"].menubtn {
-			justify-content: flex-start;
-      padding: 0 12px 0 23px;
-			width: 100%;
-		}
     nav {
       align-items: flex-end;
       bottom: 0;
@@ -584,10 +600,12 @@
       padding: 1rem;
     }
     #xno {
+			fill: var(--color-blue);
       flex: 1.5 0 auto;
     }
     nav > a > * {
       aspect-ratio: 1;
+			fill: var(--color-blue);
       height: 100%;
       max-height: 10vh;
       max-width: 10vh;
@@ -600,7 +618,7 @@
   </style>
 </head>
 
-<body onload="load()" onhashchange="switchPage(event)" style="visibility:hidden;">
+<body onhashchange="switchPage(event)" style="visibility:hidden;">
 	<div id="notifications"></div>
 	<header>
 
@@ -609,7 +627,7 @@
 		<div id="wallets" class="grid-x">
 			<label for="wallet" class="grid x-2">Wallet</label>
 			<select id="wallet" class="grid x-10" onchange="updateWalletSelect()">
-				<option disabled value>Choose...</option>
+				<option disabled selected value>Choose...</option>
 				<hr />
 				<option value="_new">New</option>
 				<option value="_import">Import</option>
@@ -625,7 +643,7 @@
 			<div class="flex y-stretch">
 				<div id="wallet-new-name" class="flex x-left x-mid">
 					<label for="wallet-new-name-input">Name</label>
-					<input id="wallet-new-name-input" name="wallet-new-name" autocomplete="off" minlength="1" maxlength="80" pattern="[^_].*" placeholder="My Wallet" required />
+					<input id="wallet-new-name-input" name="wallet-new-name" autocomplete="off" maxlength="80" pattern="[^_].*" placeholder="My Wallet" />
 				</div>
 				<div id="wallet-new-algorithm" class="flex x-left x-mid">
 					<label for="wallet-new-algorithm-select">Algorithm</label>
@@ -659,87 +677,90 @@
 		<!-- Import Wallet Form -->
 
 		<dialog id="wallet-import">
-			<div class="flex vertical">
-				<x-box id="wallet-import-name">
-					<x-label>Name</x-label>
-					<x-input type="text"></x-input>
-				</x-box>
-				<x-box id="wallet-import-algorithm">
-					<x-radios required onchange="updateWalletForm('#wallet-import')">
-						<x-radio value="bip44"><x-label>BIP-44</x-label></x-radio>
-						<x-radio value="blake2b"><x-label>BLAKE2b</x-label></x-radio>
-					</x-radios>
-				</x-box>
-				<x-box id="wallet-import-type" class="hide">
-					<x-select onchange="updateWalletForm('#wallet-import')">
-						<x-menu>
-							<x-menuitem value="mnemonic"><x-label>Import mnemonic</x-label></x-menuitem>
-							<x-menuitem value="seed"><x-label>Import seed</x-label></x-menuitem>
-						</x-menu>
-					</x-select>
-				</x-box>
-				<x-box id="wallet-import-value" class="hide">
-					<x-label style="text-transform:capitalize"></x-label>
-					<x-input type="password"></x-input>
-				</x-box>
-				<x-box id="wallet-import-salt" class="hide">
-					<x-label>Salt</x-label>
-					<x-input type="password">Optional</x-input>
-				</x-box>
-				<x-box id="wallet-import-password">
-					<x-label>Lock</x-label>
-					<x-input type="password" required><x-label>Password</x-label></x-input>
-				</x-box>
-				<x-box>
-					<x-buttons>
-						<x-button onclick="formCancel('#wallet-import')">
-							Cancel
-						</x-button>
-						<x-button onclick="importWallet().then(w => { console.log(w);showWallets() })">
-							OK
-						</x-button>
-					</x-buttons>
-				</x-box>
+			<div class="flex y-stretch">
+				<div id="wallet-import-name" class="flex x-left x-mid">
+					<label for="wallet-import-name-input">Name</label>
+					<input id="wallet-import-name-input" name="wallet-import-name" autocomplete="off" maxlength="80" pattern="[^_].*" placeholder="My Wallet" />
+				</div>
+				<div id="wallet-import-algorithm" class="flex x-left x-mid">
+					<label for="wallet-import-algorithm-select">Algorithm</label>
+					<select id="wallet-import-algorithm-select" name="wallet-import-algorithm" autocomplete="off" onchange="updateWalletForm('#wallet-import')" required>
+						<option disabled selected value>Choose...</option>
+						<option value="bip44">BIP-44</option>
+						<option value="blake2b">BLAKE2b</option>
+					</select>
+				</div>
+				<div id="wallet-import-type" class="flex x-left x-mid hide">
+					<label for="wallet-import-type-select">Type</label>
+					<select id="wallet-import-type-select" name="wallet-import-type" autocomplete="off" onchange="updateWalletForm('#wallet-import')" required>
+						<option disabled selected value>Choose...</option>
+						<option value="mnemonic">Import mnemonic</option>
+						<option value="seed">Import seed</option>
+					</select>
+				</div>
+				<div id="wallet-import-value" class="flex x-left x-mid hide">
+					<label for="wallet-import-value-input" style="text-transform:capitalize"></label>
+					<input id="wallet-import-value-input" name="wallet-import-value" type="password" autocomplete="off" placeholder="Password" required />
+				</div>
+				<div id="wallet-import-salt" class="flex x-left x-mid hide">
+					<label for="wallet-import-salt-input">Salt</label>
+					<input id="wallet-import-salt-input" name="wallet-import-salt" type="password" autocomplete="off" placeholder="Optional" />
+				</div>
+				<div id="wallet-import-password" class="flex x-left x-mid">
+					<label for="wallet-import-password-input">Lock</label>
+					<input id="wallet-import-password-input" name="wallet-import-password" type="password" autocomplete="off" placeholder="Password" required />
+				</div>
+				<hr />
+				<div class="grid-x">
+					<div class="grid x-4"></div>
+					<button class="grid x-4" onclick="formCancel('#wallet-import')">
+						Cancel
+					</button>
+					<button class="grid x-4" onclick="importWallet().then(w => { console.log(w);showWallets() })">
+						OK
+					</button>
+				</div>
 			</div>
 		</dialog>
 
 		<!-- Account Select -->
 
-		<x-box id="accounts" class="grid-x">
+		<div id="accounts" class="grid-x">
 			<label for="account" class="grid x-2">Account</label>
 			<select id="account" class="grid x-10" disabled onchange="updateWalletSelect()">
-				<option value="" disabled>Choose...</option>
+				<option disabled selected value>Choose...</option>
 				<hr />
 				<option value="_new">New</option>
 				<hr />
 			</select>
-		</x-box>
+		</div>
 
 		<!-- New Account Form -->
 
 		<dialog id="account-new">
-			<x-box vertical>
-				<x-box id="account-new-name">
-					<x-label>Name</x-label>
-					<x-input type="text"></x-input>
-				</x-box>
-				<x-box id="account-new-index">
-					<x-label>Index (optional)</x-label>
-					<x-numberinput min="0" max="2147483647"></x-numberinput>
-				</x-box>
-				<x-box id="account-new-password">
-					<x-label>Unlock</x-label>
-					<x-input type="password" required><x-label>Password</x-label></x-input>
-				</x-box>
-				<x-buttons>
-					<x-button onclick="document.querySelector('#account-new').close()">
+			<div class="flex y-stretch">
+				<div id="account-new-name" class="flex x-left x-mid">
+					<label for="account-new-name-input">Name</label>
+					<input id="account-new-name-input" name="account-new-name" autocomplete="off" maxlength="80" pattern="[^_].*" placeholder="My Account" />
+				</div>
+				<div id="account-new-index" class="flex x-left x-mid">
+					<label for="account-new-index-input">Index</label>
+					<input id="account-new-index-input" name="account-new-index" type="number" autocomplete="off" min="0" max="2147483647" />
+				</div>
+				<div id="account-new-password" class="flex x-left x-mid">
+					<label for="account-new-password-input">Unlock</label>
+					<input id="account-new-password-input" name="account-new-password" autocomplete="off" type="password" placeholder="Password" required />
+				</div>
+				<div class="grid-x">
+					<div class="grid x-4"></div>
+					<button class="grid x-4" onclick="formCancel('#account-new')">
 						Cancel
-					</x-button>
-					<x-button onclick="createAccount().then(w => { console.log(w);showWallets() })">
+					</button>
+					<button class="grid x-4" onclick="createAccount().then(w => { console.log(w);showWallets() })">
 						OK
-					</x-button>
-				</x-buttons>
-			</x-box>
+					</button>
+				</div>
+			</div>
 		</dialog>
 	</header>
 
@@ -749,65 +770,71 @@
 
 		<!-- Exchange Page -->
 
-		<x-box id="exchange" class="page">
+		<div id="exchange" class="page">
 			<h1>Exchange</h1>
-		</x-box>
+		</div>
 
 		<!-- History Page -->
 
-		<x-box id="history" class="page">
+		<div id="history" class="page">
 			<h1>History</h1>
-		</x-box>
+		</div>
 
 		<!-- Transact Page (default) -->
 
-		<x-box id="transact" class="page">
+		<div id="transact" class="page">
 			<h1>Transact</h1>
-			<x-card id="walletCard">
-			</x-card>
-		</x-box>
+			<div id="walletCard">
+			</div>
+		</div>
 
 		<!-- Rolodex Page -->
 
-		<x-box id="rolodex" class="page">
+		<div id="rolodex" class="page">
 			<h1>Rolodex</h1>
-		</x-box>
+		</div>
 
 		<!-- Settings Page -->
 
-		<x-box id="settings" class="page">
+		<div id="settings" class="page">
 			<h1>Settings</h1>
-			<x-button onclick="clearStorage()">
-				<x-label>Clear Storage</x-label>
-			</x-button>
-		</x-box>
+			<button onclick="clearStorage()">
+				Clear Storage
+			</button>
+		</div>
 	</main>
 
 	<!-- Nav Dock -->
 
 	<nav>
 		<a href="#exchange">
-			<x-icon href="#currency-exchange"></x-icon>
+			<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" fill="currentColor" class="bi bi-currency-exchange" viewBox="0 0 16 16">
+				<path d="M0 5a5 5 0 0 0 4.027 4.905 6.5 6.5 0 0 1 .544-2.073C3.695 7.536 3.132 6.864 3 5.91h-.5v-.426h.466V5.05q-.001-.07.004-.135H2.5v-.427h.511C3.236 3.24 4.213 2.5 5.681 2.5c.316 0 .59.031.819.085v.733a3.5 3.5 0 0 0-.815-.082c-.919 0-1.538.466-1.734 1.252h1.917v.427h-1.98q-.004.07-.003.147v.422h1.983v.427H3.93c.118.602.468 1.03 1.005 1.229a6.5 6.5 0 0 1 4.97-3.113A5.002 5.002 0 0 0 0 5m16 5.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0m-7.75 1.322c.069.835.746 1.485 1.964 1.562V14h.54v-.62c1.259-.086 1.996-.74 1.996-1.69 0-.865-.563-1.31-1.57-1.54l-.426-.1V8.374c.54.06.884.347.966.745h.948c-.07-.804-.779-1.433-1.914-1.502V7h-.54v.629c-1.076.103-1.808.732-1.808 1.622 0 .787.544 1.288 1.45 1.493l.358.085v1.78c-.554-.08-.92-.376-1.003-.787zm1.96-1.895c-.532-.12-.82-.364-.82-.732 0-.41.311-.719.824-.809v1.54h-.005zm.622 1.044c.645.145.943.38.943.796 0 .474-.37.8-1.02.86v-1.674z" />
+			</svg>
 		</a>
 		<a href="#history">
-			<x-icon href="#book-half"></x-icon>
+			<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" fill="currentColor" class="bi bi-book-half" viewBox="0 0 16 16">
+				<path d="M8.5 2.687c.654-.689 1.782-.886 3.112-.752 1.234.124 2.503.523 3.388.893v9.923c-.918-.35-2.107-.692-3.287-.81-1.094-.111-2.278-.039-3.213.492zM8 1.783C7.015.936 5.587.81 4.287.94c-1.514.153-3.042.672-3.994 1.105A.5.5 0 0 0 0 2.5v11a.5.5 0 0 0 .707.455c.882-.4 2.303-.881 3.68-1.02 1.409-.142 2.59.087 3.223.877a.5.5 0 0 0 .78 0c.633-.79 1.814-1.019 3.222-.877 1.378.139 2.8.62 3.681 1.02A.5.5 0 0 0 16 13.5v-11a.5.5 0 0 0-.293-.455c-.952-.433-2.48-.952-3.994-1.105C10.413.809 8.985.936 8 1.783" />
+			</svg>
 		</a>
 		<a href="#transact" id="xno">
-			<svg width="0px" height="0px" viewBox="0 0 1080 1080" fill="none">
-				<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" />
-				<path
-					d="M336.487 508.737H744.807V547.116H336.487V508.737ZM336.487 623.872H744.824V662.251H336.47L336.487 623.872Z"
-					fill="white" />
+			<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" viewBox="0 0 1080 1080">
+				<circle cx="540" cy="540" r="540" />
+				<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" />
+				<path d="M336.487 508.737H744.807V547.116H336.487V508.737ZM336.487 623.872H744.824V662.251H336.47L336.487 623.872Z" fill="white" />
 			</svg>
 		</a>
 		<a href="#rolodex">
-			<x-icon href="#person-rolodex"></x-icon>
+			<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" fill="currentColor" class="bi bi-person-rolodex" viewBox="0 0 16 16">
+				<path d="M8 9.05a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5" />
+				<path d="M1 1a1 1 0 0 0-1 1v11a1 1 0 0 0 1 1h.5a.5.5 0 0 0 .5-.5.5.5 0 0 1 1 0 .5.5 0 0 0 .5.5h9a.5.5 0 0 0 .5-.5.5.5 0 0 1 1 0 .5.5 0 0 0 .5.5h.5a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1H6.707L6 1.293A1 1 0 0 0 5.293 1zm0 1h4.293L6 2.707A1 1 0 0 0 6.707 3H15v10h-.085a1.5 1.5 0 0 0-2.4-.63C11.885 11.223 10.554 10 8 10c-2.555 0-3.886 1.224-4.514 2.37a1.5 1.5 0 0 0-2.4.63H1z" />
+			</svg>
 		</a>
 		<a href="#settings">
-			<x-icon href="#gear"></x-icon>
+			<svg xmlns="http://www.w3.org/2000/svg" width="0" height="0" fill="currentColor" class="bi bi-gear" viewBox="0 0 16 16">
+				<path d="M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492M5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0" />
+				<path d="M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115z" />
+			</svg>
 		</a>
 	</nav>
 </body>