From b4884e7a657e64842ee74e07f302acc3868e12dc Mon Sep 17 00:00:00 2001
From: Harald Mack <harald.mack@protonmail.com>
Date: Wed, 21 Aug 2024 15:12:56 +0200
Subject: [PATCH] work on styling

---
 src/lib/components/AbstractContent.svelte     | 44 +++++++++----------
 .../Navigation/FunctionalIcon.svelte          |  2 +-
 2 files changed, 22 insertions(+), 24 deletions(-)

diff --git a/src/lib/components/AbstractContent.svelte b/src/lib/components/AbstractContent.svelte
index 08f0ef14..7b3421b6 100644
--- a/src/lib/components/AbstractContent.svelte
+++ b/src/lib/components/AbstractContent.svelte
@@ -34,31 +34,29 @@
 </script>
 
 <!-- Top element: basic navigation-->
-<Navbar class="overflow-x-auto whitespace-nowrap">
-	<div class="flex flex-nowrap items-center space-x-4 rtl:space-x-reverse">
-		<NavBrand href="/">
-			<img src={logo_light} class="block h-16 dark:hidden" alt="MONDEY Logo" />
-			<img src={logo_dark} class="hidden h-16 dark:block" alt="MONDEY Logo" />
-		</NavBrand>
-		<NavHamburger />
-		<NavUl ulClass="flex flex-row space-x-4 rtl:space-x-reverse md:text-lg md:font-medium ml-auto">
-			<NavLi href="/" active={true}>Home</NavLi>
-			<NavLi href="/">Aktuelles</NavLi>
-			<NavLi href="/">Downloads</NavLi>
-			<NavLi href="/">Kontakt</NavLi>
+<Navbar>
+	<NavBrand href="/">
+		<img src={logo_light} class="block h-16 dark:hidden" alt="MONDEY Logo" />
+		<img src={logo_dark} class="hidden h-16 dark:block" alt="MONDEY Logo" />
+	</NavBrand>
+	<NavHamburger />
+	<NavUl ulClass="flex space-x-4 text-lg ">
+		<NavLi href="/" active={true}>Home</NavLi>
+		<NavLi href="/">Aktuelles</NavLi>
+		<NavLi href="/">Downloads</NavLi>
+		<NavLi href="/">Kontakt</NavLi>
 
-			<FunctionalIcon tooltip={'Darkmode ein- oder ausschalten'}>
-				<DarkMode class="apply-icon-style">
-					<MoonSolid slot="darkIcon" />
-					<SunSolid slot="lightIcon" />
-				</DarkMode>
-			</FunctionalIcon>
+		<FunctionalIcon tooltip={'Darkmode ein- oder ausschalten'}>
+			<DarkMode class="apply-icon-style">
+				<MoonSolid slot="darkIcon" />
+				<SunSolid slot="lightIcon" />
+			</DarkMode>
+		</FunctionalIcon>
 
-			<FunctionalIcon tooltip={'Registrieren oder einloggen'}>
-				<Avatar rounded border class="apply-icon-style" />
-			</FunctionalIcon>
-		</NavUl>
-	</div>
+		<FunctionalIcon tooltip={'Registrieren oder einloggen'}>
+			<Avatar rounded class="apply-icon-style" />
+		</FunctionalIcon>
+	</NavUl>
 </Navbar>
 
 <!--Page content goes here-->
diff --git a/src/lib/components/Navigation/FunctionalIcon.svelte b/src/lib/components/Navigation/FunctionalIcon.svelte
index dce67485..bc30f5f0 100644
--- a/src/lib/components/Navigation/FunctionalIcon.svelte
+++ b/src/lib/components/Navigation/FunctionalIcon.svelte
@@ -14,7 +14,7 @@
 	}
 
 	:global(.apply-icon-style) {
-		@apply rounded-lg p-2 text-xl text-gray-500 transition-colors;
+		@apply rounded-lg p-2 text-xl text-gray-500;
 	}
 
 	:global(.apply-icon-style:hover) {