Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

🐛 fix(radio, radio-rich, toggle, checkbox): met a jour les tokens de couleur [DS-3471] #760

Merged
merged 9 commits into from
Nov 10, 2023
Merged

🐛 fix(radio, radio-rich, toggle, checkbox): met a jour les tokens de couleur [DS-3471] #760

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
81438af
🐛 fix(consent): coche les cookies obligatoires par defaut [DS-3524] (…
zellerbaptiste Aug 28, 2023
615fe69
fix(radio): met a jour les tokens de couleur
zellerbaptiste Sep 4, 2023
de9bc1a
feat(radio): met a jour les tokens
zellerbaptiste Sep 5, 2023
437b6f0
feat(toggle): met a jour les tokens
zellerbaptiste Sep 5, 2023
41d78cc
feat(checkbox): met a jour les tokens
zellerbaptiste Sep 5, 2023
f0e2e0f
feat(toggle): retour de PR
zellerbaptiste Sep 5, 2023
752e83d
fix(radio): retour arriere sur les couleurs de texte
zellerbaptiste Sep 11, 2023
e717ff9
fix(radio): ordre des token de couleurs
keryanS Nov 9, 2023
21a105c
Merge branch 'dev-1.11.0' into fix/radio-active-color
keryanS Nov 9, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions src/component/checkbox/style/_scheme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@
@include before {
@include color.background(active blue-france);
@include color.data-uri-svg(inverted grey, (), $checkbox-svg, false);
@include color.background-image(border active blue-france, (), checkbox-background-image());
}
}
}
Expand Down
2 changes: 2 additions & 0 deletions src/component/consent/example/sample/modal/body.ejs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,12 +45,14 @@ function getRadios (id, itemId, type) {
let elementAccept = type === 'all' ? {label: 'Tout accepter'} : { label : 'Accepter'};
let elementRefuse = type === 'all' ? {label: 'Tout refuser'} : { label : 'Refuser'};
let disabled = type === 'mandatory';
let checked = type === 'mandatory';

return [
{
name: id + '-' + name,
...elementAccept,
id: id + '-' + name + '-accept',
checked: checked
},
{
name: id + '-' + name,
Expand Down
10 changes: 5 additions & 5 deletions src/component/radio/style/scheme/_default.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
#{selector.ns-group(radio)} {
input[type="radio"] {
& + label {
@include color.background-image((action-high blue-france), (legacy:$legacy), radio-background-image(false));
@include color.background-image((border action-high blue-france), (legacy:$legacy), radio-background-image(false));
}

@include disabled.selector {
Expand All @@ -22,7 +22,7 @@

&:checked {
+ label {
@include color.background-image((action-high blue-france) (action-high blue-france), (legacy:$legacy), radio-background-image(true));
@include color.background-image((border active blue-france) (active blue-france), (legacy:$legacy), radio-background-image(true));
}

@include disabled.selector {
Expand All @@ -43,7 +43,7 @@
}

&:checked + label {
@include color.background-image((border plain error) (action-high blue-france), (legacy:$legacy), radio-background-image(true));
@include color.background-image((border plain error) (active blue-france), (legacy:$legacy), radio-background-image(true));
}
}
}
Expand All @@ -57,7 +57,7 @@
}

&:checked + label {
@include color.background-image((border plain success) (action-high blue-france), (legacy:$legacy), radio-background-image(true));
@include color.background-image((border plain success) (active blue-france), (legacy:$legacy), radio-background-image(true));
}
}
}
Expand All @@ -71,7 +71,7 @@
}

&:checked + label {
@include color.background-image((border plain info) (action-high blue-france), (legacy:$legacy), radio-background-image(true));
@include color.background-image((border plain info) (active blue-france), (legacy:$legacy), radio-background-image(true));
}
}
}
Expand Down
10 changes: 5 additions & 5 deletions src/component/radio/style/scheme/_rich.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@

