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

Combine with Surface #2

Open
niutech opened this issue Feb 1, 2019 · 9 comments
Open

Combine with Surface #2

niutech opened this issue Feb 1, 2019 · 9 comments

Comments

@niutech
Copy link

niutech commented Feb 1, 2019

Have you heard of Surface CSS-only Material Design framework. Why don't you combine it with Matter and base your missing components on Surface?

@finnhvman
Copy link
Owner

finnhvman commented Feb 3, 2019

Hello! Matter and Surface are two very different approaches. Matter is an implementation of the latest Material Design spec, on the other hand Surface is more loose on the spec, experimental and unmaintained. Compare for example the button component from both libraries and see in how many aspects they differ.

Let's get practical though. Which components do you miss from Matter? 🙂

@KieranHolroyd
Copy link

KieranHolroyd commented Mar 4, 2019

Modals would be super nice, maybe you could implement them in a similar way to GitHub with the

<details>cool :p</details>

tag, would keep it fast and require no js. not sure how animations work with the tag though

@niutech
Copy link
Author

niutech commented Mar 4, 2019 via email

@ghost
Copy link

ghost commented Mar 4, 2019

Navbars, file input.

@willpower232
Copy link

This tweet on how github did javascript-free modals might be useful to you https://twitter.com/Keithamus/status/1098260366017134592

@finnhvman
Copy link
Owner

Thank you all! (especially @willpower232)

Looks like modal is the obvious next choice.

For the other requests: I'm trying to follow the Material Design Components specs at https://material.io/design/ (Hamburger menu | Scroll the menu down to bottom -> Components). The ones requested but not found here require more time.

Also keep in mind that these factors come into play in an implementation:

  • Accessibility
  • CSS-only-ness
  • Developer Experience
  • Material Design Spec

At this point I'm not sure I would be able to deliver any component (some would become overly complex without JavaScript), but I'll do my best. 🙂

@web-padawan
Copy link

Thumbs up for tabs as there is a bunch of CSS-only tabs solution, e.g. here.

@finnhvman
Copy link
Owner

@web-padawan Thanks for this list!

@silikidi
Copy link

silikidi commented Mar 10, 2019

Great work! Thank you, I admit, it helps me a lot, you have successfully made scriptless the material. While wait Matter stuff of SELECT next release, I use Pavel Paravko crafting https://codepen.io/pavelvaravko/pen/qjojOr

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

No branches or pull requests

6 participants