🎨 remove em and strong from promotion card ingress #2401 (#2404)

* 🎨 remove em and strong from promotion card ingress * 🎨 update base styling
equinor · Jul 5, 2024 · cda5fc0 · cda5fc0
1 parent 6e865b1
commit cda5fc0
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 0 deletions.
diff --git a/web/pageComponents/shared/portableText/Blocks.tsx b/web/pageComponents/shared/portableText/Blocks.tsx
@@ -132,6 +132,7 @@ const inlineBlockTypes = ['block', 'positionedInlineImage', 'pullQuote', 'basicI
 export default function Blocks({
   value,
   blocks: blocksComponents,
+  marks: marksComponents,
   components,
   proseClassName = '',
   className = '',
@@ -170,6 +171,7 @@ export default function Blocks({
                     types: { ...defaultSerializers.types },
                     marks: {
                       ...defaultSerializers.marks,
+                      ...marksComponents,
                       ...(includeFootnotes && footnoteSerializer),
                     },
                   }}

diff --git a/web/sections/cards/PromotionCard/PromotionCard.tsx b/web/sections/cards/PromotionCard/PromotionCard.tsx
@@ -53,6 +53,10 @@ const PromotionCard = forwardRef<HTMLAnchorElement, PromotionCardProps>(function
             value={ingress}
             className={` max-w-prose grow ${type !== 'news' && type !== 'localNews' ? '' : 'hidden lg:block'}`}
             {...(!(variant === 'single' && !isMobile) && { clampLines: isMobile ? 3 : 5 })}
+            marks={{
+              em: ({ children }: { children?: React.ReactNode }) => <>{children}</>,
+              strong: ({ children }: { children?: React.ReactNode }) => <>{children}</>,
+            }}
           />
         )}
       </Card.Content>

diff --git a/web/styles/tailwind.css b/web/styles/tailwind.css
@@ -4,6 +4,18 @@
 @import './components/videojs.css';
 @import 'tailwindcss/utilities';
 
+@layer base {
+  p,
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    overflow-wrap: break-word;
+  }
+}
+
 @layer components {
   article {
     counter-reset: footnotes;