fix(chip): default color has contrast on dark mode (#25998)

resolves #25997
This commit is contained in:
Liam DeBeasi
2022-09-26 08:38:12 -05:00
committed by GitHub
parent 12b8a0cab8
commit ef78a123e5
4 changed files with 5 additions and 10 deletions

View File

@ -1 +0,0 @@
@import "./chip";

View File

@ -1 +0,0 @@
@import "./chip";

View File

@ -69,7 +69,7 @@
} }
:host(.chip-outline) { :host(.chip-outline) {
border-color: rgba(0, 0, 0, .32); border-color: rgba($text-color-rgb, .32);
background: transparent; background: transparent;
} }
@ -79,11 +79,11 @@
} }
:host(.chip-outline:not(.ion-color):focus) { :host(.chip-outline:not(.ion-color):focus) {
background: rgba(0, 0, 0, .04); background: rgba($text-color-rgb, .04);
} }
:host(.chip-outline.ion-activated:not(.ion-color)) { :host(.chip-outline.ion-activated:not(.ion-color)) {
background: rgba(0, 0, 0, .08); background: rgba($text-color-rgb, .08);
} }
@ -95,7 +95,7 @@
} }
:host(:not(.ion-color)) ::slotted(ion-icon) { :host(:not(.ion-color)) ::slotted(ion-icon) {
color: rgba(0, 0, 0, .54); color: rgba($text-color-rgb, .54);
} }
::slotted(ion-icon:first-child) { ::slotted(ion-icon:first-child) {

View File

@ -10,10 +10,7 @@ import { createColorClasses } from '../../utils/theme';
*/ */
@Component({ @Component({
tag: 'ion-chip', tag: 'ion-chip',
styleUrls: { styleUrl: 'chip.scss',
ios: 'chip.ios.scss',
md: 'chip.md.scss',
},
shadow: true, shadow: true,
}) })
export class Chip implements ComponentInterface { export class Chip implements ComponentInterface {