.ios and .md body class css structure

This commit is contained in:
Adam Bradley
2015-09-04 23:53:59 -05:00
parent 7b09e70284
commit cdf631dcaf
42 changed files with 140 additions and 195 deletions

View File

@@ -8,7 +8,7 @@ $tab-bar-ios-item-icon-size: 32px !default;
$tab-bar-ios-height: 49px !default;
.tabs[mode=ios] {
.tabs {
.tab-bar {
border-top: 1px solid $toolbar-ios-border-color;
@@ -46,8 +46,8 @@ $tab-bar-ios-height: 49px !default;
}
[mode=ios][tab-bar-icons=right] .tab-button,
[mode=ios][tab-bar-icons=left] .tab-button {
[tab-bar-icons=right] .tab-button,
[tab-bar-icons=left] .tab-button {
.tab-button-text {
font-size: 1.4rem;
@@ -63,7 +63,7 @@ $tab-bar-ios-height: 49px !default;
}
}
[mode=ios] .tab-button.has-title-only {
.tab-button.has-title-only {
min-height: $tab-bar-ios-height - 8;
.tab-button-text {
@@ -72,11 +72,11 @@ $tab-bar-ios-height: 49px !default;
}
}
[mode=ios] .tab-button.icon-only {
.tab-button.icon-only {
min-height: $tab-bar-ios-height - 8;
}
.hairlines .tabs[mode=ios] {
&.hairlines .tabs {
.tab-bar {
border-top-width: 0.5px;

View File

@@ -9,7 +9,7 @@ $tab-bar-md-item-icon-size: 2.4rem !default;
$tab-bar-md-item-height: 4.8rem !default;
.tabs[mode=md] {
.tabs {
.tab-button {
padding: $tab-bar-md-item-padding;
@@ -39,12 +39,12 @@ $tab-bar-md-item-height: 4.8rem !default;
}
[mode=md][tab-bar-icons=bottom] .tab-button {
[tab-bar-icons=bottom] .tab-button {
padding-top: 8px;
padding-bottom: 8px;
}
[mode=md][tab-bar-icons=right] .tab-button,
[mode=md][tab-bar-icons=left] .tab-button {
[tab-bar-icons=right] .tab-button,
[tab-bar-icons=left] .tab-button {
padding-bottom: 10px;
icon {
@@ -52,7 +52,7 @@ $tab-bar-md-item-height: 4.8rem !default;
}
}
[mode=md] .tab-button.icon-only,
[mode=md] .tab-button.has-title-only {
.tab-button.icon-only,
.tab-button.has-title-only {
padding: 6px 10px 6px 10px;
}

View File

@@ -58,8 +58,6 @@
<style>
ion-tabs {
height: auto;
}
ion-tabs[mode=md] {
border-bottom: 1px solid gray;
border-top: 1px solid gray;
}
</style>