🎨 Refactor link and button styles and more common styling #2721

sanityv3/schemas/objects/teaser.tsx

@@ -152,12 +152,6 @@ export default {
       ],
       validation: (Rule: Rule) => Rule.max(2).error('Only two action is permitted'),
     },
-    {
-      title: 'Use resource link style',
-      description: 'Default is read more link style',
-      name: 'useResourceLinks',
-      type: 'boolean',
-    },
     {
       name: 'image',
       title: 'Image',

sanityv3/schemas/objects/textBlock.tsx

@@ -51,7 +51,6 @@ type TextBlock = {
   bigText?: PortableTextBlock[]
   action?: Reference[]
   splitList?: boolean
-  overrideButtonStyle?: boolean
   background?: ColorSelectorValue
 }
 
@@ -193,18 +192,6 @@ export default {
       description:
         'You can also display links/downloads as two columns if there are a lot of links. Ensure that titles are short enough to do this.',
     },
-    {
-      title: 'Use link style',
-      name: 'overrideButtonStyle',
-      type: 'boolean',
-      fieldset: 'actions',
-      initialValue: false,
-      description:
-        'You can override the default button style to link style. This can only be done if you have one link, and should be used with caution.',
-      readOnly: ({ parent }: { parent: TextBlock }) => {
-        return !(parent.action && parent?.action.length === 1)
-      },
-    },
     {
       name: 'designOptions',
       type: 'backgroundOptions',

web/core/Link/BaseLink.tsx

@@ -36,27 +36,43 @@ export const BaseLink = forwardRef<HTMLAnchorElement, BaseLinkProps>(function Ba
         className,
       )
 
-  return type === 'externalUrl' ? (
-    // https://web.dev/articles/referrer-best-practices
-    // strict-origin-when-cross-origin only share the origin
-    // and thus protects privacy but gives Referrer origin
-    // for SEO
-    // eslint-disable-next-line react/jsx-no-target-blank
-    <a
-      className={classNames}
-      ref={ref}
-      href={href}
-      target="_blank"
-      {...rest}
-      rel="noopener"
-      referrerPolicy="strict-origin-when-cross-origin"
-    >
-      {children}
-    </a>
-  ) : (
-    <NextLink ref={ref} href={href} prefetch={false} className={classNames} {...rest}>
-      {children}
-    </NextLink>
-  )
+  const getLinkElement = () => {
+    switch (type) {
+      case 'externalUrl':
+        return (
+          // https://web.dev/articles/referrer-best-practices
+          // strict-origin-when-cross-origin only share the origin
+          // and thus protects privacy but gives Referrer origin
+          // for SEO
+          // eslint-disable-next-line react/jsx-no-target-blank
+          <a
+            className={classNames}
+            ref={ref}
+            href={href}
+            target="_blank"
+            {...rest}
+            rel="noopener"
+            referrerPolicy="strict-origin-when-cross-origin"
+          >
+            {children}
+          </a>
+        )
+      case 'icsLink':
+        return (
+          <a className={classNames} ref={ref} href={href} {...rest}>
+            {children}
+          </a>
+        )
+
+      default:
+        return (
+          <NextLink ref={ref} href={href} prefetch={false} className={classNames} {...rest}>
+            {children}
+          </NextLink>
+        )
+    }
+  }
+
+  return getLinkElement()
 })
 export default BaseLink

web/core/Link/Link.tsx

@@ -18,15 +18,16 @@ export const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(
     items-center
     gap-2.5
     underline
-    hover:no-underline
+    hover:text-norwegian-woods-100
+    dark:hover:text-slate-blue-95
   `,
     className,
   )
 
   return (
     <BaseLink className={classNames} type={type} ref={ref} href={href} {...rest}>
       {children}
-      {type === 'externalUrl' && <ArrowRight className="inline-block pt-1 -rotate-45 origin-bottom-left" />}
+      {type === 'externalUrl' && <ArrowRight className="text-no inline-block pt-1 -rotate-45 origin-bottom-left" />}
     </BaseLink>
   )
 })