feat: add logo

This commit is contained in:
mehedi-hasan 2024-04-14 21:09:08 +06:00
parent 56303de549
commit d26c214047
4 changed files with 34 additions and 4 deletions

View File

@ -5,7 +5,7 @@ import { buttonVariants } from "@/components/ui/button";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Sign In", title: "Sign In | Skilld",
description: "Sign In to start your journey with Skilld.", description: "Sign In to start your journey with Skilld.",
}; };

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

After

Width:  |  Height:  |  Size: 1.9 KiB

View File

@ -3,13 +3,29 @@ import { cn } from "@/lib/utils";
import { MobileSidebar } from "./mobile-sidebar"; import { MobileSidebar } from "./mobile-sidebar";
import { UserNav } from "./user-nav"; import { UserNav } from "./user-nav";
import Link from "next/link"; import Link from "next/link";
import Image from "next/image";
export default function Header() { export default function Header() {
return ( return (
<div className="fixed top-0 left-0 right-0 supports-backdrop-blur:bg-background/60 border-b bg-background/95 backdrop-blur z-20"> <div className="fixed top-0 left-0 right-0 supports-backdrop-blur:bg-background/60 border-b bg-background/95 backdrop-blur z-20">
<nav className="h-14 flex items-center justify-between px-4"> <nav className="h-14 flex items-center justify-between px-4">
<div className="hidden lg:block"> <div className="hidden lg:block">
<Link href={"/dashboard"}>Skilld</Link> <Link href="/dashboard" className="inline-block w-fit">
<Image
src="/Skilld AI Logos/Skilld Logo-colour on black.png"
alt="Skilld Logo"
width={100}
height={30}
className="hidden dark:block h-[25px] w-[80px] md:w-[100px] md:h-[30px] object-contain"
/>
<Image
src="/Skilld AI Logos/Skilld Logo-colour.png"
alt="Skilld Logo"
width={100}
height={30}
className="dark:hidden h-[25px] w-[80px] md:w-[100px] md:h-[30px] object-contain"
/>
</Link>
</div> </div>
<div className={cn("block lg:!hidden")}> <div className={cn("block lg:!hidden")}>
<MobileSidebar /> <MobileSidebar />

View File

@ -1,4 +1,5 @@
import ThemeToggle from "@/components/layout/ThemeToggle/theme-toggle"; import ThemeToggle from "@/components/layout/ThemeToggle/theme-toggle";
import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import React from "react"; import React from "react";
@ -6,8 +7,21 @@ const Header = () => {
return ( return (
<header className="border-b px-4 h-min"> <header className="border-b px-4 h-min">
<nav className="flex justify-between items-center max-w-[1440px] mx-auto py-2"> <nav className="flex justify-between items-center max-w-[1440px] mx-auto py-2">
<Link href="/"> <Link href="/dashboard" className="inline-block w-fit">
<h2>Skilld</h2> <Image
src="/Skilld AI Logos/Skilld Logo-colour on black.png"
alt="Skilld Logo"
width={100}
height={30}
className="hidden dark:block h-[25px] w-[80px] md:w-[100px] md:h-[30px] object-contain"
/>
<Image
src="/Skilld AI Logos/Skilld Logo-colour.png"
alt="Skilld Logo"
width={100}
height={30}
className="dark:hidden h-[25px] w-[80px] md:w-[100px] md:h-[30px] object-contain"
/>
</Link> </Link>
<div className="flex items-center gap-8"> <div className="flex items-center gap-8">