Added homepage

DAQEM · Jan 16, 2024 · 0fb05ce · 0fb05ce
1 parent e062faf
commit 0fb05ce
Show file tree

Hide file tree

Showing 6 changed files with 376 additions and 60 deletions.
diff --git a/Services/UserWebApp/src/app.css b/Services/UserWebApp/src/app.css
@@ -42,6 +42,10 @@ img.full-width {
 	object-fit: cover;
 }
 
+.full-width > .breakout {
+	grid-column: breakout;
+}
+
 .apexcharts-legend-text {
 	@apply dark:!text-neutral-200 !text-neutral-800;
 }
diff --git a/Services/UserWebApp/src/lib/components/Footer.svelte b/Services/UserWebApp/src/lib/components/Footer.svelte
@@ -1,15 +1,7 @@
 <script>
 	import logo_wide from '$lib/images/logo_wide.png';
 	import logo_wide_white from '$lib/images/logo_wide_white.png';
-	import {
-		Footer,
-		FooterBrand,
-		FooterCopyright,
-		FooterIcon,
-		FooterLink,
-		FooterLinkGroup
-	} from 'flowbite-svelte';
-	import { DiscordSolid, FacebookSolid, GithubSolid, TwitterSolid } from 'flowbite-svelte-icons';
+	import { Footer, FooterBrand, FooterCopyright } from 'flowbite-svelte';
 </script>
 
 <Footer footerType="socialmedia">
@@ -18,58 +10,9 @@
 			<FooterBrand href="/" src={logo_wide} alt="Netmon Logo" aClass="dark:hidden block" />
 			<FooterBrand href="/" src={logo_wide_white} alt="Netmon Logo" aClass="hidden dark:block" />
 		</div>
-		<div class="grid grid-cols-2 gap-8 sm:gap-6 sm:grid-cols-3">
-			<div>
-				<h2 class="mb-6 text-sm font-semibold text-gray-900 uppercase dark:text-white">
-					Resources
-				</h2>
-				<FooterLinkGroup>
-					<FooterLink liClass="mb-4" href="/">Flowbite</FooterLink>
-					<FooterLink liClass="mb-4" href="/">Tailwind CSS</FooterLink>
-				</FooterLinkGroup>
-			</div>
-			<div>
-				<h2 class="mb-6 text-sm font-semibold uppercase text-gray-900 dark:text-white">
-					Follow us
-				</h2>
-				<FooterLinkGroup>
-					<FooterLink liClass="mb-4" href="/">GitHub</FooterLink>
-					<FooterLink liClass="mb-4" href="/">Discord</FooterLink>
-				</FooterLinkGroup>
-			</div>
-			<div>
-				<h2 class="mb-6 text-sm font-semibold uppercase text-gray-900 dark:text-white">Legal</h2>
-				<FooterLinkGroup>
-					<FooterLink liClass="mb-4" href="/">Privacy Policy</FooterLink>
-					<FooterLink liClass="mb-4" href="/">Terms & Conditions</FooterLink>
-				</FooterLinkGroup>
-			</div>
-		</div>
 	</div>
 	<hr class="my-6 border-gray-200 sm:mx-auto dark:border-gray-700 lg:my-8" />
 	<div class="sm:flex sm:items-center sm:justify-between">
 		<FooterCopyright href="/" by="Netmon" />
-		<div class="flex mt-4 space-x-6 sm:justify-center sm:mt-0">
-			<FooterIcon href="/">
-				<FacebookSolid
-					class="w-4 h-4 text-gray-500 dark:text-gray-500 hover:text-gray-900 dark:hover:text-white"
-				/>
-			</FooterIcon>
-			<FooterIcon href="/">
-				<DiscordSolid
-					class="w-4 h-4 text-gray-500 dark:text-gray-500 hover:text-gray-900 dark:hover:text-white"
-				/>
-			</FooterIcon>
-			<FooterIcon href="/">
-				<TwitterSolid
-					class="w-4 h-4 text-gray-500 dark:text-gray-500 hover:text-gray-900 dark:hover:text-white"
-				/>
-			</FooterIcon>
-			<FooterIcon href="/">
-				<GithubSolid
-					class="w-4 h-4 text-gray-500 dark:text-gray-500 hover:text-gray-900 dark:hover:text-white"
-				/>
-			</FooterIcon>
-		</div>
 	</div>
 </Footer>
diff --git a/Services/UserWebApp/src/lib/components/Navbar.svelte b/Services/UserWebApp/src/lib/components/Navbar.svelte
@@ -51,7 +51,7 @@
 			<DropdownItem href="/logout">Sign out</DropdownItem>
 		</Dropdown>
 		<NavUl>
-			<NavLi href="/device">Devices</NavLi>
+			<NavLi href="/device" class="text-lg">Devices</NavLi>
 		</NavUl>
 	{:else}
 		<Button href="/login">Login</Button>

diff --git a/Services/UserWebApp/src/lib/components/chart/ChartDiskUsage.svelte b/Services/UserWebApp/src/lib/components/chart/ChartDiskUsage.svelte
@@ -107,6 +107,9 @@
 			},
 			toolbar: {
 				show: true
+			},
+			animations: {
+				enabled: false
 			}
 		},
 		tooltip: {

diff --git a/Services/UserWebApp/src/lib/components/chart/ChartInterfaceUsage.svelte b/Services/UserWebApp/src/lib/components/chart/ChartInterfaceUsage.svelte
@@ -115,6 +115,9 @@
 				stacked: true,
 				toolbar: {
 					show: true
+				},
+				animations: {
+					enabled: false
 				}
 			},
 			plotOptions: {