fix: right arrow in carousel not rotated (#5273)

fix: arrow rotate

src/nft/components/icons.tsx

 import React from 'react'
+import styled from 'styled-components/macro'
 
 import { themeVars, vars } from '../css/sprinkles.css'
 
@@ -174,8 +175,6 @@ export const EllipsisIcon = (props: SVGProps) => (
   </svg>
 )
 
-export const ChevronRightIcon = (props: SVGProps) => <ChevronLeftIcon {...props} transform="rotate(180)" />
-
 export const LightningBoltIcon = (props: SVGProps) => (
   <svg {...props} width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path
@@ -603,6 +602,10 @@ export const ChevronLeftIcon = (props: SVGProps) => (
   </svg>
 )
 
+export const ChevronRightIcon = styled(ChevronLeftIcon)`
+  transform: rotate(180deg);
+`
+
 export const TrendingArrow = (props: SVGProps) => (
   <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
     <path