halfPage/src/components/navbar/index.tsx
wont-stream e8e924b595
All checks were successful
Code quality checks / biome (push) Successful in 8s
auto-lint
2025-04-10 19:27:24 -04:00

43 lines
1 KiB
TypeScript

import { ChevronLeft, ChevronRight } from "lucide-preact";
import { useState } from "preact/hooks";
export default () => {
const [wttrDesc, setWttrDesc] = useState<string>("Loading...");
fetch(
`https://wttr.in/${localStorage.getItem("location") || ""}?format=%t%20with%20%C%c&m`,
)
.then((res) => res.text())
.then((desc) => {
setWttrDesc(desc.trim());
});
return (
<>
<nav
class="navbar shadow fixed-top"
style="background-color: var(--bs-content-bg); border-bottom: var(--bs-border-width) solid var(--bs-content-border-color);"
>
<div class="container-fluid">
<div class="navbar-brand">{wttrDesc}</div>
<div class="d-flex hstack gap-2">
<button
type="button"
class="btn btn-outline-light btn-sm"
onClick={history.back}
>
<ChevronLeft size={20} />
</button>
<button
type="button"
class="btn btn-outline-light btn-sm"
onClick={history.forward}
>
<ChevronRight size={20} />
</button>
</div>
</div>
</nav>
</>
);
};