Reduce images gray haze on menuItems and flatpage children cards

GeotrekCE · Jun 6, 2024 · d4e6fd9 · d4e6fd9
1 parent 761a8fb
commit d4e6fd9
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/frontend/src/components/Header/BurgerMenuSection/BurgerMenuSection.tsx b/frontend/src/components/Header/BurgerMenuSection/BurgerMenuSection.tsx
@@ -102,7 +102,7 @@ const MobileMenuItem = ({
         className={cn(
           'flex hover:text-primary3 focus:text-primary3 transition',
           hasThumbnail &&
-            "relative rounded-xl overflow-hidden group after:absolute after:inset-0 after:content-[''] after:bg-black/25",
+            "relative rounded-xl overflow-hidden group after:absolute after:content-[''] after:right-0 after:bottom-0 after:left-0 after:h-1/2 after:bg-gradient-to-t after:from-blackSemiTransparent after:via-blackSemiTransparent",
         )}
         onClick={handleCloseMenu}
       >

diff --git a/frontend/src/components/InlineMenu/Menu.tsx b/frontend/src/components/InlineMenu/Menu.tsx
@@ -124,7 +124,7 @@ export const Menu: React.FC<MenuProps> = ({
                         key={item.id}
                         item={item}
                         className={
-                          "relative rounded-xl overflow-hidden group after:absolute after:inset-0 after:content-[''] after:bg-black/25"
+                          "relative rounded-xl overflow-hidden group after:absolute after:content-[''] after:right-0 after:bottom-0 after:left-0 after:h-1/2 after:bg-gradient-to-t after:from-blackSemiTransparent after:via-blackSemiTransparent"
                         }
                       >
                         <Image

diff --git a/frontend/src/components/pages/flatPage/FlatPage.tsx b/frontend/src/components/pages/flatPage/FlatPage.tsx
@@ -153,7 +153,7 @@ export const FlatPageUI: React.FC<FlatPageUIProps> = ({ flatPageUrl }) => {
                   {flatPage.children.map(child => (
                     <li key={child.id}>
                       <a
-                        className="relative block aspect-square rounded-xl overflow-hidden group after:absolute bg-gradient-to-t from-blackSemiTransparent via-to-transparent to-transparent after:inset-0 after:content-[''] after:bg-black/25"
+                        className="relative block aspect-square rounded-xl overflow-hidden group after:absolute after:content-[''] after:right-0 after:bottom-0 after:left-0 after:h-1/2 after:bg-gradient-to-t after:from-blackSemiTransparent after:via-blackSemiTransparent"
                         href={generateFlatPageUrl(child.id, child.title)}
                       >
                         <Image