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

29
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 = {
text: string;
target: string;
active: boolean;
}
const Header: Component = () => <header>
<nav class="bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800"> <nav class="bg-white border-gray-200 px-4 lg:px-6 py-2.5 dark:bg-gray-800">
<div class="flex flex-wrap justify-between items-center mx-auto max-w-screen-xl"> <div class="flex flex-wrap justify-between items-center mx-auto max-w-screen-xl">
<a href="/" class="flex items-center"> <a href="/" class="flex items-center">
<span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">Palette Switcher</span> <span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">
Palette Switcher
</span>
</a> </a>
<div class="flex items-center lg:order-2"> <div class="flex items-center lg:order-2">
<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
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>
</div> </div>
</div> </div>
</nav> </nav>
</header> </header>
);
export default Header; export default Header;