refactor(css): add new global classes & card border hover styling (#1156)

src/components/Slider/index.tsx

@@ -163,7 +163,9 @@ const Slider: React.FC<SliderProps> = ({
       <div className="absolute right-0 flex -mt-10 text-gray-400">
         <button
           className={`${
-            scrollPos.isStart ? 'cursor-not-allowed text-gray-800' : ''
+            scrollPos.isStart
+              ? 'cursor-not-allowed text-gray-800'
+              : 'hover:text-white'
           }`}
           onClick={() => slide(Direction.LEFT)}
           disabled={scrollPos.isStart}
@@ -185,7 +187,9 @@ const Slider: React.FC<SliderProps> = ({
         </button>
         <button
           className={`${
-            scrollPos.isEnd ? 'cursor-not-allowed text-gray-800' : ''
+            scrollPos.isEnd
+              ? 'cursor-not-allowed text-gray-800'
+              : 'hover:text-white'
           }`}
           onClick={() => slide(Direction.RIGHT)}
           disabled={scrollPos.isEnd}