Gitlab-Migration/rhein-sw-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor and update navigation and constants

Browse Source 
- Refactor code for consistency in formatting and styling.
- Update `navLinks` to revise URLs and labels for improved clarity.
- Adjust button text in `DesktopNav` from "Portal" to "Kontakt".
This commit is contained in:
Thatsaphorn
2025-04-08 22:39:16 +02:00
parent 63062734d2
commit 2d89fcfbb8
3 changed files with 22 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
components/Navbar/MobileNav.tsx
View File

@@ -1,19 +1,22 @@
import {navLinks} from "@/constant/Constant";
import { navLinks } from "@/constant/Constant";
import Link from "next/link";
import React, {useContext} from "react";
import {CgClose} from "react-icons/cg";
import {ThemeContext} from "@/components/provider/ThemeProvider";
import {themeColors} from "@/components/Helper/ThemeColors";
import React, { useContext } from "react";
import { CgClose } from "react-icons/cg";
import { ThemeContext } from "@/components/provider/ThemeProvider";
import { themeColors } from "@/components/Helper/ThemeColors";
type Props = {
showNav: boolean;
closeNav: () => void;
};
const MobileNav = ({closeNav, showNav}: Props) => {
const MobileNav = ({ closeNav, showNav }: Props) => {
const navOpen = showNav ? "translate-y-0 opacity-100" : "-translate-y-20 opacity-0 pointer-events-none";
const {theme, toggleTheme} = useContext(ThemeContext);
const { theme, toggleTheme } = useContext(ThemeContext);
const colors = themeColors[theme];
const cleanDarkBackground = theme === "dark" ? "#2A2A2A" : colors.primaryBg;
return (
<div className="lg:hidden">
{/* overlay background */}
@@ -27,17 +30,14 @@ const MobileNav = ({closeNav, showNav}: Props) => {
{/* nav menu */}
<div
className={`fixed top-0 left-0 w-full z-[10006] transform ${navOpen} transition-all duration-500 ease-in-out text-[var(--primary-text)] shadow-md rounded-b-2xl`}
style={{
backgroundColor: theme === "dark" ? "#2A2A2A" : "#ffffff",
color: theme === "dark" ? "#f5f5f5" : "#1a1a1a"
}}
style={{ backgroundColor: theme === "dark" ? "#2A2A2A" : "#ffffff", color: theme === "dark" ? "#f5f5f5" : "#1a1a1a" }}
>
<div className="flex flex-col items-center justify-center py-8 space-y-4 px-4 relative">
{/* Close icon */}
<CgClose
onClick={closeNav}
className="absolute top-4 right-6 sm:right-8 sm:w-7 sm:h-7 w-6 h-6 cursor-pointer p-1"
style={{color: colors.primaryText}}
style={{ color: colors.primaryText }}
/>
{navLinks.map((link) => (
@@ -52,7 +52,7 @@ const MobileNav = ({closeNav, showNav}: Props) => {
<button
onClick={toggleTheme}
className="mt-4 w-8 h-8 flex items-center justify-center rounded-full border border-gray-400 transition-all duration-300"
style={{backgroundColor: colors.secondaryBg, color: colors.primaryText}}
style={{ backgroundColor: colors.secondaryBg, color: colors.primaryText }}
>
{theme === "dark" ? "🌙" : "☀️"}
</button>