mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
fix(button): bar-button uses inner span as flexbox
- Fixed block/full buttons, now there are display: block - Fixes <ion-segment-button> warnings
This commit is contained in:
@@ -97,7 +97,6 @@ $button-ios-small-icon-font-size: 1.3em !default;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
|
||||
// iOS Full Button
|
||||
// --------------------------------------------------
|
||||
|
||||
@@ -105,11 +104,10 @@ $button-ios-small-icon-font-size: 1.3em !default;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
border-radius: 0;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
border-right-width: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
|
||||
// iOS Outline Button
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -110,28 +110,25 @@ $button-md-small-icon-font-size: 1.4em !default;
|
||||
font-size: $button-md-small-icon-font-size;
|
||||
}
|
||||
|
||||
// Material Design Block Button
|
||||
// --------------------------------------------------
|
||||
|
||||
.button-block {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
// Material Design Full Button
|
||||
// --------------------------------------------------
|
||||
|
||||
.button-full {
|
||||
border-radius: 0;
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
border-radius: 0;
|
||||
border-right-width: 0;
|
||||
border-left-width: 0;
|
||||
}
|
||||
|
||||
|
||||
// Material Design Block Button
|
||||
// --------------------------------------------------
|
||||
|
||||
.button-block {
|
||||
margin-right: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
|
||||
// Material Design Outline Button
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
@@ -29,17 +29,18 @@ $button-round-border-radius: 64px !default;
|
||||
@include appearance(none);
|
||||
}
|
||||
|
||||
span.button-inner {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.button-inner {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
flex-flow: row nowrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
a.button {
|
||||
a.button, a[button] {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@@ -54,7 +55,7 @@ a.button {
|
||||
// --------------------------------------------------
|
||||
|
||||
.button-block {
|
||||
display: flex;
|
||||
display: block;
|
||||
clear: both;
|
||||
width: 100%;
|
||||
|
||||
@@ -68,6 +69,7 @@ a.button {
|
||||
// --------------------------------------------------
|
||||
|
||||
.button-full {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user