Files
ionic-framework/ionic/components/toolbar/toolbar-button.scss
Manu Mtz.-Almeida 38a3be438f fix(button): bar-button uses inner span as flexbox
- Fixed block/full buttons, now there are display: block
- Fixes <ion-segment-button> warnings
2016-02-10 15:49:19 +01:00

62 lines
1.0 KiB
SCSS

@import "../../globals.core";
// Toolbar Buttons
// --------------------------------------------------
.bar-button {
position: relative;
display: inline-block;
margin: 0;
padding: 0;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
text-transform: none;
line-height: 1;
vertical-align: top; // the better option for most scenarios
vertical-align: -webkit-baseline-middle; // the best for those that support it
cursor: pointer;
@include user-select-none();
@include appearance(none);
}
.bar-button:after {
// used to make the button's hit area larger
position: absolute;
content: '';
top: -7px;
right: -2px;
bottom: -6px;
left: -2px;
}
// Menu Toggle
// --------------------------------------------------
.bar-button-menutoggle {
display: flex;
align-items: center;
}
// Back Button
// --------------------------------------------------
.back-button {
display: none;
&.show-back-button {
display: inline-block;
}
}
.back-button-text {
display: flex;
align-items: center;
}