Skip to content

Commit 0aef08c

Browse files
committed
feat(chip, spinner): remove old CSS variables
1 parent 8019941 commit 0aef08c

3 files changed

Lines changed: 9 additions & 30 deletions

File tree

core/api.txt

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -602,11 +602,6 @@ ion-chip,prop,mode,"ios" | "md",undefined,false,false
602602
ion-chip,prop,outline,boolean,false,false,false
603603
ion-chip,prop,shape,"rectangular" | "round" | "soft" | undefined,undefined,false,false
604604
ion-chip,prop,size,"large" | "small" | undefined,undefined,false,false
605-
ion-chip,css-prop,--border-radius
606-
ion-chip,css-prop,--color
607-
ion-chip,css-prop,--focus-ring-color
608-
ion-chip,css-prop,--focus-ring-style
609-
ion-chip,css-prop,--focus-ring-width
610605

611606
ion-col,shadow
612607
ion-col,prop,mode,"ios" | "md",undefined,false,false
@@ -2309,7 +2304,6 @@ ion-spinner,prop,mode,"ios" | "md",undefined,false,false
23092304
ion-spinner,prop,name,"bubbles" | "circles" | "circular" | "crescent" | "dots" | "lines" | "lines-sharp" | "lines-sharp-small" | "lines-small" | undefined,undefined,false,false
23102305
ion-spinner,prop,paused,boolean,false,false,false
23112306
ion-spinner,prop,size,"large" | "medium" | "small" | "xlarge" | "xsmall" | undefined,undefined,false,false
2312-
ion-spinner,css-prop,--color
23132307

23142308
ion-split-pane,shadow
23152309
ion-split-pane,prop,contentId,string | undefined,undefined,false,true

core/src/components/chip/chip.scss

Lines changed: 8 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,7 @@
55
// --------------------------------------------------
66

77
:host {
8-
/**
9-
* @prop --border-radius: Border radius of the chip
10-
* @prop --color: Color of the chip
11-
* @prop --focus-ring-color: Color of the focus ring
12-
* @prop --focus-ring-style: Style of the focus ring
13-
* @prop --focus-ring-width: Width of the focus ring
14-
*/
15-
--focus-ring-color: var(--ion-chip-state-focus-ring-color);
16-
--focus-ring-style: var(--ion-chip-state-focus-ring-style);
17-
--focus-ring-width: var(--ion-chip-state-focus-ring-width);
18-
198
@include mixins.font-smoothing();
20-
@include mixins.border-radius(var(--border-radius));
219
@include mixins.margin(
2210
var(--ion-chip-margin-top),
2311
var(--ion-chip-margin-end),
@@ -37,8 +25,6 @@
3725
align-items: center;
3826
justify-content: center;
3927

40-
color: var(--color);
41-
4228
font-weight: var(--ion-chip-font-weight);
4329

4430
letter-spacing: var(--ion-chip-letter-spacing);
@@ -72,15 +58,15 @@
7258
// ---------------------------------------------
7359

7460
:host(.chip-shape-soft) {
75-
--border-radius: var(--ion-chip-shape-soft-border-radius);
61+
@include mixins.border-radius(var(--ion-chip-shape-soft-border-radius));
7662
}
7763

7864
:host(.chip-shape-round) {
79-
--border-radius: var(--ion-chip-shape-round-border-radius);
65+
@include mixins.border-radius(var(--ion-chip-shape-round-border-radius));
8066
}
8167

8268
:host(.chip-shape-rectangular) {
83-
--border-radius: var(--ion-chip-shape-rectangular-border-radius);
69+
@include mixins.border-radius(var(--ion-chip-shape-rectangular-border-radius));
8470
}
8571

8672
// Chip: Bold Solid
@@ -358,7 +344,11 @@
358344

359345
// Focus
360346
:host(.ion-focused) {
361-
@include mixins.focused-state(var(--focus-ring-width), var(--focus-ring-style), var(--focus-ring-color));
347+
@include mixins.focused-state(
348+
var(--ion-chip-state-focus-ring-width),
349+
var(--ion-chip-state-focus-ring-style),
350+
var(--ion-chip-state-focus-ring-color)
351+
);
362352
}
363353

364354
// Chip Slotted Elements

core/src/components/spinner/spinner.scss

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,10 @@
55
// --------------------------------------------------
66

77
:host {
8-
/**
9-
* @prop --color: Color of the spinner
10-
*/
11-
--color: var(--ion-spinner-color);
12-
138
display: inline-block;
149
position: relative;
1510

16-
color: var(--color);
11+
color: var(--ion-spinner-color);
1712

1813
user-select: none;
1914
}

0 commit comments

Comments
 (0)