fix(website): Some minor changes to the layout styling and added new …

…font to the logo

website/src/routes/+page.svelte

@@ -22,7 +22,7 @@
 <section
 	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 flex-col md:items-start items-center h-full mr-auto w-full md:px-6 ">
 		<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">

website/src/routes/Explainer.svelte

@@ -2,12 +2,12 @@
 	<div class="mb-4">
 		<button class="text-xs cursor-default border border-[#8FD3FE] rounded-2xl py-1 px-3">DendrETH Protocol</button>
 	</div>
-	<div class="container flex md:flex-row flex-col justify-between">
-		<h1 class="text-5xl mb-6 leading-tight mr-8 max-w-lg text-left">
+	<div class="flex md:flex-row flex-col justify-between">
+		<h1 class="text-5xl mb-6 leading-tight mr-24 max-w-lg lg:min-w-max text-left">
 			<span style="color: #8FD3FE;">Proof Of Consensus</span>
 		</h1>
 		<div class="">
-			<p class="mb-12 max-w-xl">
+			<p class="mb-12 lg:max-w-3xl  min-w-xl">
 				DendrETH generates validity proofs of Consensus specifications using **ZKP circuits**.
 				Proofs can be effectively verified in the targetted chains' execution environments. Using a
 				chain of merkle proofs (or other commitment schemes), the implemented smart contracts can be

website/src/routes/Footer.svelte

@@ -1,5 +1,5 @@
 <footer class="text-white">
-    <div class="flex md:flex-row flex-col px-4 container justify-between center mb-14 mt-8">
+    <div class="flex md:flex-row flex-col px-4 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 justify-self-end">
@@ -22,7 +22,7 @@
     <div class="border-t border-gray-500 my-4"></div>
     <div class="grid grid-cols-2 lg:grid-cols-7 md:gap-8 justify-between space-x-4 space-y-4 lg:space-y-0 mb-6">
         <span class="text-sm text-gray-500 hidden lg:block justify-self-start">
-            Copyright © 2019-2024<br />Metacraft Lab's Ltd
+            Copyright&nbsp;©&nbsp;2019-2024<br />Metacraft Lab's Ltd
         </span>
         <a href="#" class="text-sm text-white hover:text-gray-400">Cookie manager</a>
         <a href="#" class="text-sm text-white hover:text-gray-400">Terms of use</a>
@@ -35,7 +35,7 @@
     </div>
     <div class="px-4">
         <span class="text-sm text-gray-500 block lg:hidden mb-4">
-            Copyright © 2019-2024 Metacraft Lab's Ltd
+            Copyright&nbsp;©&nbsp;2019-2024 Metacraft Lab's Ltd
         </span>
         <span class="text-sm text-gray-500 block lg:hidden">
             Design by KRS

website/src/routes/Header.svelte

@@ -32,7 +32,7 @@
 <header>
 	<div>
 		<Navbar class="z-20 bg-gradient-to-b from-[#0B061C] to-[#1A1739] p-4" style="position: fixed;">
-			<div><a href="/" class="text-white text-2xl">DendrETH</a></div>
+			<div><a href="/" class="logo hover:no-underline">DENDRETH</a></div>
 			<div class="relative dropdown-menu">
 				<button on:click={toggleMenu} class="p-2 focus:outline-none md:hidden">
 					<div class="w-6 h-0.5 bg-white" />
@@ -81,4 +81,15 @@
 </header>
 
 <style>
+	@font-face {
+        font-family: 'NeutraDisplay';
+        src: url('$lib/fonts/NeutraDisplay/Neutra-Display-Bold.otf') format('opentype');
+    }
+
+	.logo {
+		font-family: 'NeutraDisplay';
+		font-weight: 500;
+		color: white;
+		size: 16px;
+	}
 </style>

website/src/routes/demo/+page.svelte

@@ -109,6 +109,7 @@
 					class="rounded-tr-xl font-bold py-2 w-full"
 					class:class-active={activeButton === 'tokens'}
 					class:class-inactive={activeButton !== 'tokens'}
+					disabled={activeButton === 'tokens'}
 					on:click={toggleButton}
 				>
 					<p>Tokens</p>
@@ -117,6 +118,7 @@
 					class="rounded-tl-xl font-bold py-2 w-full"
 					class:class-active={activeButton === 'nfts'}
 					class:class-inactive={activeButton !== 'nfts'}
+					disabled={activeButton === 'nfts'}
 					on:click={toggleButton}
 				>
 					<p>NFTs</p>
@@ -128,7 +130,7 @@
 						<div class="flex items-center">
 							<img src={ethImg} alt="ETH" class="w-auto mr-6" />
 							<div class="flex flex-col">
-								<span class="text-md">Ethereum</span>
+								<span class="text-lg">Ethereum</span>
 								<span class="value text-gray-400">1.020,53 $</span>
 							</div>
 						</div>
@@ -138,7 +140,7 @@
 						<div class="flex items-center">
 							<img src={btcImg} alt="BTC" class="w-auto mr-6" />
 							<div class="flex flex-col">
-								<span class="text-md">BTC</span>
+								<span class="text-lg">BTC</span>
 								<span class="value text-gray-400">26.654,53 $</span>
 							</div>
 						</div>
@@ -148,7 +150,7 @@
 						<div class="flex items-center">
 							<img src={bnbImg} alt="BNB" class="w-auto mr-6" />
 							<div class="flex flex-col">
-								<span class="text-md">BNB</span>
+								<span class="text-lg">BNB</span>
 								<span class="value text-gray-400">213,34 $</span>
 							</div>
 						</div>
@@ -158,7 +160,7 @@
 						<div class="flex items-center">
 							<img src={polkadotImg} alt="DOT" class="w-auto mr-6" />
 							<div class="flex flex-col">
-								<span class="text-md">Polkadot</span>
+								<span class="text-lg">Polkadot</span>
 								<span class="value text-gray-400">4,00 $</span>
 							</div>
 						</div>
@@ -176,7 +178,7 @@
 	}
 
 	.value {
-		font-size: 0.7rem;
+		font-size: 0.8rem;
 	}
 
 	.gradient-background {