Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: button icons disabled state #163

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

arturbien
Copy link

@arturbien arturbien commented Mar 25, 2023

Adds custom SVG filter for the disabled effect used across Win 98.

The filter is applied by default to images inside the <button />.

Screenshot 2023-03-25 at 23 13 10

Filter can also be used on any other element outside the button if needed:

Screenshot 2023-03-25 at 23 16 57

The filter unfortunately can not be inlined inside CSS because for some reason <feFlood /> is not working when inlined.
Instead the SVG filter needs to be defined in the DOM, then referenced in CSS.

@vercel
Copy link

vercel bot commented Mar 25, 2023

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

Name Status Preview Comments Updated
98css ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Mar 25, 2023 at 10:28PM (UTC)

@arturbien
Copy link
Author

@jdan any thoughts on this PR? ☺️

@juanigaray
Copy link
Collaborator

This looks great! Would you add a comment to the SVG defs so users know that it's important to import them to their markup? If you do that + pull main I think we can merge this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants