jdan / 98.css

A design system for building faithful recreations of old UIs
https://jdan.github.io/98.css
MIT License
9k stars 296 forks source link

Added optional `::selection` styling for `.window-body` children #197

Open vtlanglois opened 4 months ago

vtlanglois commented 4 months ago

In this PR

Screenshot 2024-04-28 at 12 48 26 PM

💭 Reasoning

Adding this styling can ensure that developers and designers can build a more authentic UI based on Windows 98, down to how text highlighting was styled.

📔 Dev Notes

The decision to make ::selection styling apply thru an optional class was to ensure that a developer would have to consciously choose if they want an area to have W98 selection styling on an element, as there can be significant accessibility impacts^2 if done.

This also has the benefit of allowing a user of 98.css to choose when and where on a window-body element they want the custom highlight styling to occur, as the use of text-shadow with this custom highlight styling could make some highlights look off.

The foreground and background of this selection styling surpasses WCAG AA and AAA with a contrast ratio of 18.07:1^3.

[^1]: Name for class and styling sourced from Windows Interface Guidelines, chapter 13 - Visual Design, page 325

vercel[bot] commented 4 months ago

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

Name Status Preview Updated (UTC)
98css ✅ Ready (Inspect) Visit Preview Apr 28, 2024 5:05pm