bug: Defaulting all button borders to transparent

[pmcbryde]

Type: bug

Platform: mobile webview

In the process of upgrading from 1.0.0 to 1.2.1 (I know, a ways behind). This commit broke all of the buttons in our app, removing their borders: 21e54be#diff-38983e82a6c8e46a6adaf2d5e3d81997R6

The only workaround is to re-write this mixin locally without that change. The fix (I'd guess, if you really really want to default every button to have no border) would be to set $button-stable-border to "transparent" instead of overwriting every button's border: https://github.com/driftyco/ionic/blob/master/scss/_variables.scss#L103

[mlynch]

This isn't a bug, it's a design decision. If you need borders like pre 1.2, just add them:

.button { border: blah }

[mlynch]

Note: this commit made ionic 1 buttons match v2 buttons, so we're going this way anyways

[ammulder]

There are issues with this change in Ionic 1, though.

In Ionic 2, for instance, a Segment renders a border around each button, giving it some visual distinction.

In Ionic 1, a Button Bar just renders as a big block of color with some random text floating freely within it.

With the default colors, the light and stable buttons can be really hard to distinguish from the page background.

The old style with borders (demonstrated in the current Ionic 1 CSS docs) looks way better.

I'd like to see a simple option to restore borders to all buttons built into the Ionic CSS (even something like button class="button button-stable button-with-border"). Or at a bare minimum, add borders back to buttons in a button bar.

[boltex]

Changing the styling of buttons to match another product (ionic 2) is a mistake . It should have been at most an optional feature.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.