Add neo-brutalist landing page
Title 'Sis' in nb-font-heading1, tagline 'For chores and stuff' Warm cream background, centered nb-box layout
This commit is contained in:
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
body {
|
body {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
|
background: #fff9e6;
|
||||||
}
|
}
|
||||||
|
|
||||||
#app {
|
#app {
|
||||||
|
|||||||
@@ -1,34 +1,15 @@
|
|||||||
import m, { Vnode } from "mithril";
|
import m, { Vnode } from "mithril";
|
||||||
|
|
||||||
import { checkHealth } from "../api";
|
|
||||||
|
|
||||||
interface AppAttrs {}
|
interface AppAttrs {}
|
||||||
|
|
||||||
interface AppState {
|
interface AppState {}
|
||||||
health: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const App: m.Component<AppAttrs, AppState> = {
|
export const App: m.Component<AppAttrs, AppState> = {
|
||||||
oninit(vnode: Vnode<AppAttrs, AppState>) {
|
view(_vnode: Vnode<AppAttrs, AppState>) {
|
||||||
vnode.state.health = "loading...";
|
return m(".nb-container", { style: { maxWidth: "640px", margin: "0 auto" } }, [
|
||||||
checkHealth()
|
m(".nb-box", { style: { marginTop: "4rem", textAlign: "center", padding: "3rem 2rem" } }, [
|
||||||
.then((msg) => {
|
m("h1", { class: "nb-font-heading1" }, "Sis"),
|
||||||
vnode.state.health = msg;
|
m("p", { class: "nb-font-heading2", style: { marginTop: "1rem", opacity: "0.7" } }, "For chores and stuff"),
|
||||||
m.redraw();
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
vnode.state.health = "error: " + String(err);
|
|
||||||
m.redraw();
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
view(vnode: Vnode<AppAttrs, AppState>) {
|
|
||||||
return m("main.container", { style: { maxWidth: "720px", margin: "2rem auto" } }, [
|
|
||||||
m("h1", "Sis"),
|
|
||||||
m("p", "Shared household chore tracker."),
|
|
||||||
m("p", [
|
|
||||||
m("strong", "API status: "),
|
|
||||||
m("span", vnode.state.health),
|
|
||||||
]),
|
]),
|
||||||
]);
|
]);
|
||||||
},
|
},
|
||||||
|
|||||||
Reference in New Issue
Block a user