Dark-mode styling

[irsyadpage]

User that has prefers-color-scheme as dark will automatically see the dark mode version.

I override color only when neccessary to keep the changes as minimal as possible. The shade schemes are selected based on the original shade. As an example, original font color for body is darker than a, and a is darker than a:hover. Hence, in dark-mode, I used opposite shade: body is brighter than a, and a is brighter than a:hover.

Although .copy-button has color property, I don't override this color since there is no text in the element. If text would be included in the future, the following properties could be add:

@media (prefers-color-scheme: dark) {
  .copy-button {
    color: #fff;
  }
}

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
unduck	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 16, 2025 8:34am

[okunamayanad]

LGTM! This is definitely needed as it flashes all white when searching for a split second for dark mode users. This fixed the flashing issue for me.