New button styles

[owenversteeg]

Some people have criticized the current button styles, so this thread is where people can vote on button styles.

Current buttons:

New button design A:

New button design B:

New button design C:

Please vote (with comments) for which button design you like.

[dkuntz2]

Why have the rounded corners? Why not just get rid of the shadow? The shadow's the only thing that looks funky to me.

[dkuntz2]

Why have the rounded corners? Why not just get rid of the shadow? The shadow's the only thing that looks funky to me.

[owenversteeg]

Hmm. I've added an option (C) which is the buttons with no rounded corners and no shadow.

That said, I don't think that the square buttons show affordance. To each their own, I suppose.

[owenversteeg]

Hmm. I've added an option (C) which is the buttons with no rounded corners and no shadow.

That said, I don't think that the square buttons show affordance. To each their own, I suppose.

[scottaohara]

changing my vote to C.

[scottaohara]

changing my vote to C.

[nsanden]

Definitely B

[nsanden]

Definitely B

[owenversteeg]

I vote A

[owenversteeg]

I vote A

[rofrol]

B

[rofrol]

B

[enkrates]

I prefer B.

[enkrates]

I prefer B.

[hliyan]

B

[hliyan]

B

[alfg]

C. Seems the most minimal.

[alfg]

C. Seems the most minimal.

[mcallan83]

B

[mcallan83]

B

[jboverfelt]

B

[jboverfelt]

B

[ghost]

C

[ghost]

C

[ramirovjr]

C

[ramirovjr]

C

[owenversteeg]

Thanks everyone for voting! In preparation for the launch of Min 2, I'm closing this issue. Here's the vote breakdown:

A (1)

• @owenversteeg

B (6)

• @nsanden
• @rofrol
• @enkrates
• @hliyan
• @mcallan83
• @jboverfelt

C (5)

• @dkuntz2
• @scottaohara
• @alfg
• @iamguiller
• @ramirovjr

If you prefer another button choice, feel free to say so. Remember, there's always another opportunity to change the button look & feel for Min 3! If you have another button style idea, just comment with an image.

[owenversteeg]

Thanks everyone for voting! In preparation for the launch of Min 2, I'm closing this issue. Here's the vote breakdown:

A (1)

• @owenversteeg

B (6)

• @nsanden
• @rofrol
• @enkrates
• @hliyan
• @mcallan83
• @jboverfelt

C (5)

• @dkuntz2
• @scottaohara
• @alfg
• @iamguiller
• @ramirovjr

If you prefer another button choice, feel free to say so. Remember, there's always another opportunity to change the button look & feel for Min 3! If you have another button style idea, just comment with an image.

[owenversteeg]

hey @scottaohara could you check over my edit to /sass/_button.scss? I think my LESS background shows when I push to the sass folder. (also, I killed some whitespace - not sure if you had that there for a reason.)

[owenversteeg]

hey @scottaohara could you check over my edit to /sass/_button.scss? I think my LESS background shows when I push to the sass folder. (also, I killed some whitespace - not sure if you had that there for a reason.)

[scottaohara]

I just submitted a pull request for some updates to the sass branch.

There are a few things I've done in the button.scss that you should probably look at and see if you agree (mostly adding a display: inline-block; to the button, .btn selector).

I'm guessing the white space you were referring to was the extra line breaks between rulesets? I do that just to make things a bit easier to read. Since extra spacing gets removed when compiling to the css / minified css, I'd like to keep it in there.

Also take note of the example I posted as http://scottohara.me/min, as it is directly related to why an inline-block should be applied to the button, .btn selector.

thanks

[scottaohara]

I just submitted a pull request for some updates to the sass branch.

There are a few things I've done in the button.scss that you should probably look at and see if you agree (mostly adding a display: inline-block; to the button, .btn selector).

I'm guessing the white space you were referring to was the extra line breaks between rulesets? I do that just to make things a bit easier to read. Since extra spacing gets removed when compiling to the css / minified css, I'd like to keep it in there.

Also take note of the example I posted as http://scottohara.me/min, as it is directly related to why an inline-block should be applied to the button, .btn selector.

thanks

[enkrates]

Please correct me if I'm wrong, but it seems to me that option (B) won the vote. In any case, thanks for all the work on this great little CSS framework!

[enkrates]

Please correct me if I'm wrong, but it seems to me that option (B) won the vote. In any case, thanks for all the work on this great little CSS framework!

[owenversteeg]

@enkrates You're correct, thanks! I've updated the CSS and the chart accordingly.

[owenversteeg]

@enkrates You're correct, thanks! I've updated the CSS and the chart accordingly.