Elijah/convertor
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: ui remake with tailwind

Browse source
This commit is contained in:
C4illin 2024-09-09 17:38:03 +02:00
parent ed59cd7aa4
commit 22f823c535
16 changed files with 296 additions and 344 deletions
Download patch file Download diff file Expand all files Collapse all files

3
src/components/base.tsx
View file

@ -7,7 +7,6 @@ export const BaseHtml = ({
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title safe>{title}</title>
<link rel="stylesheet" href="/pico.lime.min.css" />
<link rel="stylesheet" href="/style.css" />
<link
rel="apple-touch-icon"
@ -28,6 +27,6 @@ export const BaseHtml = ({
/>
<link rel="manifest" href="/site.webmanifest" />
</head>
<body>{children}</body>
<body class="w-full bg-gray-900 text-gray-200">{children}</body>
</html>
);

45
src/components/header.tsx
View file

@ -5,44 +5,53 @@ export const Header = ({
let rightNav: JSX.Element;
if (loggedIn) {
rightNav = (
<ul>
<ul class="flex gap-4 ">
<li>
<a href="/history">History</a>
<a
class="text-lime-600 transition-all hover:text-lime-500 hover:underline"
href="/history">
History
</a>
</li>
<li>
<a href="/logoff">Logout</a>
<a
class="text-lime-600 transition-all hover:text-lime-500 hover:underline"
href="/logoff">
Logout
</a>
</li>
</ul>
);
} else {
rightNav = (
<ul>
<ul class="flex gap-4">
<li>
<a href="/login">Login</a>
<a
class="text-lime-600 transition-all hover:text-lime-500 hover:underline"
href="/login">
Login
</a>
</li>
{accountRegistration && (
{accountRegistration ? (
<li>
<a href="/register">Register</a>
<a
class="text-lime-600 transition-all hover:text-lime-500 hover:underline"
href="/register">
Register
</a>
</li>
)}
) : null}
</ul>
);
}
return (
<header class="container">
<nav>
<header class="w-full p-4">
<nav class="mx-auto flex max-w-4xl justify-between rounded bg-gray-900 p-4">
<ul>
<li>
<strong>
<a
href="/"
style={{
textDecoration: "none",
color: "inherit",
}}>
ConvertX
</a>
<a href="/">ConvertX</a>
</strong>
</li>
</ul>