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(accordion, transcription, translate, sidemenu): Ajustement sur l'état défaut et actif [DS-3023, DS-3024, DS-3025, DS-3008, DS-3142, DS-3031, DS-3032] #564

Merged
merged 2 commits into from
Jun 20, 2023
Merged

🐛 fix(accordion, transcription, translate, sidemenu): Ajustement sur l'état défaut et actif [DS-3023, DS-3024, DS-3025, DS-3008, DS-3142, DS-3031, DS-3032] #564

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
1a663ec
fix(accordion, transcription, translate): modifie apparence du bouton
zellerbaptiste Jan 16, 2023
7cfd16b
feat(accordion,transcription,sidemenu): couleur de fond à l'ouverture…
lab9fr Jun 20, 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 module/animate/_index.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
@forward 'mixin/caret';
11 changes: 11 additions & 0 deletions module/animate/mixin/_caret.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
@mixin caret() {
&::after {
transition: transform 0.3s;
}

&[aria-expanded='true'] {
&::after {
transform: rotate(-180deg);
}
}
}
6 changes: 4 additions & 2 deletions src/component/accordion/style/_legacy.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,10 +17,12 @@
@include enable-list-style-legacy;

&__btn {
@include icon-legacy(add-line, sm);
@include icon-legacy(arrow-down-s-line, sm);

&[aria-expanded="true"] {
@include icon-image-legacy(subtract-line);
@include after {
transform: rotate(-180deg);
}
}
}
}
Expand Down
13 changes: 6 additions & 7 deletions src/component/accordion/style/_module.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@
/// @group accordion
////

@use 'module/animate';

#{ns(accordion)} {
position: relative;

Expand All @@ -22,21 +24,18 @@
&__btn {
@include _build-link-base;
@include _link-display(flex);
@include nest-accordion-button(add-line);
@include font-weight('medium');
@include nest-accordion-button(arrow-down-s-line);
@include size(100%);
text-align: left;
@include margin(0);

@include animate.caret();

@include after {
@include margin-right(0);
@include margin-left(auto);
}

&[aria-expanded="true"] {
@include font-weight('bold');
@include icon-image(subtract-line, after);
}

@include padding(3v 0);
@include padding(3v 4v, md);
}
Expand Down
7 changes: 3 additions & 4 deletions src/component/accordion/style/_scheme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,9 @@
}

&__btn {
@include color.text(action-high grey, (legacy:$legacy));

&[aria-expanded="true"] {
@include color.text(active grey, (legacy:$legacy));
@include color.text(action-high blue-france, (legacy:$legacy));
&[aria-expanded='true'] {
@include color.background(open blue-france, (legacy: $legacy));
}
}
}
Expand Down
6 changes: 6 additions & 0 deletions src/component/sidemenu/style/_scheme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,5 +76,11 @@
}
}
}

&__btn {
&[aria-expanded='true'] {
@include color.background(open blue-france, (legacy: $legacy));
}
}
}
}
6 changes: 4 additions & 2 deletions src/component/transcription/style/_legacy.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,12 @@

&__btn {
@include icon-legacy(align-left, sm, before);
@include icon-legacy(add-line, sm, after);
@include icon-legacy(arrow-down-s-line, sm, after);

&[aria-expanded="true"] {
@include icon-image-legacy(subtract-line);
@include after {
transform: rotate(-180deg);
}
}
}

Expand Down
9 changes: 4 additions & 5 deletions src/component/transcription/style/_module.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
////

@use 'module/media-query';
@use 'module/animate';

#{ns(transcription)} {
position: relative;
Expand All @@ -17,7 +18,8 @@
&__btn {
@include _build-link-base;
@include _link-display(flex);
@include nest-transcription-button(add-line);
@include font-weight('medium');
@include nest-transcription-button(arrow-down-s-line);
@include size(100%);
text-align: left;
@include margin(0);
Expand All @@ -29,10 +31,7 @@
@include icon(align-left, sm, before) {
@include margin-right(2v);
}

&[aria-expanded='true'] {
@include icon-image(subtract-line, after);
}
@include animate.caret();
}

&__content {
Expand Down
3 changes: 3 additions & 0 deletions src/component/transcription/style/_scheme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,9 @@

&__btn {
@include color.text(action-high blue-france, (legacy:$legacy));
&[aria-expanded='true'] {
@include color.background(open blue-france, (legacy: $legacy));
}
}

&__content {
Expand Down
2 changes: 1 addition & 1 deletion src/component/translate/style/_legacy.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
#{ns(translate)} {
#{ns(translate)} &__btn {
@include icon-legacy(translate-2, sm, before);
@include icon-legacy(arrow-down-s-fill, sm, after);
@include icon-legacy(arrow-down-s-line, sm, after);
}
}
}
12 changes: 4 additions & 8 deletions src/component/translate/style/_module.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,8 @@
/// @group header
////

@use 'module/animate';

#{ns(translate)} {
--rows: 8;
position: relative;
Expand All @@ -15,18 +17,12 @@
@include width(100%);
@include width(auto, lg);
@include margin-bottom(4v, lg);
@include animate.caret();

@include icon(arrow-down-s-fill, sm, after) {
@include icon(arrow-down-s-line, sm, after) {
@include margin-left(auto);
@include margin-left(1v, lg);
@include margin-right(-1v, lg);
transition: transform 0.3s;
}

&[aria-expanded=true] {
@include after {
transform: rotate(-180deg);
}
}

@include respond-from(lg) {
Expand Down