Fixed stories preview buttons color

front/src/components/StoriesPreview.tsx

@@ -1,6 +1,5 @@
 import { Link } from 'react-router-dom'
 import { useEffect, useLayoutEffect, useRef, useState } from 'react'
-import { Button } from 'react-bootstrap'
 
 import { UserCategory, composeUserCategoriesFilters, userCategoriesInfos } from '../assets/userCategories'
 import { Announcement } from '../api/announcement/types'
@@ -96,9 +95,9 @@ function StoriesPreviewCarousel({ announcements, category }: StoriesPreviewProps
 
     return <div className={styles.container}>
         {showScrollButtons.left &&
-            <Button onClick={doScroll(false)} className={`${styles.scrollButton} ${styles.leftScrollButton}`}>
+            <button onClick={doScroll(false)} className={`${styles.scrollButton} ${styles.leftScrollButton}`}>
                 <img src={rightAngleIcon} alt='Показать ещё' />
-            </Button>
+            </button>
         }
 
         <ul className={styles.list} ref={ulElement}>
@@ -106,9 +105,9 @@ function StoriesPreviewCarousel({ announcements, category }: StoriesPreviewProps
         </ul>
 
         {showScrollButtons.right &&
-            <Button onClick={doScroll(true)} className={`${styles.scrollButton} ${styles.rightScrollButton}`}>
+            <button onClick={doScroll(true)} className={`${styles.scrollButton} ${styles.rightScrollButton}`}>
                 <img src={rightAngleIcon} alt='Показать ещё' />
-            </Button>
+            </button>
         }
     </div>
 }

front/src/styles/StoriesPreview.module.css

@@ -42,6 +42,7 @@
     top: 0;
     z-index: 100;
     background: linear-gradient(to right, rgba(17, 17, 17, 0) 0%, rgba(17, 17, 17, 255) 100%);
+    background-color: transparent;
     display: block;
     height: 100%;
     width: 10%;