Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

[Accessibility] Replace simple CSS red with an accessible red color (#48742) 

* Replace red color with $red sass variable

* Add chegelog file

* Use CSS red variable instead of the SASS one
This commit is contained in:
Gabriel Manussakis 2024-07-18 13:18:10 -03:00 committed by GitHub
parent de4a8ffdd4
commit 49db63ab3f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
plugins/woocommerce/changelog/fix-43634 Normal file
View File

@ -0,0 +1,4 @@
Significance: patch
Type: fix
Replace the red CSS color with the $red SASS variable in WooCommerce legacy elements

20
plugins/woocommerce/client/legacy/css/woocommerce.scss
View File

@ -80,14 +80,14 @@ p.demo_store,
text-align: center;
line-height: 1;
border-radius: 100%;
color: red !important; // Required for default theme compatibility
color: var(--wc-red) !important; // Required for default theme compatibility
text-decoration: none;
font-weight: 700;
border: 0;
&:hover {
color: #fff !important; // Required for default theme compatibility
background: red;
background: var(--wc-red);
}
}
@ -1224,7 +1224,7 @@ p.demo_store,
}
.required {
color: red;
color: var(--wc-red);
font-weight: 700;
border: 0 !important;
text-decoration: none;
@ -1265,13 +1265,13 @@ p.demo_store,
&.woocommerce-invalid {
label {
color: $red;
color: var(--wc-red);
}
.select2-container,
input.input-text,
select {
border-color: $red;
border-color: var(--wc-red);
}
}
@ -1521,7 +1521,7 @@ p.demo_store,
.woocommerce-widget-layered-nav-list__item--chosen a::before {
@include iconbefore("\e013");
color: $red;
color: var(--wc-red);
}
}
@ -1547,7 +1547,7 @@ p.demo_store,
&::before {
@include iconbefore("\e013");
color: $red;
color: var(--wc-red);
vertical-align: inherit;
margin-right: 0.5em;
}
@ -1657,7 +1657,7 @@ p.demo_store,
li.chosen a::before {
@include iconbefore("\e013");
color: $red;
color: var(--wc-red);
}
}
@ -1793,7 +1793,7 @@ p.demo_store,
}
.out-of-stock {
color: red;
color: var(--wc-red);
}
}
@ -2290,7 +2290,7 @@ p.demo_store,
.woocommerce-invalid {
#terms {
outline: 2px solid red;
outline: 2px solid var(--wc-red);
outline-offset: 2px;
}
}