studio/cunningham
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

💄(react) fix DatePicker, Select, Input success colors

Browse Source 
This is based on recent QA report.
This commit is contained in:
Nathan Vasse
2023-09-06 17:08:33 +02:00
committed by NathanVss
parent 9a349c1556
commit cf542e4fa9
5 changed files with 31 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/popular-rings-knock.md Normal file
View File

@@ -0,0 +1,5 @@
---
"@openfun/cunningham-react": minor
---
fix DatePicker, Select, Input success colors

8
packages/react/src/components/Forms/DatePicker/index.scss
View File

@@ -170,9 +170,13 @@
&:not(.c__date-picker--disabled) {
&:hover {
.c__date-picker__wrapper {
border-color: var(--c--theme--colors--success-200);
border-color: var(--c--theme--colors--success-800);
&__toggle {
color: var(--c--theme--colors--success-200);
color: var(--c--theme--colors--success-800);
}
label {
color: var(--c--theme--colors--success-800);
}
}
}

2
packages/react/src/components/Forms/Field/index.scss
View File

@@ -38,7 +38,7 @@
color: var(--c--theme--colors--success-600);
.c__field__text {
color: var(--c--theme--colors--success-800);
color: var(--c--theme--colors--success-600);
}
}

11
packages/react/src/components/Forms/Input/index.scss
View File

@@ -102,9 +102,18 @@
&--success {
border-color: var(--c--theme--colors--success-600);
.labelled-box label {
color: var(--c--theme--colors--success-600);
}
&:not(.c__input__wrapper--disabled) {
&:hover {
border-color: var(--c--theme--colors--success-400);
border-color: var(--c--theme--colors--success-800);
color: var(--c--theme--colors--success-800);
.labelled-box label {
color: var(--c--theme--colors--success-800);
}
}
}
}

10
packages/react/src/components/Forms/Select/index.scss
View File

@@ -189,11 +189,19 @@
.c__select__wrapper {
border-color: var(--c--theme--colors--success-600);
label {
color: var(--c--theme--colors-success-600);
}
}
&:not(.c__select__wrapper--disabled) {
.c__select__wrapper:hover {
border-color: var(--c--theme--colors--success-400);
border-color: var(--c--theme--colors--success-800);
label {
color: var(--c--theme--colors--success-800);
}
}
}
}