♻️ Add validations and exclude colors #2736

equinor · Jan 21, 2025 · 89cc1aa · 89cc1aa
1 parent 09f5750
commit 89cc1aa
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 8 deletions.
diff --git a/sanityv3/schemas/objects/stickyMenu.tsx b/sanityv3/schemas/objects/stickyMenu.tsx
@@ -1,4 +1,9 @@
 import { Rule } from 'sanity'
+import { defaultColors } from '../defaultColors'
+import { description } from './iframe/sharedIframeFields'
+
+const chosenColors = ['White', 'Moss Green Light']
+const backgroundColors = defaultColors.filter((color) => chosenColors.includes(color.title))
 
 export default {
   name: 'stickyMenu',
@@ -21,13 +26,22 @@ export default {
         },
         { type: 'downloadableFile', title: 'Downloadable file' },
       ],
-      validation: (Rule: Rule) => Rule.unique().max(2),
+      validation: (Rule: Rule) =>
+        Rule.unique()
+          .max(2)
+          .custom((value: any) => {
+            if (value.length == 2 && value[0]._type == value[1]._type) return 'Cannot have two links of same type'
+            return true
+          }),
     },
     {
       title: 'Color',
       description: 'Default is white.',
       name: 'backgroundColor',
       type: 'colorlist',
+      options: {
+        colors: backgroundColors,
+      },
     },
   ],
 }
diff --git a/web/core/Link/StickyMenuLink.tsx b/web/core/Link/StickyMenuLink.tsx
@@ -2,7 +2,7 @@ import { forwardRef } from 'react'
 import { twMerge } from 'tailwind-merge'
 import { BaseLink, BaseLinkProps } from './BaseLink'
 import { TransformableIcon } from '../../icons/TransformableIcon'
-import { arrow_down, download, library_pdf } from '@equinor/eds-icons'
+import { arrow_down, library_pdf } from '@equinor/eds-icons'
 
 export type StickMenuLinkProps = {
   isDownloadable?: boolean
@@ -35,12 +35,22 @@ export const StickyMenuLink = forwardRef<HTMLAnchorElement, StickMenuLinkProps>(
     <BaseLink className={classNames} ref={ref} href={href} {...rest}>
       {isDownloadable && <TransformableIcon iconData={library_pdf} className="mr-1" />}
       <span className={contentClassNames}>{children}</span>
-      <TransformableIcon
-        iconData={isDownloadable ? download : arrow_down}
-        className="text-energy-red-100
+      {isDownloadable && (
+        <TransformableIcon
+          iconData={arrow_down}
+          className="text-energy-red-100
+    dark:text-white-100 h-[22px] border-energy-red-100 border-b-[2px]
+    ml-2"
+        />
+      )}
+      {!isDownloadable && (
+        <TransformableIcon
+          iconData={arrow_down}
+          className="text-energy-red-100
     dark:text-white-100
     ml-2"
-      />
+        />
+      )}
     </BaseLink>
   )
 })

diff --git a/web/pageComponents/shared/Header.tsx b/web/pageComponents/shared/Header.tsx
@@ -154,9 +154,9 @@ const Header = ({ slugs, menuData, stickyMenuData }: HeaderProps) => {
           </Topbar.InnerContainer>
         </Topbar>
         {stickyMenuData && (
-          <div className="w-full bg-moss-green-50 p-4 grid grid-cols-2 lg:grid-cols-5 gap-2 lg:px-16 lg:gap-16 shadow-top-bar z-40">
+          <div className="w-full items-center bg-moss-green-50 p-4 grid grid-cols-2 lg:grid-cols-5 gap-2 lg:px-16 lg:gap-16 shadow-top-bar z-40">
             <div className="text-center font-bold lg:col-span-3 text-md col-span-2"> {stickyMenuData?.title}</div>
-            <StickyMenuLink className="mr-4" href={`#${anchorReference?.anchorReference}`}>
+            <StickyMenuLink className="mr-4 place-self-end self-center" href={`#${anchorReference?.anchorReference}`}>
               {anchorReference?.title}
             </StickyMenuLink>
             {resourceLink && (