integrated looking scrollbars when not in overlay mode

[argyleink]

I couldn't figure out a tailwind way in this scenario 😅 I read the docs on the plugin being used, and I could tell in the output how it was applying colors the prefix way (which is the more customizable / not fully cross browser way). I'm def not against using that.

I also tried scrollbar-track-transparent, but I don't think that's using scrollbar-color under the hood.

The solution I ended up doing was targeting the elements wanting a thin scrollbar, and made the tracks transparent and the thumb color a nice color from the props.

Before:

After:

Show me the better Tailwind way?! All i wanted to contribute quickly was a transparent track using scrollbar-color.

[vercel]

@argyleink is attempting to deploy a commit to the shipshapecode Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
starpod	Ready	Preview	Comment	Sep 4, 2025 1:14pm

[coliff]

hey - I think just need to add color-scheme: dark; to body tag.

Works for me with Edge v139 on Windows 11.

@media (prefers-color-scheme: dark) {
    .dark\:text-dark-text-body {
        color: var(--color-dark-text-body);
        color-scheme: dark;
    }
}

with fix:

[argyleink]

I think just need to add color-scheme: dark; to body tag.

def needed to be done anyway, and now it's in this PR

Robbie and i discussed removing the plugin

did that, in favor of these couple lines of CSS, using the light/dark vars

extras…

which i agree, normally arent cool to do in a PR, i should make a separate PR… however! this PR seeks scroll polish suggestions, and a scroll list animation falls into that category right? cool, so i added a subtle but nice CSS only scroll enhancement to the episodes. thoughts? 😅

[RobbieTheWagner]

I'm completely ignorant here. What is this doing?

[argyleink]

this signals to the browser that your page is light/dark ready and in response the browser will apply a light or dark browser stylesheet. the most notable visual changes are in inputs and scrollbars.

a good example here

[RobbieTheWagner]

@argyleink thanks for taking this on! I think we need a rebase here to get the pnpm lockfile up to date etc.