mirror of
https://github.com/FranP-code/create-better-t-stack.git
synced 2025-10-12 23:52:15 +00:00
fix styling move navbar from root & fix bugs
This commit is contained in:
@@ -18,7 +18,7 @@ export function CommandDisplay({ command }: CommandDisplayProps) {
|
||||
|
||||
return (
|
||||
<div className="relative group">
|
||||
<div className="bg-gray-950/90 border border-gray-800 rounded-lg p-4 font-mono text-sm text-gray-300 overflow-x-auto">
|
||||
<div className="bg-gray-950/20 backdrop-blur-xl border border-gray-800 rounded-lg p-4 font-mono text-sm text-gray-300 overflow-x-auto">
|
||||
<button
|
||||
type="button"
|
||||
onClick={copyToClipboard}
|
||||
|
||||
@@ -39,7 +39,7 @@ const Navbar = () => {
|
||||
|
||||
return (
|
||||
<nav
|
||||
className={`fixed top-0 left-0 z-50 w-screen px-8 py-5 flex items-center justify-between transition-all duration-300 ${
|
||||
className={`fixed top-0 left-0 z-[100] w-screen px-8 py-5 flex items-center justify-between transition-all duration-300 ${
|
||||
scrolled
|
||||
? "bg-transparent border-transparent"
|
||||
: "bg-black/10 backdrop-blur-xl border-b border-white/10"
|
||||
|
||||
@@ -18,8 +18,6 @@ const TerminalDisplay = () => {
|
||||
║ ██║ ███████║ ██║ ██║ ██║╚██████╗██║ ██╗ ║
|
||||
║ ╚═╝ ╚══════╝ ╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═╝ ║
|
||||
║ ║
|
||||
║ The Modern Full-Stack Framework ║
|
||||
║ ║
|
||||
╚════════════════════════════════════════════════════════════╝
|
||||
`;
|
||||
|
||||
|
||||
@@ -2,6 +2,7 @@ import { baseOptions } from "@/app/layout.config";
|
||||
import { HomeLayout } from "fumadocs-ui/layouts/home";
|
||||
import type { Metadata } from "next";
|
||||
import type { ReactNode } from "react";
|
||||
import Navbar from "./_components/Navbar";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Better-T-Stack",
|
||||
@@ -9,5 +10,10 @@ export const metadata: Metadata = {
|
||||
};
|
||||
|
||||
export default function Layout({ children }: { children: ReactNode }) {
|
||||
return <HomeLayout {...baseOptions}>{children}</HomeLayout>;
|
||||
return (
|
||||
<HomeLayout {...baseOptions}>
|
||||
<Navbar />
|
||||
{children}
|
||||
</HomeLayout>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@ const poppins = Poppins({
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<main
|
||||
className="min-h-screen flex flex-col items-center justify-start p-8"
|
||||
className="min-h-screen flex flex-col items-center justify-start p-8 pt-20"
|
||||
style={poppins.style}
|
||||
>
|
||||
<BackgroundGradients />
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
import "./global.css";
|
||||
import { RootProvider } from "fumadocs-ui/provider";
|
||||
import { Poppins } from "next/font/google";
|
||||
import { type ReactNode, Suspense } from "react";
|
||||
import Navbar from "./(home)/_components/Navbar";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
const poppins = Poppins({
|
||||
subsets: ["latin"],
|
||||
@@ -20,20 +19,11 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Navbar />
|
||||
<div className="relative z-10 bg-zinc-50 dark:bg-zinc-950 pt-20 transition-colors duration-300 overflow-hidden">
|
||||
<Suspense fallback={<LoadingSpinner />}>{children}</Suspense>
|
||||
<div className="relative z-10 bg-zinc-50 dark:bg-zinc-950 transition-colors duration-300 overflow-hidden">
|
||||
{children}
|
||||
</div>
|
||||
</RootProvider>
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
function LoadingSpinner() {
|
||||
return (
|
||||
<div className="flex items-center justify-center min-h-[200px]">
|
||||
<div className="w-8 h-8 border-4 border-zinc-300 border-t-zinc-800 rounded-full animate-spin" />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user