Also add style for other input elements #8

Open
CodeBrauer opened this Issue Jun 30, 2016 · 6 comments

Projects

None yet

4 participants

@CodeBrauer
Contributor

Currently there is only [type="text"] and [type="button"] styled. But there are so many more: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes

So I've already tried some tweaks, but there is no perfect solution without having a selector that contains all this types (or at least the most common)

Like this (messy & not classy 😅):

input:not([type=submit]):not([type=radio]):not([type=checkbox]):not([type=reset]), select
/* or this */
input[type=text], input[type=password], input[type=email], input[type=number], input[type=search], input[type=url], input[type=tel], input[type=datetime], input[type=color], input[type=date]

in forms.css#L6

So the other point is, this framework should cover this (or at least some of the most common types) in my opinion - but it would make also the filesize bigger.

screenshot-wing-html
gist of the screenshot

@KingPixil
Owner

Yes, I have been thinking about this as well, the problem is that it will add more file size, so the first step is to fix up #10. Which will reduce the file size, then I can start adding more inputs.

What input's should be added?

All I think is critical:

  • Radio
  • Checkbox

If you have any other ones, please let me know.

Thanks. 👍

@ShaggyDude

The file size is already tiny but, this could be added as a module to be included if desired? Also, you need to add height to select to make it the same height as text input... Awesome stuff!

@KingPixil
Owner

@ShaggyDude Thanks for the feedback, I guess I could add it as a module, but I am working on it being included with Wing so stay tuned!

Also, what browser are you seeing the select input on? It already has height on Chrome, on Macs there are some problems however...

Thanks!

@KingPixil
Owner

@CodeBrauer @ShaggyDude I added support for input type text, password, email, and a couple other common ones, I will be adding support for radio and checkbox soon.

@Kcchouette
Kcchouette commented Oct 6, 2016 edited

@KingPixil Can you please also add support for input file, input url and input tel?

@KingPixil
Owner

I'll work on it @Kcchouette 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment