diff --git a/dist/ios-theme.css b/dist/ios-theme.css index 110ebe0..adb7455 100644 --- a/dist/ios-theme.css +++ b/dist/ios-theme.css @@ -218,30 +218,43 @@ textarea, .badge.badge-inverted { color: #929292; + background-color: transparent; } .badge-primary { color: #fff; + background-color: #007aff; } .badge-primary.badge-inverted { color: #007aff; + background-color: transparent; } .badge-positive { color: #fff; + background-color: #4cd964; } .badge-positive.badge-inverted { color: #4cd964; + background-color: transparent; } .badge-negative { color: #fff; + background-color: #dd524d; } .badge-negative.badge-inverted { color: #dd524d; + background-color: transparent; } -.btn:active .badge-inverted { +.btn .badge { + background-color: rgba(0, 0, 0, 0.15); +} +.btn .badge.badge-inverted { + background-color: transparent; +} +.btn:active .badge { color: #fff; } diff --git a/docs-assets/css/docs.css b/docs-assets/css/docs.css index 3844adb..fe9bbd1 100644 --- a/docs-assets/css/docs.css +++ b/docs-assets/css/docs.css @@ -989,26 +989,39 @@ hr { } .platform-ios .badge.badge-inverted { color: #929292; + background-color: transparent; } .platform-ios .badge-primary { color: #fff; + background-color: #007aff; } .platform-ios .badge-primary.badge-inverted { color: #007aff; + background-color: transparent; } .platform-ios .badge-positive { color: #fff; + background-color: #4cd964; } .platform-ios .badge-positive.badge-inverted { color: #4cd964; + background-color: transparent; } .platform-ios .badge-negative { color: #fff; + background-color: #dd524d; } .platform-ios .badge-negative.badge-inverted { color: #dd524d; + background-color: transparent; } -.platform-ios .btn:active .badge-inverted { +.platform-ios .btn .badge { + background-color: rgba(0, 0, 0, 0.15); +} +.platform-ios .btn .badge.badge-inverted { + background-color: transparent; +} +.platform-ios .btn:active .badge { color: #fff; } .platform-ios .segmented-control { diff --git a/lib/sass/theme-ios.scss b/lib/sass/theme-ios.scss index 5e2f8d4..4f523cf 100644 --- a/lib/sass/theme-ios.scss +++ b/lib/sass/theme-ios.scss @@ -303,6 +303,7 @@ textarea, .badge { &.badge-inverted { color: $default-color; + background-color: transparent; } } @@ -313,33 +314,51 @@ textarea, // Main badge .badge-primary { color: #fff; + background-color: $primary-color; &.badge-inverted { color: $primary-color; + background-color: transparent; } } // Positive badge .badge-positive { color: #fff; + background-color: $positive-color; &.badge-inverted { color: $positive-color; + background-color: transparent; } } // Negative badge .badge-negative { color: #fff; + background-color: $negative-color; &.badge-inverted { color: $negative-color; + background-color: transparent; } } -// Active states -.btn:active .badge-inverted { - color: #fff; +// Badges in buttons + +.btn { + .badge { + background-color: rgba(0,0,0,.15); + + &.badge-inverted { + background-color: transparent; + } + } + + // Active states + &:active .badge { + color: #fff; + } }