alexandre/PaletteSwitcher
1
0
Fork 0
Code Issues 4 Pull Requests 9 Actions Packages Projects Releases Activity

Add header

Browse Source
This commit is contained in:
Alexandre Bruyant 2024-01-16 13:09:50 +01:00
parent 4abe4ab7e0
commit f3be0eb4ae
1 changed files with 22 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
palette-switcher-v2/src/Header.tsx
View File

@ -1,26 +1,25 @@
import { useLocation } from "@solidjs/router"; import type { Component } from "solid-js";
import type { Component } from "solid-js"
const Header: Component = () => (
<header>
type HeaderItemProps = { <nav class="bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800">
text: string; <div class="flex flex-wrap justify-between items-center mx-auto max-w-screen-xl">
target: string; <a href="/" class="flex items-center">
active: boolean; <span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">
} Palette Switcher
</span>
const Header: Component = () => <header> </a>
<nav class="bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800"> <div class="flex items-center lg:order-2">
<div class="flex flex-wrap justify-between items-center mx-auto max-w-screen-xl"> <a
<a href="/" class="flex items-center"> href="/about"
<span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Palette Switcher</span> class="text-gray-800 dark:text-white hover:bg-gray-50 focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 dark:hover:bg-gray-700 focus:outline-none dark:focus:ring-gray-800"
</a> >
<div class="flex items-center lg:order-2"> About
<a href="/about" class="text-gray-800 dark:text-white hover:bg-gray-50 focus:ring-4 focus:ring-gray-300 font-medium rounded-lg text-sm px-4 lg:px-5 py-2 lg:py-2.5 mr-2 dark:hover:bg-gray-700 focus:outline-none dark:focus:ring-gray-800">About</a> </a>
</div>
</div> </div>
</div> </nav>
</nav> </header>
</header> );
export default Header; export default Header;