Updated CryptoBal to v3.0.0

Rabbit-Company · Sep 6, 2022 · e4af78f · e4af78f
1 parent e9f66b1
commit e4af78f
Show file tree

Hide file tree

Showing 10 changed files with 516 additions and 154 deletions.
diff --git a/dist/css/tailwind.min.css b/dist/css/tailwind.min.css
@@ -613,14 +613,14 @@ video {
   margin-top: 0.75rem;
 }
 
-.ml-3 {
-  margin-left: 0.75rem;
-}
-
 .mt-1 {
   margin-top: 0.25rem;
 }
 
+.ml-3 {
+  margin-left: 0.75rem;
+}
+
 .ml-16 {
   margin-left: 4rem;
 }
@@ -673,6 +673,10 @@ video {
   height: 2.5rem;
 }
 
+.w-full {
+  width: 100%;
+}
+
 .w-11 {
   width: 2.75rem;
 }
@@ -681,10 +685,6 @@ video {
   width: 1.25rem;
 }
 
-.w-full {
-  width: 100%;
-}
-
 .w-10 {
   width: 2.5rem;
 }
@@ -834,20 +834,25 @@ video {
   border-color: rgb(75 85 99 / var(--tw-border-opacity));
 }
 
-.border-transparent {
-  border-color: transparent;
-}
-
 .border-gray-400 {
   --tw-border-opacity: 1;
   border-color: rgb(156 163 175 / var(--tw-border-opacity));
 }
 
+.border-transparent {
+  border-color: transparent;
+}
+
 .border-l-gray-600 {
   --tw-border-opacity: 1;
   border-left-color: rgb(75 85 99 / var(--tw-border-opacity));
 }
 
+.bg-gray-900 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(17 24 39 / var(--tw-bg-opacity));
+}
+
 .bg-gray-800 {
   --tw-bg-opacity: 1;
   background-color: rgb(31 41 55 / var(--tw-bg-opacity));
@@ -858,14 +863,14 @@ video {
   background-color: rgb(55 65 81 / var(--tw-bg-opacity));
 }
 
-.bg-gray-100 {
+.bg-gray-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
 }
 
-.bg-gray-600 {
+.bg-gray-100 {
   --tw-bg-opacity: 1;
-  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
 }
 
 .bg-indigo-600 {
@@ -910,6 +915,11 @@ video {
   padding-right: 1.5rem;
 }
 
+.py-12 {
+  padding-top: 3rem;
+  padding-bottom: 3rem;
+}
+
 .py-4 {
   padding-top: 1rem;
   padding-bottom: 1rem;
@@ -944,6 +954,10 @@ video {
   text-align: left;
 }
 
+.text-center {
+  text-align: center;
+}
+
 .align-middle {
   vertical-align: middle;
 }
@@ -1026,6 +1040,11 @@ video {
   color: rgb(209 213 219 / var(--tw-text-opacity));
 }
 
+.text-blue-400 {
+  --tw-text-opacity: 1;
+  color: rgb(96 165 250 / var(--tw-text-opacity));
+}
+
 .text-red-600 {
   --tw-text-opacity: 1;
   color: rgb(220 38 38 / var(--tw-text-opacity));

diff --git a/dist/images/crypto_balance.svg b/dist/images/crypto_balance.svg
diff --git a/dist/images/cryptos/ERG.png b/dist/images/cryptos/ERG.png
diff --git a/dist/index.html b/dist/index.html
@@ -10,7 +10,7 @@
 	<link rel="stylesheet" href="css/index.css" />
 	<script src="js/header.js"></script>
 </head>
-<body class="bg-gray-800">
+<body class="bg-gray-900">
 
 	<div class="relative bg-gray-800">
 		<div class="relative max-w-7xl mx-auto py-8 px-4 sm:py-12 sm:px-6 lg:px-8">
@@ -51,6 +51,20 @@ <h2 class="text-3xl mt-12 text-white tracking-tight sm:text-4xl">Settings</h2>
 
 			<h2 class="text-xl mt-6 text-white tracking-tight sm:text-2xl">Exchange</h2>
 
+			<div class="max-w-md mt-3 flex flex-col">
+				<label for="fetch-exchange" class="block text-sm font-medium text-gray-300">Fetch prices from</label>
+				<select id="fetch-exchange" name="fetch-exchange" class="mt-1 block w-full pl-3 pr-10 py-2 text-base bg-gray-600 text-gray-300 border-gray-400 focus:outline-none sm:text-sm rounded-md">
+					<option value="1" selected>Binance</option>
+					<option value="4">Coinbase</option>
+					<option value="6">CoinCap</option>
+					<option value="3">CoinGecko</option>
+					<!--
+					<option value="2">KuCoin</option>
+					-->
+					<option value="5">Wazirx</option>
+				</select>
+			</div>
+
 			<div class="mt-3 flex items-center">
 				<button id="webSockets-btn" type="button" class="bg-gray-700 relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none" role="switch" aria-checked="false" aria-labelledby="webSockets">
 					<span id="webSockets-animation" aria-hidden="true" class="translate-x-0 pointer-events-none inline-block h-5 w-5 rounded-full bg-gray-100 shadow transform ring-0 transition ease-in-out duration-200"></span>
@@ -65,9 +79,9 @@ <h2 class="text-xl mt-6 text-white tracking-tight sm:text-2xl">Exchange</h2>
 				<select id="fetch-time" name="fetch-time" class="mt-1 block w-full pl-3 pr-10 py-2 text-base bg-gray-600 text-gray-300 border-gray-400 focus:outline-none sm:text-sm rounded-md">
 					<option value="1">1 second</option>
 					<option value="2">2 seconds</option>
-					<option value="3">3 seconds</option>
+					<option value="3" selected>3 seconds</option>
 					<option value="4">4 seconds</option>
-					<option value="5" selected>5 seconds</option>
+					<option value="5">5 seconds</option>
 					<option value="6">6 seconds</option>
 					<option value="7">7 seconds</option>
 					<option value="8">8 seconds</option>
@@ -116,6 +130,14 @@ <h2 class="text-xl mt-6 text-white tracking-tight sm:text-2xl">Graph</h2>
 			<button id="start-btn" type="button" class="inline-flex mt-6 items-center px-6 py-3 border border-transparent text-base font-medium rounded-md shadow-sm text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none">Monitor</button>
 		</div>
 	</div>
+
+	<footer class="bg-gray-900">
+		<div class="max-w-7xl mx-auto py-12 px-4 overflow-hidden sm:px-6 lg:px-8">
+			<p class="text-center text-base text-gray-400">
+				&copy; 2022 <a class="text-blue-400" target="_blank" href="https://rabbit-company.com">Rabbit Company LLC</a>, All rights reserved.</br>Data provided by <a class="text-blue-400" target="_blank" href="https://www.coingecko.com/">CoinGecko</a>
+			</p>
+		</div>
+	</footer>
 	<script src="js/default.js"></script>
 	<script src="js/index.js"></script>
 </body>

diff --git a/dist/js/header.js b/dist/js/header.js
@@ -14,5 +14,8 @@ document.addEventListener('keydown', async (e) => {
   if (e.key === "F11") {
     e.preventDefault();
     await appWindow.setFullscreen(!(await appWindow.isFullscreen()));
-  }
+  }else if(e.key === "Escape"){
+		e.preventDefault();
+		history.back();
+	}
 });