From caf1ac04ac6d399a93c8a6ac5243840b06bdf988 Mon Sep 17 00:00:00 2001
From: Bel Curcio <curciobel@gmail.com>
Date: Sat, 5 Jun 2021 15:35:31 -0300
Subject: [PATCH] Missmatch with RightArrow

---
 components/icons/{RightArrow.tsx => ArrowRight.tsx}       | 7 +++----
 components/icons/index.ts                                 | 4 ++--
 components/product/ProductSlider/ProductSlider.module.css | 2 +-
 components/product/ProductSlider/ProductSlider.tsx        | 6 +++---
 components/product/ProductView/ProductView.tsx            | 2 +-
 components/ui/Hero/Hero.tsx                               | 4 ++--
 6 files changed, 12 insertions(+), 13 deletions(-)
 rename components/icons/{RightArrow.tsx => ArrowRight.tsx} (79%)

diff --git a/components/icons/RightArrow.tsx b/components/icons/ArrowRight.tsx
similarity index 79%
rename from components/icons/RightArrow.tsx
rename to components/icons/ArrowRight.tsx
index b7a1579c8..e644951d9 100644
--- a/components/icons/RightArrow.tsx
+++ b/components/icons/ArrowRight.tsx
@@ -1,23 +1,22 @@
-const RightArrow = ({ ...props }) => {
+const ArrowRight = ({ ...props }) => {
   return (
     <svg
       width="24"
       height="24"
       viewBox="0 0 24 24"
       fill="none"
+      stroke="currentColor"
       xmlns="http://www.w3.org/2000/svg"
       {...props}
     >
       <path
         d="M5 12H19"
-        stroke="white"
         strokeWidth="1.5"
         strokeLinecap="round"
         strokeLinejoin="round"
       />
       <path
         d="M12 5L19 12L12 19"
-        stroke="currentColor"
         strokeWidth="1.5"
         strokeLinecap="round"
         strokeLinejoin="round"
@@ -26,4 +25,4 @@ const RightArrow = ({ ...props }) => {
   )
 }
 
-export default RightArrow
+export default ArrowRight
diff --git a/components/icons/index.ts b/components/icons/index.ts
index 58e3f9b0a..97eef6d58 100644
--- a/components/icons/index.ts
+++ b/components/icons/index.ts
@@ -2,18 +2,18 @@ export { default as Bag } from './Bag'
 export { default as Heart } from './Heart'
 export { default as Trash } from './Trash'
 export { default as Cross } from './Cross'
-export { default as ArrowLeft } from './ArrowLeft'
 export { default as Plus } from './Plus'
 export { default as Minus } from './Minus'
 export { default as Check } from './Check'
 export { default as Sun } from './Sun'
 export { default as Moon } from './Moon'
 export { default as Github } from './Github'
-export { default as RightArrow } from './RightArrow'
 export { default as Info } from './Info'
 export { default as Vercel } from './Vercel'
 export { default as MapPin } from './MapPin'
 export { default as Star } from './Star'
+export { default as ArrowLeft } from './ArrowLeft'
+export { default as ArrowRight } from './ArrowRight'
 export { default as CreditCard } from './CreditCard'
 export { default as ChevronUp } from './ChevronUp'
 export { default as ChevronLeft } from './ChevronLeft'
diff --git a/components/product/ProductSlider/ProductSlider.module.css b/components/product/ProductSlider/ProductSlider.module.css
index f77a3738d..d3cedaf7f 100644
--- a/components/product/ProductSlider/ProductSlider.module.css
+++ b/components/product/ProductSlider/ProductSlider.module.css
@@ -35,7 +35,7 @@
 }
 
 .rightControl {
-  @apply border-l;
+  @apply border-l border-accent-0;
 }
 
 .leftControl {
diff --git a/components/product/ProductSlider/ProductSlider.tsx b/components/product/ProductSlider/ProductSlider.tsx
index b8a405d41..c3aa80a93 100644
--- a/components/product/ProductSlider/ProductSlider.tsx
+++ b/components/product/ProductSlider/ProductSlider.tsx
@@ -10,7 +10,7 @@ import React, {
 import cn from 'classnames'
 import { a } from '@react-spring/web'
 import s from './ProductSlider.module.css'
-import { ChevronLeft, ChevronRight } from '@components/icons'
+import { ArrowLeft, ArrowRight } from '@components/icons'
 
 const ProductSlider: FC = ({ children }) => {
   const [currentSlide, setCurrentSlide] = useState(0)
@@ -86,14 +86,14 @@ const ProductSlider: FC = ({ children }) => {
               onClick={slider.prev}
               aria-label="Previous Product Image"
             >
-              <ChevronLeft />
+              <ArrowLeft />
             </button>
             <button
               className={cn(s.rightControl)}
               onClick={slider.next}
               aria-label="Next Product Image"
             >
-              <ChevronRight />
+              <ArrowRight />
             </button>
           </div>
         )}
diff --git a/components/product/ProductView/ProductView.tsx b/components/product/ProductView/ProductView.tsx
index 2c0e70b1e..33e851caa 100644
--- a/components/product/ProductView/ProductView.tsx
+++ b/components/product/ProductView/ProductView.tsx
@@ -155,7 +155,7 @@ const ProductView: FC<ProductViewProps> = ({ product, relatedProducts }) => {
           </div>
         </div>
       </div>
-      <hr className="mt-6" />
+      <hr className="mt-6 border-accent-2" />
       <section className="py-6 px-6 mb-10">
         <Text variant="sectionHeading">Related Products</Text>
         <div className="grid grid-cols-2 py-2 gap-4 md:grid-cols-4 md:gap-20">
diff --git a/components/ui/Hero/Hero.tsx b/components/ui/Hero/Hero.tsx
index 6c2d74c1a..857b1999d 100644
--- a/components/ui/Hero/Hero.tsx
+++ b/components/ui/Hero/Hero.tsx
@@ -1,6 +1,6 @@
 import React, { FC } from 'react'
 import { Container } from '@components/ui'
-import { RightArrow } from '@components/icons'
+import { ArrowRight } from '@components/icons'
 import s from './Hero.module.css'
 import Link from 'next/link'
 interface HeroProps {
@@ -22,7 +22,7 @@ const Hero: FC<HeroProps> = ({ headline, description }) => {
             <Link href="/">
               <a className="text-accent-0 pt-3 font-bold hover:underline flex flex-row cursor-pointer w-max-content">
                 Read it here
-                <RightArrow width="20" heigh="20" className="ml-1" />
+                <ArrowRight width="20" heigh="20" className="ml-1" />
               </a>
             </Link>
           </div>