jquery-archive / css-chassis

An attempt at creating an open standard for both CSS and JavaScript UI libraries.
https://css-chassis.com
Other
351 stars 67 forks source link

Variables: Initial pass on button variables #138

Closed sfrisk closed 8 years ago

sfrisk commented 8 years ago

Based on discussions from last week's meeting, here is an initial pass at buttons' variables to help facilitate the discussion on the best practices for organizing and naming variables for jsass.

sfrisk commented 8 years ago

One of the questions brought up in today's meeting is do we want to use maps as much as I have in this example, or is it better to split things up more than what I did and have more variables and/or more specific maps.

cvrebert commented 8 years ago

Perhaps there should be btn-md and btn-default modifier classes, instead of setting a default size and color on btn which then get cascaded and overridden by the existing size and color modifier classes?

arschmitz commented 8 years ago

@cvrebert +1 we have a goal of avoiding cascading and specificity

sfrisk commented 8 years ago

yeah, good point. Part of me didn't want to have additional classes, but overwriting is also icky.

geekman-rohit commented 8 years ago

http://view.css-chassis.com/96-buttons-take-two/demos/buttons.html @sfrisk a little shadow? The smaller ones look more like labels than buttons.

sfrisk commented 8 years ago

I'm not entirely thrilled with the design, playing around with it more, just figured I would post what I had so far.

geekman-rohit commented 8 years ago

I kind of like the mixins and variables you made. I guess colors/design can wait until we have a few more basic things merged

sfrisk commented 8 years ago

This branch is now using the palette shown in #140

sfrisk commented 8 years ago

Update on http://view.css-chassis.com/96-buttons-take-two/demos/buttons.html

geekman-rohit commented 8 years ago

Ship It. Looks Really Good.!

sfrisk commented 8 years ago

Button PR has been updated: http://view.css-chassis.com/96-buttons-take-two/demos/buttons.html

Added block buttons, button bar, some hover/active/etc colors for the default button, anchor button demo, and input[type=submit] button demo.

sfrisk commented 8 years ago

Pinging @geekman-rohit @arschmitz @kristyjy for reviewal. Does this approach look good for buttons and what we wanted for naming conventions?

kristyjy commented 8 years ago

This looks great to me other than maybe giving the cascading button groups a little more thought. If we do decide to keep the cascading we may want to add notes to the style guide to make sure we have guidelines for deciding when we should and shouldn't cascade.

sfrisk commented 8 years ago

Update made, removed the need for cascading.