input[type="radio"] {
+ label {
@include color.background-image((action-high blue-france) (action-high blue-france) (border default grey), (legacy: $legacy), '#{radio-rich-background-image(false)}');
@include color.background-image((border action-high blue-france) (active blue-france) (border default grey), (legacy: $legacy), '#{radio-rich-background-image(false)}');
@include color.background((background default grey), (legacy: $legacy));
}

Expand All @@ -34,7 +34,7 @@

&:checked {
+ label {
@include color.background-image((action-high blue-france) (action-high blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
@include color.background-image((border active blue-france) (active blue-france) (border active blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
}

~ #{selector.ns(radio-rich__pictogram)} {
Expand Down Expand Up @@ -63,7 +63,7 @@
}

&:checked + label {
@include color.background-image((border plain error) (action-high blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
@include color.background-image((border plain error) (active blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
}
}
}
Expand All @@ -77,7 +77,7 @@
}

&:checked + label {
@include color.background-image((border plain success) (action-high blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
@include color.background-image((border plain success) (active blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
}
}
}
Expand All @@ -91,7 +91,7 @@
}

&:checked + label {
@include color.background-image((border plain info) (action-high blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
@include color.background-image((border plain info) (active blue-france) (action-high blue-france), (legacy: $legacy), '#{radio-rich-background-image(true)}');
}
}
}
Expand Down
10 changes: 5 additions & 5 deletions src/component/radio/style/scheme/_sm.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
#{ns-group(radio)}--sm {
input[type="radio"] {
+ label {
@include color.background-image((action-high blue-france), (legacy:$legacy), radio-background-image(false, sm));
@include color.background-image((border action-high blue-france), (legacy:$legacy), radio-background-image(false, sm));
}

@include disabled.selector() {
Expand All @@ -21,7 +21,7 @@

&:checked {
+ label {
@include color.background-image((action-high blue-france) (action-high blue-france), (legacy:$legacy), radio-background-image(true, sm));
@include color.background-image((border active blue-france) (active blue-france), (legacy:$legacy), radio-background-image(true, sm));
}

@include disabled.selector {
Expand All @@ -42,7 +42,7 @@
}

&:checked + label {
@include color.background-image((border plain error, action-high blue-france), (legacy:$legacy), radio-background-image(true, sm));
@include color.background-image((border plain error) (active blue-france), (legacy:$legacy), radio-background-image(true, sm));
}
}
}
Expand All @@ -56,7 +56,7 @@
}

&:checked + label {
@include color.background-image((border plain success) (action-high blue-france), (legacy:$legacy), radio-background-image(true, sm));
@include color.background-image((border plain success) (active blue-france), (legacy:$legacy), radio-background-image(true, sm));
}
}
}
Expand All @@ -70,7 +70,7 @@
}

&:checked + label {
@include color.background-image((border plain info) (action-high blue-france), (legacy:$legacy), radio-background-image(true, sm));
@include color.background-image((border plain info) (active blue-france), (legacy:$legacy), radio-background-image(true, sm));
}
}
}
Expand Down
14 changes: 5 additions & 9 deletions src/component/toggle/style/_scheme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,10 @@
#{ns(toggle)} {
label {
@include before {
@include color.text(active blue-france, (legacy:$legacy));
@include color.data-uri-svg(action-high blue-france, (legacy: $legacy), $toggle-unchecked-svg);
@include color.data-uri-svg(border action-high blue-france, (legacy: $legacy), $toggle-unchecked-svg);
}

@include after {
@include color.text(active blue-france, (legacy:$legacy));
@include color.box-shadow(action-high blue-france, (legacy:$legacy), all-1-in);
@include color.background(default grey, (legacy:$legacy));
}
Expand All @@ -29,11 +27,11 @@

~ #{ns(toggle__label)} {
@include before {
@include color.data-uri-svg((action-high blue-france) (action-high blue-france), (legacy: $legacy), $toggle-checked-svg);
@include color.data-uri-svg((border active blue-france) (border active blue-france), (legacy: $legacy), $toggle-checked-svg);
}

@include after {
@include color.data-uri-svg(action-high blue-france, (legacy: $legacy), $toggle-svg);
@include color.data-uri-svg(active blue-france, (legacy: $legacy), $toggle-svg);
}
}
}
Expand Down Expand Up @@ -81,7 +79,6 @@
@include color.text(default error, (legacy:$legacy));

@include before {
@include color.text(default error, (legacy:$legacy));
@include color.data-uri-svg(border plain error, (legacy: $legacy), $toggle-unchecked-svg);
}

Expand All @@ -94,7 +91,7 @@
&:checked {
~ #{ns(toggle__label)} {
@include before {
@include color.data-uri-svg((border plain error) (action-high blue-france), (legacy: $legacy), $toggle-checked-svg);
@include color.data-uri-svg((border plain error) (active blue-france), (legacy: $legacy), $toggle-checked-svg);
}
}
}
Expand All @@ -107,7 +104,6 @@
@include color.text(default success, (legacy:$legacy));

@include before {
@include color.text(default success, (legacy:$legacy));
@include color.data-uri-svg(border plain success, (legacy: $legacy), $toggle-unchecked-svg);
}

Expand All @@ -120,7 +116,7 @@
&:checked {
~ #{ns(toggle__label)} {
@include before {
@include color.data-uri-svg((border plain success) (action-high blue-france), (legacy: $legacy), $toggle-checked-svg);
@include color.data-uri-svg((border plain success) (active blue-france), (legacy: $legacy), $toggle-checked-svg);
}
}
}
Expand Down