feat(website): Minor changes for styling, footer button color change …

…and explorer now shows all available pages
metacraft-labs · Feb 5, 2024 · 7e891b8 · 7e891b8
1 parent f121352
commit 7e891b8
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 13 deletions.
diff --git a/website/src/routes/+page.svelte b/website/src/routes/+page.svelte
@@ -23,8 +23,8 @@
 	class="bg-gradient-to-b from-[#1A1739] via-[#363571] to-[#A8C5EB] text-white flex justify-between items-center center"
 >
 	<div class="container flex flex-col md:items-start items-center h-full md:px-6 ">
-		<div class="flex lg:flex-row flex-col items-center justify-between space-x-16">
-			<div class="flex flex-col">
+		<div class="flex lg:flex-row flex-col items-center justify-between lg:space-x-16 w-full">
+			<div class="flex flex-col max-w-2xl">
 				<h1 class="text-start font-bold mb-4 leading-tight">
 					Scaling Trust,<br> <span class="spanh1" style="color: #8FD3FE;">the Interchain Interoperability Layer</span>
 				</h1>
@@ -33,7 +33,7 @@
 					<span style="font-family: 'Inter-Bold'">trust-minimized, censorship resistant, decentralized,</span> and highly secure smart contract solution.
 				</p>
 			</div>
-			<img src={main} alt="Descriptive Text" class="max-w-xs max-w-sm pb-10 block" style="opacity: 50; z-index: 1;" />	
+			<img src={main} alt="main" class="max-w-xs sm:max-w-sm pb-10" style="opacity: 50; z-index: 1;" />	
 		</div>
 		<div class="flex lg:flex-row flex-col space-x-4 lg:w-auto w-full">
 			<Button
@@ -84,7 +84,7 @@
 	}
 	@media (max-width: 1024px) {
 		h1 {
-			font-size: 3rem;
+			font-size: 2.7rem;
 		}
 	}
 

diff --git a/website/src/routes/Footer.svelte b/website/src/routes/Footer.svelte
@@ -2,15 +2,15 @@
     <div class="flex md:flex-row flex-col px-4 container justify-between center mb-14 mt-8">
         <div class="text-white text-2xl pb-6">DendrETH</div>
         <div  class="flex flex-col md:flex-row md:space-x-12" style="align-items: top;">
-            <div class="flex flex-col space-y-6 mb-5">
+            <div class="flex flex-col space-y-6 mb-5 justify-self-end">
                 <h2 class="text-lg font-semibold">Products</h2>
                 <a href="/" class="text-sm text-white hover:text-gray-300">DendrETH</a>
                 <a href="#" class="text-sm text-white hover:text-gray-300">Dashboard</a>
                 <a href="/demo" class="text-sm text-white hover:text-gray-300">DendrETH Wallet Demo</a>
             </div>
             <div class="flex flex-col space-y-6 mb-5">
                 <h2 class="text-lg font-bold">Company</h2>
-                <a href="#" class="text-sm text-white hover:text-gray-300 hover:no-underline">Careers <span class="bg-[#ABC57D] text-white rounded-md px-2 py-1.5 hover:underline">We're hiring</span></a>
+                <a href="#" class="text-sm text-white hover:text-gray-300 hover:no-underline">Careers <span class="bg-[#363571] text-white rounded-md px-2 py-1.5 hover:underline">We're hiring</span></a>
             </div>
             <div class="flex flex-col space-y-6">
                 <h2 class="text-lg font-bold">Developers</h2>

diff --git a/website/src/routes/demo/+page.svelte b/website/src/routes/demo/+page.svelte
@@ -127,7 +127,7 @@
 					<li class="flex justify-between items-top py-4">
 						<div class="flex items-center">
 							<img src={ethImg} alt="ETH" class="w-auto mr-6" />
-							<div class="flex flex-col space-y-1">
+							<div class="flex flex-col">
 								<span class="text-md">Ethereum</span>
 								<span class="value text-gray-400">1.020,53 $</span>
 							</div>
@@ -137,7 +137,7 @@
 					<li class="flex justify-between items-top py-4">
 						<div class="flex items-center">
 							<img src={btcImg} alt="BTC" class="w-auto mr-6" />
-							<div class="flex flex-col space-y-1">
+							<div class="flex flex-col">
 								<span class="text-md">BTC</span>
 								<span class="value text-gray-400">26.654,53 $</span>
 							</div>
@@ -147,7 +147,7 @@
 					<li class="flex justify-between items-top py-4">
 						<div class="flex items-center">
 							<img src={bnbImg} alt="BNB" class="w-auto mr-6" />
-							<div class="flex flex-col space-y-1">
+							<div class="flex flex-col">
 								<span class="text-md">BNB</span>
 								<span class="value text-gray-400">213,34 $</span>
 							</div>
@@ -157,7 +157,7 @@
 					<li class="flex justify-between items-top py-4">
 						<div class="flex items-center">
 							<img src={polkadotImg} alt="DOT" class="w-auto mr-6" />
-							<div class="flex flex-col space-y-1">
+							<div class="flex flex-col">
 								<span class="text-md">Polkadot</span>
 								<span class="value text-gray-400">4,00 $</span>
 							</div>
@@ -176,7 +176,7 @@
 	}
 
 	.value {
-		font-size: 0.6rem;
+		font-size: 0.7rem;
 	}
 
 	.gradient-background {

diff --git a/website/src/routes/explorer/+page.svelte b/website/src/routes/explorer/+page.svelte
@@ -121,7 +121,7 @@
 	</TableSearch>
 	<div class="flex flex-row justify-end items-center">
 		<div class="text-white mr-2">
-			Page {currentPage}
+			Page {currentPage} of {totalPages}
 		</div>
 		<button
 			class="rounded-md bg-[#121316] text-white mx-1 p-1 px-4 border border-white pagination-button hover:bg-[#393939]"

diff --git a/website/src/routes/explorer/[nonce]/+page.svelte b/website/src/routes/explorer/[nonce]/+page.svelte
@@ -162,7 +162,7 @@
 
 <style>
 	.center-details {
-		padding: 30px 5% 70px 5%;
+		padding: 30px 10% 70px 10%;
 	}
 	h2 {
 		font-family: 'ChakraPetch';