From d9988844c5c7ee8c26d10a8fc360d32e4b009a70 Mon Sep 17 00:00:00 2001 From: Ane Date: Fri, 25 Oct 2024 16:25:11 +0200 Subject: [PATCH 01/13] functioning breadcrumb menu --- src/components/navigation/header/Header.tsx | 26 ++++++++++++++ .../navigation/header/header.module.css | 36 +++++++++++++++++++ 2 files changed, 62 insertions(+) diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index 913571b4c..5a0309c9f 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -120,11 +120,37 @@ export const Header = ({ )} + {breadCrumb(currentLanguage, pathname)} ); }; +export const breadCrumb = (currentLanguage: string, pathname: string) => ( +
+ {["Home", ...pathname.split("/").slice(2)].map((e, index, array) => { + const href = + "/" + currentLanguage + "/" + array.slice(1, index + 1).join("/"); + const isActive = href === "/" + pathname.slice(1); + //TODO: Fix this logic for the styling + + return ( +
+ + {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} + + {index < array.length - 1 && ( + • + )} +
+ ); + })} +
+); + export const renderPageLinks = ( links: ILink[], isMobile: boolean, diff --git a/src/components/navigation/header/header.module.css b/src/components/navigation/header/header.module.css index a7c0cd7a4..ad65a826b 100644 --- a/src/components/navigation/header/header.module.css +++ b/src/components/navigation/header/header.module.css @@ -153,3 +153,39 @@ composes: button; background: url("/_assets/menu-close.svg") no-repeat 50% 50%; } + +.breadCrumbMenu { + font-size: 1rem; + font-weight: 500; + color: var(--primary-text); + display: flex; + flex-direction: row; + gap: 1rem; + align-items: center; +} + +.breadcrumb { + display: flex; + flex-direction: row; + gap: 1rem; + align-items: center; +} + +.dotSeparator { + font-size: 1rem; + font-weight: 500; + color: var(--primary-text); +} + +.breadCrumbLinks { + font-size: 1rem; + font-weight: 500; + color: var(--primary-text); + text-decoration: none; + border-bottom: 1px solid var(--primary-bg-dark); +} + +.activeBreadCrumb { + border-bottom: none; + font-weight: bold; +} From f30dd01db4c6bd2242155eebeb3f9711f435c0ed Mon Sep 17 00:00:00 2001 From: Ane Date: Tue, 29 Oct 2024 19:36:35 +0100 Subject: [PATCH 02/13] breadcrumbMenu --- src/components/navigation/header/Header.tsx | 148 ++++++++++-------- .../navigation/header/header.module.css | 44 +++--- src/components/text/text.module.css | 26 +-- src/styles/global.css | 3 + 4 files changed, 119 insertions(+), 102 deletions(-) diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index 5a0309c9f..8b17111bc 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -10,6 +10,7 @@ import { SanityImage } from "src/components/image/SanityImage"; import LanguageSwitcher from "src/components/languageSwitcher/LanguageSwitcher"; import CustomLink from "src/components/link/CustomLink"; import LinkButton from "src/components/linkButton/LinkButton"; +import Text from "src/components/text/Text"; import { getHref } from "src/utils/link"; import { BrandAssets } from "studio/lib/interfaces/brandAssets"; import { InternationalizedString } from "studio/lib/interfaces/global"; @@ -68,87 +69,98 @@ export const Header = ({ }, []); return ( - -
- +
+ + {breadCrumb(currentLanguage, pathname)} + ); }; export const breadCrumb = (currentLanguage: string, pathname: string) => ( -
- {["Home", ...pathname.split("/").slice(2)].map((e, index, array) => { +
    + {["Home", ...pathname.split("/").slice(2)].map((e, index, path) => { const href = - "/" + currentLanguage + "/" + array.slice(1, index + 1).join("/"); - const isActive = href === "/" + pathname.slice(1); - //TODO: Fix this logic for the styling + "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); + const isLast = index === path.length - 1; return ( -
    - - {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} +
  • + + + {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} + - {index < array.length - 1 && ( - • + {!isLast && ( + + • + )} -
    • + ); })} -
+ ); export const renderPageLinks = ( diff --git a/src/components/navigation/header/header.module.css b/src/components/navigation/header/header.module.css index cb7fb27b0..646d47b48 100644 --- a/src/components/navigation/header/header.module.css +++ b/src/components/navigation/header/header.module.css @@ -6,10 +6,6 @@ background-color: var(--primary-black); } -.scrolled { - background-color: var(--primary-black); -} - .isOpen { height: 100vh; display: flex; @@ -151,37 +147,41 @@ } .breadCrumbMenu { - font-size: 1rem; - font-weight: 500; + position: relative; color: var(--primary-text); + background-color: var(--primary-bg); display: flex; flex-direction: row; - gap: 1rem; + gap: 0.5rem; align-items: center; + list-style: none; + text-decoration: none; } -.breadcrumb { +.breadCrumb { display: flex; flex-direction: row; - gap: 1rem; align-items: center; + gap: 0.5rem; + color: var(--primary-black); + text-decoration: none; + list-style: none; } -.dotSeparator { - font-size: 1rem; - font-weight: 500; - color: var(--primary-text); +.breadCrumbText { + color: var(--primary-black); } -.breadCrumbLinks { - font-size: 1rem; - font-weight: 500; - color: var(--primary-text); - text-decoration: none; - border-bottom: 1px solid var(--primary-bg-dark); +.breadCrumbLink { + color: var(--primary-black); + text-decoration: underline; +} + +.dotSeparator { + font-size: 2.5em; } -.activeBreadCrumb { - border-bottom: none; - font-weight: bold; +.lastDotSeparator { + font-size: 2.5em; + color: var(--secondary-red); } diff --git a/src/components/text/text.module.css b/src/components/text/text.module.css index 750297b3c..5d26e52e2 100644 --- a/src/components/text/text.module.css +++ b/src/components/text/text.module.css @@ -66,14 +66,10 @@ /* .h6 */ .desktopLink { - font-size: 10rem; - line-height: 100%; - font-weight: 500; - - @media (min-width: 1024px) { - font-size: 5.25rem; - line-height: normal; - } + font-size: 1rem; + font-style: normal; + font-weight: 400; + line-height: 110%; } .bodyXl { @@ -137,8 +133,14 @@ line-height: 120%; } +.labelSemibold { + font-size: 1rem; + font-style: normal; + font-weight: 600; + line-height: 120%; +} + /* TODO: add font variables */ -/* .labelSemibold, */ -/* .labelBold, */ -/* .quoteItalic, */ -/* .quoteNormal, */ +/* .labelBold */ +/* .quoteItalic */ +/* .quoteNormal */ diff --git a/src/styles/global.css b/src/styles/global.css index 4361eb38e..2fc66851d 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -26,6 +26,9 @@ html { --focus-color: #8b0f40; + /* TODO: upgrade color-scheme with correct colors */ + --secondary-red: #f0503f; + /* breakpoints */ --breakpoint-mobile: 767px; --breakpoint-tablet: 640px; From bcf0ae99251c4fd491596a93d2349be65ef711ee Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 08:16:48 +0100 Subject: [PATCH 03/13] remove breadcrumbmenu from homepage --- src/components/navigation/header/Header.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index 8b17111bc..ef35828f4 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -124,7 +124,9 @@ export const Header = ({ - {breadCrumb(currentLanguage, pathname)} + {pathname !== "/" && + pathname !== "/" + currentLanguage && + breadCrumb(currentLanguage, pathname)} ); }; From 8338a99595952b7ac7cd50042bf6d4a033f33546 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 09:22:29 +0100 Subject: [PATCH 04/13] Add todo --- src/components/navigation/header/Header.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index ef35828f4..a173260c1 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -133,6 +133,7 @@ export const Header = ({ export const breadCrumb = (currentLanguage: string, pathname: string) => (
    + {/* TODO: Home should be updated with translation */} {["Home", ...pathname.split("/").slice(2)].map((e, index, path) => { const href = "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); From 0e1a46ac23055ca060d508864b1baee79aa8c790 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 13:29:05 +0100 Subject: [PATCH 05/13] fixes from review --- src/components/navigation/header/Header.tsx | 88 ++++++++++++--------- 1 file changed, 51 insertions(+), 37 deletions(-) diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index a173260c1..165db3407 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -27,6 +27,11 @@ export interface IHeader { pathTranslations: InternationalizedString; } +export interface BreadCrumbProps { + currentLanguage: string; + pathname: string; +} + const filterLinks = (data: ILink[], type: string) => data?.filter((link) => link._type === type); @@ -124,47 +129,56 @@ export const Header = ({ - {pathname !== "/" && - pathname !== "/" + currentLanguage && - breadCrumb(currentLanguage, pathname)} + {pathname !== "/" && pathname !== "/" + currentLanguage && ( + + )} ); }; -export const breadCrumb = (currentLanguage: string, pathname: string) => ( -
      - {/* TODO: Home should be updated with translation */} - {["Home", ...pathname.split("/").slice(2)].map((e, index, path) => { - const href = - "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); - const isLast = index === path.length - 1; - - return ( -
    • - - - {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} - - - {!isLast && ( - - • - - )} -
      • - ); - })} -
    -); +export const BreadCrumb = ({ currentLanguage, pathname }: BreadCrumbProps) => { + return ( +
      + {/* TODO: "Hjem" should be updated with translation */} + {[ + "Hjem", + ...(pathname.includes("/" + currentLanguage + "/") + ? pathname.split("/").slice(2) + : pathname.split("/").slice(1)), + ].map((e, index, path) => { + const href = + "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); + const isLast = index === path.length - 1; + + return ( +
    • + + + {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} + + + {!isLast && ( + + • + + )} +
      • + ); + })} +
    + ); +}; export const renderPageLinks = ( links: ILink[], From 6e00a12d21cbcbf74995844bd39f02082621239d Mon Sep 17 00:00:00 2001 From: anemne <63043552+anemne@users.noreply.github.com> Date: Wed, 30 Oct 2024 13:30:02 +0100 Subject: [PATCH 06/13] Update src/components/navigation/header/header.module.css Co-authored-by: Mathias Oterhals Myklebust <24361490+mathiazom@users.noreply.github.com> --- src/components/navigation/header/header.module.css | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/navigation/header/header.module.css b/src/components/navigation/header/header.module.css index 646d47b48..b7053b8e2 100644 --- a/src/components/navigation/header/header.module.css +++ b/src/components/navigation/header/header.module.css @@ -177,11 +177,10 @@ text-decoration: underline; } -.dotSeparator { +.dotSeparator, .lastDotSeparator { font-size: 2.5em; } .lastDotSeparator { - font-size: 2.5em; color: var(--secondary-red); } From 44dc77ab98f0495267d5fc6c567ee47c9bc09f38 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 13:32:23 +0100 Subject: [PATCH 07/13] lint fix --- src/components/navigation/header/header.module.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/navigation/header/header.module.css b/src/components/navigation/header/header.module.css index b7053b8e2..1ddfb2ff8 100644 --- a/src/components/navigation/header/header.module.css +++ b/src/components/navigation/header/header.module.css @@ -177,7 +177,8 @@ text-decoration: underline; } -.dotSeparator, .lastDotSeparator { +.dotSeparator, +.lastDotSeparator { font-size: 2.5em; } From 35dd88717c6242342ac44225e004524261925cc9 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 15:09:52 +0100 Subject: [PATCH 08/13] move breadcrumbmenu to own component --- .../breadCrumbMenu/BreadCrumbMenu.tsx | 57 +++++++++++++++++++ .../breadCrumbMenu/breadCrumbMenu.module.css | 39 +++++++++++++ src/components/navigation/header/Header.tsx | 53 +---------------- .../navigation/header/header.module.css | 40 ------------- 4 files changed, 98 insertions(+), 91 deletions(-) create mode 100644 src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx create mode 100644 src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx new file mode 100644 index 000000000..946e1ce3c --- /dev/null +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -0,0 +1,57 @@ +import Link from "next/link"; + +import Text from "src/components/text/Text"; + +import styles from "./breadCrumbMenu.module.css"; + +export interface BreadCrumbProps { + currentLanguage: string; + pathname: string; +} + +export const BreadCrumbMenu = ({ + currentLanguage, + pathname, +}: BreadCrumbProps) => { + return ( +
      + {/* TODO: "Hjem" should be updated with translation */} + {[ + "Hjem", + ...(pathname.includes("/" + currentLanguage + "/") + ? pathname.split("/").slice(2) + : pathname.split("/").slice(1)), + ].map((e, index, path) => { + const href = + "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); + const isLast = index === path.length - 1; + + return ( +
    • + + + {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} + + + {!isLast && ( + + • + + )} +
      • + ); + })} +
    + ); +}; diff --git a/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css b/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css new file mode 100644 index 000000000..41b4dd788 --- /dev/null +++ b/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css @@ -0,0 +1,39 @@ +.breadCrumbMenu { + /* position: relative; */ + color: var(--primary-black); + background-color: var(--primary-bg); + display: flex; + flex-direction: row; + gap: 0.5rem; + align-items: center; + list-style: none; + text-decoration: none; + } + + .breadCrumb { + display: flex; + flex-direction: row; + align-items: center; + gap: 0.5rem; + color: var(--primary-black); + text-decoration: none; + list-style: none; + } + + .breadCrumbText { + color: var(--primary-black); + } + + .breadCrumbLink { + color: var(--primary-black); + text-decoration: underline; + } + + .dotSeparator, + .lastDotSeparator { + font-size: 2.5em; + } + + .lastDotSeparator { + color: var(--secondary-red); + } \ No newline at end of file diff --git a/src/components/navigation/header/Header.tsx b/src/components/navigation/header/Header.tsx index 165db3407..819e21665 100644 --- a/src/components/navigation/header/Header.tsx +++ b/src/components/navigation/header/Header.tsx @@ -10,7 +10,7 @@ import { SanityImage } from "src/components/image/SanityImage"; import LanguageSwitcher from "src/components/languageSwitcher/LanguageSwitcher"; import CustomLink from "src/components/link/CustomLink"; import LinkButton from "src/components/linkButton/LinkButton"; -import Text from "src/components/text/Text"; +import { BreadCrumbMenu } from "src/components/navigation/breadCrumbMenu/BreadCrumbMenu"; import { getHref } from "src/utils/link"; import { BrandAssets } from "studio/lib/interfaces/brandAssets"; import { InternationalizedString } from "studio/lib/interfaces/global"; @@ -27,11 +27,6 @@ export interface IHeader { pathTranslations: InternationalizedString; } -export interface BreadCrumbProps { - currentLanguage: string; - pathname: string; -} - const filterLinks = (data: ILink[], type: string) => data?.filter((link) => link._type === type); @@ -130,56 +125,12 @@ export const Header = ({ {pathname !== "/" && pathname !== "/" + currentLanguage && ( - + )} ); }; -export const BreadCrumb = ({ currentLanguage, pathname }: BreadCrumbProps) => { - return ( -
      - {/* TODO: "Hjem" should be updated with translation */} - {[ - "Hjem", - ...(pathname.includes("/" + currentLanguage + "/") - ? pathname.split("/").slice(2) - : pathname.split("/").slice(1)), - ].map((e, index, path) => { - const href = - "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); - const isLast = index === path.length - 1; - - return ( -
    • - - - {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} - - - {!isLast && ( - - • - - )} -
      • - ); - })} -
    - ); -}; - export const renderPageLinks = ( links: ILink[], isMobile: boolean, diff --git a/src/components/navigation/header/header.module.css b/src/components/navigation/header/header.module.css index 1ddfb2ff8..e22c1497a 100644 --- a/src/components/navigation/header/header.module.css +++ b/src/components/navigation/header/header.module.css @@ -145,43 +145,3 @@ composes: button; background: url("/_assets/menu-close.svg") no-repeat 50% 50%; } - -.breadCrumbMenu { - position: relative; - color: var(--primary-text); - background-color: var(--primary-bg); - display: flex; - flex-direction: row; - gap: 0.5rem; - align-items: center; - list-style: none; - text-decoration: none; -} - -.breadCrumb { - display: flex; - flex-direction: row; - align-items: center; - gap: 0.5rem; - color: var(--primary-black); - text-decoration: none; - list-style: none; -} - -.breadCrumbText { - color: var(--primary-black); -} - -.breadCrumbLink { - color: var(--primary-black); - text-decoration: underline; -} - -.dotSeparator, -.lastDotSeparator { - font-size: 2.5em; -} - -.lastDotSeparator { - color: var(--secondary-red); -} From d3f1953de43eced5e29be7e16a282c5bd13f5df2 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 15:26:21 +0100 Subject: [PATCH 09/13] move dot to front of breadcrumb --- .../breadCrumbMenu/BreadCrumbMenu.tsx | 22 +++--- .../breadCrumbMenu/breadCrumbMenu.module.css | 75 +++++++++---------- 2 files changed, 48 insertions(+), 49 deletions(-) diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx index 946e1ce3c..fedf17b6d 100644 --- a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -29,6 +29,17 @@ export const BreadCrumbMenu = ({ return (
  • + {index !== 0 && ( + + • + + )} - {!isLast && ( - - • - - )}
    • ); })} diff --git a/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css b/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css index 41b4dd788..0bccd2c4b 100644 --- a/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css +++ b/src/components/navigation/breadCrumbMenu/breadCrumbMenu.module.css @@ -1,39 +1,38 @@ .breadCrumbMenu { - /* position: relative; */ - color: var(--primary-black); - background-color: var(--primary-bg); - display: flex; - flex-direction: row; - gap: 0.5rem; - align-items: center; - list-style: none; - text-decoration: none; - } - - .breadCrumb { - display: flex; - flex-direction: row; - align-items: center; - gap: 0.5rem; - color: var(--primary-black); - text-decoration: none; - list-style: none; - } - - .breadCrumbText { - color: var(--primary-black); - } - - .breadCrumbLink { - color: var(--primary-black); - text-decoration: underline; - } - - .dotSeparator, - .lastDotSeparator { - font-size: 2.5em; - } - - .lastDotSeparator { - color: var(--secondary-red); - } \ No newline at end of file + color: var(--primary-black); + background-color: var(--primary-bg); + display: flex; + flex-direction: row; + gap: 0.5rem; + align-items: center; + list-style: none; + text-decoration: none; +} + +.breadCrumb { + display: flex; + flex-direction: row; + align-items: center; + gap: 0.5rem; + color: var(--primary-black); + text-decoration: none; + list-style: none; +} + +.breadCrumbText { + color: var(--primary-black); +} + +.breadCrumbLink { + color: var(--primary-black); + text-decoration: underline; +} + +.dotSeparator, +.lastDotSeparator { + font-size: 2.5em; +} + +.lastDotSeparator { + color: var(--secondary-red); +} From 9cae5443c5bf59f1f5832938c80d2f71ea9eeb25 Mon Sep 17 00:00:00 2001 From: anemne <63043552+anemne@users.noreply.github.com> Date: Wed, 30 Oct 2024 15:48:18 +0100 Subject: [PATCH 10/13] Update src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx Co-authored-by: Mathias Oterhals Myklebust <24361490+mathiazom@users.noreply.github.com> --- src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx index fedf17b6d..7278292bb 100644 --- a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -32,9 +32,9 @@ export const BreadCrumbMenu = ({ {index !== 0 && ( • From 318283802a27a0ad885d697364a16613e5a545a5 Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 15:51:24 +0100 Subject: [PATCH 11/13] e --> slug --- src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx index fedf17b6d..10a654f3f 100644 --- a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -21,7 +21,7 @@ export const BreadCrumbMenu = ({ ...(pathname.includes("/" + currentLanguage + "/") ? pathname.split("/").slice(2) : pathname.split("/").slice(1)), - ].map((e, index, path) => { + ].map((slug, index, path) => { const href = "/" + currentLanguage + "/" + path.slice(1, index + 1).join("/"); const isLast = index === path.length - 1; @@ -46,7 +46,7 @@ export const BreadCrumbMenu = ({ } type={isLast ? "labelSemibold" : "desktopLink"} > - {e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()} + {slug.charAt(0).toUpperCase() + slug.slice(1).toLowerCase()} From 9ff3ba752d6df4f5fc62d93929a718b6629654ce Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 15:53:30 +0100 Subject: [PATCH 12/13] prettier --- src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx index 43c490c22..104ae151e 100644 --- a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -32,9 +32,7 @@ export const BreadCrumbMenu = ({ {index !== 0 && ( • From a9bcccc2a27e1fbc0d8c486c4e2e8310a9444d7b Mon Sep 17 00:00:00 2001 From: Ane Date: Wed, 30 Oct 2024 15:56:02 +0100 Subject: [PATCH 13/13] add check --- src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx index 104ae151e..3502d9554 100644 --- a/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx +++ b/src/components/navigation/breadCrumbMenu/BreadCrumbMenu.tsx @@ -44,7 +44,8 @@ export const BreadCrumbMenu = ({ } type={isLast ? "labelSemibold" : "desktopLink"} > - {slug.charAt(0).toUpperCase() + slug.slice(1).toLowerCase()} + {slug.charAt(0).toUpperCase() + + (slug.length > 1 ? slug.slice(1).toLowerCase() : "")}