mbk/cohost
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

gameboy: colors i'm happy with

Browse source
This commit is contained in:
mehbark 2024-01-04 22:23:08 -05:00
parent c53e26054d
commit b743fda634
1 changed files with 29 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
html/gameboy.tsx
View file

@ -46,26 +46,44 @@ const Draw = ({
height: `${height * pixel_width_px}px`, height: `${height * pixel_width_px}px`,
backgroundColor: bg_color, backgroundColor: bg_color,
}} }}
class="screen"
> >
{...new Array(width * height) {...new Array(width * height)
.fill(null) .fill(null)
.map(() => <Pixel width_px={pixel_width_px} colors={colors} />)} .map(() => <Pixel width_px={pixel_width_px} colors={colors} />)}
</div> </div>
); );
// you know what, let's just to the dark grey part. sorry!
const Shell = ({ children }: { children: ComponentChild }) => ( const Shell = ({ children }: { children: ComponentChild }) => (
<div class="shell">{children}</div> <div class="shell" aria-describedby={"user-content-gameboy-description"}>
<div class="lines">
<div class="top-line"></div>
<div class="bottom-line"></div>
<div class="headline">CHONK MATRIX WITH STERENO SOUND</div>
</div>
{children}
</div>
); );
// https://www.color-hex.com/color-palette/26401
// body: "#aaaaaa" // body: "#aaaaaa"
// horrid url
// https://duet-cdn.vox-cdn.com/thumbor/0x0:2048x1364/750x500/filters:focal(1024x682:1025x683):format(webp)/cdn.vox-cdn.com/uploads/chorus_asset/file/23755199/a31768dc_f45b_4ac7_8f34_6f99e835ed358223055624103571533.jpg
render_and_copy( render_and_copy(
<>
<Shell>
<Draw <Draw
// the actual aspect ratio // the actual aspect ratio
// it has slightly more pixels though // it has slightly more pixels though
width={10} width={10}
height={9} height={9}
pixel_width_px={20} pixel_width_px={20}
colors={["#8bac0f", "#306230", "#0f380f"]} bg_color="#779268"
bg_color="#9bbc0f" colors={["#52643a", "#22311D", "#0E190B"]}
/> />
</Shell>
<p id="gameboy-description" style="font-size: 0px">
// TODO: !!!
</p>
</>
); );