kyleshevlin / blog Goto Github PK

src/content/posts/prefer-noun-adjective-naming/index.mdx

Shouldn't it be UserCurrent.tsx and ButtonGoLive.tsx? FullScreen should probably be Fullscreen.tsx, not ScreenFull.tsx as "fullscreen" is the adjective, perhaps it needs a noun for clarity, like WindowFullscreen.tsx?

In converting my blog to Astro, there were some changes to how images work.

With Gatsby, I could import the image like so:

import BlahBlah from './images/blah-blah.png'

And pass it directly to components or an img tag and it just worked

<img src={BlahBlah} />

In Astro, this doesn't work. I do not know all the things that are different, but I found the simplest solution was to move the images to the public directory and server them globally to the site. It would be nice if I could keep them relative because I like that organization better.

Might be worth adding these: https://css-tricks.com/how-to-create-a-skip-to-content-link/

I think it'd be dope to add an image component that will automatically invert the colors of an image based on the theme.

I think the way to do this is to add a CSS Custom Property aka CSS Variable combined with a prop. If an image is deemed invertable, when the theme indicates that the var is inverted it sets the correct style.