approaching a decent hlm skeleton
This commit is contained in:
parent
48a39b1a08
commit
ca9fd28ebc
1 changed files with 25 additions and 5 deletions
|
@ -1,11 +1,20 @@
|
||||||
import { Main, render_and_copy } from "./common.tsx";
|
import { EggbugImg, Main, render_and_copy } from "./common.tsx";
|
||||||
import { ComponentChildren, JSX, toChildArray } from "preact";
|
import { ComponentChildren, JSX, toChildArray } from "preact";
|
||||||
|
|
||||||
const Pulse = ({ children }: { children: ComponentChildren }): JSX.Element => (
|
const Pulse = ({ children }: { children: ComponentChildren }): JSX.Element => (
|
||||||
<div class="pulse">
|
<div class="pulse">
|
||||||
<div class="pulse-top">{...toChildArray(children)}</div>
|
|
||||||
<div class="pulse-bottom-bg" />
|
|
||||||
<div class="pulse-bottom">{...toChildArray(children)}</div>
|
<div class="pulse-bottom">{...toChildArray(children)}</div>
|
||||||
|
<div class="pulse-top">{...toChildArray(children)}</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
|
||||||
|
const Portrait = ({ href, alt }: { href: string; alt: string }) => (
|
||||||
|
<img class="portrait" href={href} alt={alt} />
|
||||||
|
);
|
||||||
|
|
||||||
|
const PortraitFrame = ({ children }: { children: ComponentChildren }) => (
|
||||||
|
<div class="portrait-frame">
|
||||||
|
<div class="portrait-frame-inner">{children}</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
@ -20,7 +29,18 @@ const Pulse = ({ children }: { children: ComponentChildren }): JSX.Element => (
|
||||||
// i'll probably go for a different ui element
|
// i'll probably go for a different ui element
|
||||||
render_and_copy(
|
render_and_copy(
|
||||||
<Main>
|
<Main>
|
||||||
<Pulse>homestuck</Pulse>
|
<div class="top">press [rmb] to AWESOMESAUCE</div>
|
||||||
<Pulse>fortnite</Pulse>
|
<div class="middle">
|
||||||
|
<div class="game"></div>
|
||||||
|
<PortraitFrame>
|
||||||
|
<EggbugImg type="smiling" />
|
||||||
|
</PortraitFrame>
|
||||||
|
</div>
|
||||||
|
<div class="bottom">
|
||||||
|
<Pulse>
|
||||||
|
FORTNITE BATTLE ROYALE PLAY FREE NOW AWESOME FUN GAME PLAY FOR
|
||||||
|
FREE NOW! WIN
|
||||||
|
</Pulse>
|
||||||
|
</div>
|
||||||
</Main>
|
</Main>
|
||||||
);
|
);
|
||||||
|
|
Loading…
Reference in a new issue