Fix chevron color

saleor · Jul 11, 2024 · 42c2a17 · 42c2a17
1 parent 54efe2a
commit 42c2a17
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 9 deletions.
diff --git a/components/CardGrid/styles.module.css b/components/CardGrid/styles.module.css
@@ -66,9 +66,10 @@
 }
 
 .cardGrid strong:after {
-  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='12' height='12'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 2.29289C4.68342 1.90237 5.31658 1.90237 5.70711 2.29289L8.70711 5.29289C9.09763 5.68342 9.09763 6.31658 8.70711 6.70711L5.70711 9.70711C5.31658 10.0976 4.68342 10.0976 4.29289 9.70711C3.90237 9.31658 3.90237 8.68342 4.29289 8.29289L6.58579 6L4.29289 3.70711C3.90237 3.31658 3.90237 2.68342 4.29289 2.29289Z' fill='currentColor'/%3E%3C/svg%3E%0A");
-  background-repeat: no-repeat;
-  background-position: center;
+  mask-image: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L4.70711 3.29289C5.09763 3.68342 5.09763 4.31658 4.70711 4.70711L1.70711 7.70711C1.31658 8.09763 0.683417 8.09763 0.292893 7.70711C-0.0976311 7.31658 -0.0976311 6.68342 0.292893 6.29289L2.58579 4L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z' fill='black'/%3E%3C/svg%3E");
+  mask-repeat: no-repeat;
+  mask-position: center center;
+  background-color: var(--gray12);
   width: 16px;
   height: 16px;
   top: 3px;

diff --git a/components/Chapters/styles.module.css b/components/Chapters/styles.module.css
@@ -52,9 +52,10 @@
 }
 
 .grid strong:after {
-  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='12' height='12'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 2.29289C4.68342 1.90237 5.31658 1.90237 5.70711 2.29289L8.70711 5.29289C9.09763 5.68342 9.09763 6.31658 8.70711 6.70711L5.70711 9.70711C5.31658 10.0976 4.68342 10.0976 4.29289 9.70711C3.90237 9.31658 3.90237 8.68342 4.29289 8.29289L6.58579 6L4.29289 3.70711C3.90237 3.31658 3.90237 2.68342 4.29289 2.29289Z' fill='currentColor'/%3E%3C/svg%3E%0A");
-  background-repeat: no-repeat;
-  background-position: center;
+  mask-image: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L4.70711 3.29289C5.09763 3.68342 5.09763 4.31658 4.70711 4.70711L1.70711 7.70711C1.31658 8.09763 0.683417 8.09763 0.292893 7.70711C-0.0976311 7.31658 -0.0976311 6.68342 0.292893 6.29289L2.58579 4L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z' fill='black'/%3E%3C/svg%3E");
+  mask-repeat: no-repeat;
+  mask-position: center center;
+  background-color: var(--gray12);
   width: 16px;
   height: 16px;
   top: 3px;

diff --git a/src/css/primitives/animation.css b/src/css/primitives/animation.css
@@ -40,9 +40,10 @@
 }
 
 .arrow-pointer span:after {
-  background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='12' height='12'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.29289 2.29289C4.68342 1.90237 5.31658 1.90237 5.70711 2.29289L8.70711 5.29289C9.09763 5.68342 9.09763 6.31658 8.70711 6.70711L5.70711 9.70711C5.31658 10.0976 4.68342 10.0976 4.29289 9.70711C3.90237 9.31658 3.90237 8.68342 4.29289 8.29289L6.58579 6L4.29289 3.70711C3.90237 3.31658 3.90237 2.68342 4.29289 2.29289Z' fill='currentColor'/%3E%3C/svg%3E%0A");
-  background-repeat: no-repeat;
-  background-position: center;
+  mask-image: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0.292893 0.292893C0.683417 -0.0976311 1.31658 -0.0976311 1.70711 0.292893L4.70711 3.29289C5.09763 3.68342 5.09763 4.31658 4.70711 4.70711L1.70711 7.70711C1.31658 8.09763 0.683417 8.09763 0.292893 7.70711C-0.0976311 7.31658 -0.0976311 6.68342 0.292893 6.29289L2.58579 4L0.292893 1.70711C-0.0976311 1.31658 -0.0976311 0.683417 0.292893 0.292893Z' fill='black'/%3E%3C/svg%3E");
+  mask-repeat: no-repeat;
+  mask-position: center center;
+  background-color: var(--gray12);
   width: 16px;
   height: 16px;
   top: 3px;