yoma: opportunities - hide the scrollbar on the slider tray (scroll i…

…ssue) and padding of headings (#1201)
didx-xyz · Jan 20, 2025 · 997c6bc · 997c6bc
1 parent 0ca69e4
commit 997c6bc
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/src/web/src/components/Opportunity/OpportunitiesCarousel.tsx b/src/web/src/components/Opportunity/OpportunitiesCarousel.tsx
@@ -114,7 +114,7 @@ const OpportunitiesCarousel: React.FC<{
       step={visibleSlides}
     >
       <div className="mb-2 flex flex-col gap-6">
-        <div className="flex max-w-full flex-row px-0 md:max-w-7xl md:px-2">
+        <div className="flex max-w-full flex-row px-2 md:max-w-7xl">
           <div className="flex flex-grow flex-col">
             <div className="overflow-hidden text-ellipsis whitespace-nowrap text-lg font-semibold text-black md:max-w-[800px] md:text-xl">
               {title}

diff --git a/src/web/src/styles/globals.scss b/src/web/src/styles/globals.scss
@@ -119,8 +119,14 @@ html:has(body.content-overflow-y) {
 .rssas-circle {
   background: theme("colors.purple") !important;
 }
+
+/* Hide the scrollbar on the slider tray */
 .rssas-slider-tray {
-  overflow-x: hidden !important;
+  &::-webkit-scrollbar {
+    display: none; /* Safari and Chrome */
+  }
+  -ms-overflow-style: none; /* IE and Edge */
+  scrollbar-width: none; /* Firefox */
 }
 
 /* Adjust Z-Index for Feedback Button */