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

Added "Services" page & refactor layout structure

Browse Source 
- Introduced a new Services component with basic setup.
- Updated layout files to ensure consistent global styling references.
- Enhanced Navbar with pathname detection for active link styling.
- Fixed navigation link URL for "Leistungen" in constants.
This commit is contained in:
Thatsaphorn
2025-04-08 22:57:58 +02:00
parent 493d5bcfa2
commit 6535bf37ec
8 changed files with 58 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/(root)/layout.tsx
View File

@@ -1,5 +1,5 @@
import type {Metadata} from "next"; import type {Metadata} from "next";
import "./globals.css"; import "../globals.css";
import Nav from "@/components/Navbar/Nav"; import Nav from "@/components/Navbar/Nav";
import Footer from "@/components/Home/Footer/Footer"; import Footer from "@/components/Home/Footer/Footer";

2
app/contact/layout.tsx
View File

@@ -1,5 +1,5 @@
import type {Metadata} from "next"; import type {Metadata} from "next";
import "../(root)/globals.css"; import "../globals.css";
import Nav from "@/components/Navbar/Nav"; import Nav from "@/components/Navbar/Nav";
import Footer from "@/components/Home/Footer/Footer"; import Footer from "@/components/Home/Footer/Footer";

0
app/(root)/globals.css → app/globals.css
View File

2
app/legal/layout.tsx
View File

@@ -1,5 +1,5 @@
import type {Metadata} from "next"; import type {Metadata} from "next";
import "../(root)/globals.css"; import "../globals.css";
import Nav from "@/components/Navbar/Nav"; import Nav from "@/components/Navbar/Nav";
import Footer from "@/components/Home/Footer/Footer"; import Footer from "@/components/Home/Footer/Footer";

35
app/services/layout.tsx Normal file
View File

@@ -0,0 +1,35 @@
import type {Metadata} from "next";
import "../globals.css";
import Nav from "@/components/Navbar/Nav";
import Footer from "@/components/Home/Footer/Footer";
import {ThemeProvider} from "@/components/provider/ThemeProvider";
import React from "react";
import {cookies} from "next/headers";
export const metadata: Metadata = {
title: "Rhein Software",
description: "Rhein Software Development",
};
export default async function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>) {
const cookieStore = await cookies();
const theme = cookieStore.get("theme")?.value === "dark" ? "dark" : "light";
return (
<html lang="de" data-theme={theme}>
<head/>
<body className="antialiased" style={{backgroundColor: "var(--primary-bg)"}}>
<ThemeProvider>
<Nav/>
{children}
<Footer/>
</ThemeProvider>
</body>
</html>
);
}

12
app/services/page.tsx Normal file
View File

@@ -0,0 +1,12 @@
import React from 'react';
import Contact from "@/components/Contact/Contact";
const ContactPage = () => {
return (
<div>
<Contact/>
</div>
);
};
export default ContactPage;

9
components/Navbar/DesktopNav.tsx
View File

@@ -1,5 +1,6 @@
"use client"; "use client";
import {usePathname} from "next/navigation";
import {navLinks} from "@/constant/Constant"; import {navLinks} from "@/constant/Constant";
import Link from "next/link"; import Link from "next/link";
import React, {useContext, useEffect, useState} from "react"; import React, {useContext, useEffect, useState} from "react";
@@ -18,6 +19,7 @@ const Nav = ({openNav}: Props) => {
const [buttonSize, setButtonSize] = useState("md:px-6 md:py-2 px-4 py-1 text-sm"); const [buttonSize, setButtonSize] = useState("md:px-6 md:py-2 px-4 py-1 text-sm");
const {theme, toggleTheme} = useContext(ThemeContext); const {theme, toggleTheme} = useContext(ThemeContext);
const colors = themeColors[theme]; const colors = themeColors[theme];
const pathname = usePathname();
const navColorClass = theme === "dark" || !navBg ? "text-white" : "text-black"; const navColorClass = theme === "dark" || !navBg ? "text-white" : "text-black";
@@ -61,8 +63,11 @@ const Nav = ({openNav}: Props) => {
{navLinks.map((link) => ( {navLinks.map((link) => (
<Link href={link.url} key={link.id}> <Link href={link.url} key={link.id}>
<p <p
className={`nav_link ${contentSize} ${navColorClass} transition-all duration-300 ease-in-out uppercase font-semibold`} className={`nav_link ${contentSize} uppercase transition-all duration-300 ease-in-out ${
> pathname === link.url
? "text-white font-bold"
: "text-gray-300 font-medium"
}`}>
{link.label} {link.label}
</p> </p>
</Link> </Link>

2
constant/Constant.ts
View File

@@ -11,7 +11,7 @@ export const navLinks = [
}, },
{ {
id: 3, id: 3,
url: '#', url: '/services',
label: 'Leistungen', label: 'Leistungen',
} }
]; ];