From ce9d9c4ba01075de149f1c56d00398dc20ed783d Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Fri, 29 Aug 2025 12:04:18 -0500 Subject: [PATCH 1/9] remove ribbon component and apply mobile navbar style --- .../error-page/error-page.component.tsx | 15 ------------ .../headers/header/header.component.tsx | 3 --- .../headers/header/header.module.scss | 6 ++++- .../mobile-header/mobile-header.component.tsx | 3 --- .../mobile-header/mobile-header.module.scss | 23 +++++++------------ .../page-header/page-header.component.tsx | 14 ----------- .../theme-toggle/theme-toggle.component.tsx | 10 ++++++++ src/libs/theme/styles/globals.scss | 3 ++- 8 files changed, 25 insertions(+), 52 deletions(-) create mode 100644 src/features/common/components/theme-toggle/theme-toggle.component.tsx diff --git a/src/features/common/components/errors/error-page/error-page.component.tsx b/src/features/common/components/errors/error-page/error-page.component.tsx index 35d32065..bed5838c 100644 --- a/src/features/common/components/errors/error-page/error-page.component.tsx +++ b/src/features/common/components/errors/error-page/error-page.component.tsx @@ -1,7 +1,6 @@ import React from "react"; import styles from "./error-page.module.scss"; import { ShellComponent } from "@/features/common/components/shell/shell.component"; -import { RibbonComponent } from "@/features/common/components/bars/ribbon/ribbon.component"; import { MobileHeaderComponent } from "@/features/common/components/headers/mobile-header/mobile-header.component"; import { HeaderComponent } from "@/features/common/components/headers/header/header.component"; import { FooterComponent } from "@/features/common/components/footer/footer.component"; @@ -33,25 +32,11 @@ export const ErrorPageComponent: React.FC = ({ languageCode={languageCode} dictionary={dictionary.header} siteLogo={} - ribbon={ - - } /> } - ribbon={ - - } />
{children}
diff --git a/src/features/common/components/headers/header/header.component.tsx b/src/features/common/components/headers/header/header.component.tsx index 733b84ca..c2565bed 100644 --- a/src/features/common/components/headers/header/header.component.tsx +++ b/src/features/common/components/headers/header/header.component.tsx @@ -15,14 +15,12 @@ interface HeaderComponentProps { languageCode: string; dictionary: LayoutDictionaryModel["header"]; siteLogo: React.ReactNode; - ribbon: React.ReactNode; } export const HeaderComponent: React.FC = ({ languageCode, dictionary, siteLogo, - ribbon, }) => { const pathname = usePathname(); const pathnameSegments = getPathnameSegments(pathname); @@ -39,7 +37,6 @@ export const HeaderComponent: React.FC = ({ return (
- {ribbon} = ({ languageCode, dictionary, siteLogo, - ribbon, }) => { const pathname = usePathname(); const [currentPathname, setCurrentPathname] = useState(null); @@ -81,7 +79,6 @@ export const MobileHeaderComponent: React.FC = ({ return ( <>
- {ribbon} = ({ languageCode={languageCode} dictionary={layoutDictionary.header} siteLogo={siteLogo} - ribbon={ - - } /> - } /> ); diff --git a/src/features/common/components/theme-toggle/theme-toggle.component.tsx b/src/features/common/components/theme-toggle/theme-toggle.component.tsx new file mode 100644 index 00000000..c68a9ec6 --- /dev/null +++ b/src/features/common/components/theme-toggle/theme-toggle.component.tsx @@ -0,0 +1,10 @@ +interface ThemeToggleComponentProps { + +} + +export const ThemeToggleComponent: React.FC = ({ +}) => { + return ( +
Theme Toggle
+ ); +}; \ No newline at end of file diff --git a/src/libs/theme/styles/globals.scss b/src/libs/theme/styles/globals.scss index 051ef32b..7566b4e7 100644 --- a/src/libs/theme/styles/globals.scss +++ b/src/libs/theme/styles/globals.scss @@ -48,7 +48,8 @@ --color_fg_default: var(--functional-gray-200); --color_fg_link_primary: var(--cloud); - --color_bg_app_bar: rgba(17, 17, 17, 0.66); + --color_bg_app_bar: hsla(0,0%,7%,.04); + --color_bg_app_bar_border: hsla(0, 0%, 7%, .12); --color_bg_app_bar_plain: rgba(17, 17, 17); --color_fg_link: var(--functional-gray-50); From a97e9799fc729bbfbc8f7bea5c2f25bdb3cef2f2 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Wed, 3 Sep 2025 11:41:15 -0500 Subject: [PATCH 2/9] add jwt icon component --- .../common/assets/auth0-logo.component.tsx | 53 +++++++++++ src/features/common/assets/auth0-logo.png | Bin 10297 -> 0 bytes src/features/common/assets/jwt-flower.png | Bin 9814 -> 0 bytes .../common/assets/jwt-logo.component.tsx | 82 ++++++++++++++++++ .../common/assets/jwt-text-logo.component.tsx | 0 .../error-page/error-page.component.tsx | 6 -- .../components/footer/footer.component.tsx | 24 ++--- .../components/footer/footer.module.scss | 5 +- .../headers/header/header.component.tsx | 6 +- .../mobile-header/mobile-header.component.tsx | 6 +- .../page-header/page-header.component.tsx | 4 - .../page-layout/page-layout.component.tsx | 6 -- .../site-brand/site-brand.component.tsx | 21 ++++- .../site-brand/site-brand.module.scss | 36 ++++++++ .../site-logo/site-logo.component.tsx | 38 -------- .../site-logo/site-logo.module.scss | 35 -------- .../models/static-image-metadata.model.ts | 6 +- .../localization/dictionaries/images/en.tsx | 49 +++++++---- .../localization/dictionaries/images/ja.tsx | 49 +++++++---- .../models/images-dictionary.model.ts | 21 +++-- .../services/images-dictionary.service.tsx | 8 +- 21 files changed, 283 insertions(+), 172 deletions(-) create mode 100644 src/features/common/assets/auth0-logo.component.tsx delete mode 100644 src/features/common/assets/auth0-logo.png delete mode 100644 src/features/common/assets/jwt-flower.png create mode 100644 src/features/common/assets/jwt-logo.component.tsx create mode 100644 src/features/common/assets/jwt-text-logo.component.tsx delete mode 100644 src/features/common/components/site-logo/site-logo.component.tsx delete mode 100644 src/features/common/components/site-logo/site-logo.module.scss diff --git a/src/features/common/assets/auth0-logo.component.tsx b/src/features/common/assets/auth0-logo.component.tsx new file mode 100644 index 00000000..22f18ce7 --- /dev/null +++ b/src/features/common/assets/auth0-logo.component.tsx @@ -0,0 +1,53 @@ +interface Auth0LogoComponentProps { + title: string; +} + +export const Auth0LogoComponent: React.FC = ({title}) => { + return ( + + {title} + + + + + + + + + + + ); +}; diff --git a/src/features/common/assets/auth0-logo.png b/src/features/common/assets/auth0-logo.png deleted file mode 100644 index 51ff673587ed990da63d886af34f7c91e460c112..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 10297 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 diff --git a/src/features/common/assets/jwt-flower.png b/src/features/common/assets/jwt-flower.png deleted file mode 100644 index 96b2e51245a113cfddb471aad69344647f623235..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 9814 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 JQbaG{{{U#)s)PUl diff --git a/src/features/common/assets/jwt-logo.component.tsx b/src/features/common/assets/jwt-logo.component.tsx new file mode 100644 index 00000000..57db4704 --- /dev/null +++ b/src/features/common/assets/jwt-logo.component.tsx @@ -0,0 +1,82 @@ +export const JwtLogoComponent: React.FC = () => { + return ( + + + + + + + + + + + + + ); +}; \ No newline at end of file diff --git a/src/features/common/assets/jwt-text-logo.component.tsx b/src/features/common/assets/jwt-text-logo.component.tsx new file mode 100644 index 00000000..e69de29b diff --git a/src/features/common/components/errors/error-page/error-page.component.tsx b/src/features/common/components/errors/error-page/error-page.component.tsx index bed5838c..59032e7f 100644 --- a/src/features/common/components/errors/error-page/error-page.component.tsx +++ b/src/features/common/components/errors/error-page/error-page.component.tsx @@ -7,7 +7,6 @@ import { FooterComponent } from "@/features/common/components/footer/footer.comp import { LayoutDictionaryModel } from "@/features/localization/models/layout-dictionary.model"; import { ThemeCookieValues } from "@/features/common/values/theme.values"; import { getImageDictionary } from "@/features/localization/services/images-dictionary.service"; -import { SiteLogoComponent } from "@/features/common/components/site-logo/site-logo.component"; interface ErrorPageComponentProps { languageCode: string; @@ -22,7 +21,6 @@ export const ErrorPageComponent: React.FC = ({ dictionary, children, }) => { - const images = getImageDictionary(languageCode); return ( @@ -31,20 +29,16 @@ export const ErrorPageComponent: React.FC = ({ } /> } />
{children}
} /> diff --git a/src/features/common/components/footer/footer.component.tsx b/src/features/common/components/footer/footer.component.tsx index 42859a07..719ff3db 100644 --- a/src/features/common/components/footer/footer.component.tsx +++ b/src/features/common/components/footer/footer.component.tsx @@ -15,25 +15,23 @@ import { DEFAULT_LANGUAGE_CODE } from "@/features/localization/localization.conf import { sitePaths } from "@/features/seo/site-tree"; import { createUrlPath } from "@/libs/utils/path.utils"; import { SiteBrandComponent } from "@/features/common/components/site-brand/site-brand.component"; -import { StaticImageMetadataModel } from "@/features/common/models/static-image-metadata.model"; import { Button } from "react-aria-components"; +import { Auth0LogoComponent } from "../../assets/auth0-logo.component"; +import { getImageDictionary } from "@/features/localization/services/images-dictionary.service"; interface FooterComponentProps { languageCode: string; dictionary: LayoutDictionaryModel["footer"]; - auth0Logo: StaticImageMetadataModel; - siteLogo: React.ReactNode; } export const FooterComponent: React.FC = ({ languageCode, dictionary, - auth0Logo, - siteLogo, }) => { const [modalState, setModalState] = useState( ModalStateValues.CLOSED, ); + const images = getImageDictionary(languageCode); const languagePathPrefix: string = languageCode === DEFAULT_LANGUAGE_CODE @@ -66,9 +64,7 @@ export const FooterComponent: React.FC = ({ contentClassName={styles.content} >
- - {siteLogo} - +
@@ -162,17 +158,7 @@ export const FooterComponent: React.FC = ({ target="_blank" href="https://auth0.com/" > - {auth0Logo.alt} + {dictionary.copyright} diff --git a/src/features/common/components/footer/footer.module.scss b/src/features/common/components/footer/footer.module.scss index 0f39c24d..44e04595 100644 --- a/src/features/common/components/footer/footer.module.scss +++ b/src/features/common/components/footer/footer.module.scss @@ -267,8 +267,5 @@ padding-bottom: 1rem; row-gap: 2rem; - color: $neutrals-light-100-snow; - - @media #{$breakpoint-dimension-xs} { - } + color: var(--color_fg_default); } diff --git a/src/features/common/components/headers/header/header.component.tsx b/src/features/common/components/headers/header/header.component.tsx index c2565bed..9a756977 100644 --- a/src/features/common/components/headers/header/header.component.tsx +++ b/src/features/common/components/headers/header/header.component.tsx @@ -14,13 +14,11 @@ import { SiteBrandComponent } from "@/features/common/components/site-brand/site interface HeaderComponentProps { languageCode: string; dictionary: LayoutDictionaryModel["header"]; - siteLogo: React.ReactNode; } export const HeaderComponent: React.FC = ({ languageCode, dictionary, - siteLogo, }) => { const pathname = usePathname(); const pathnameSegments = getPathnameSegments(pathname); @@ -44,9 +42,7 @@ export const HeaderComponent: React.FC = ({ contentClassName={styles.content} aria-label="Main navigation" > - - {siteLogo} - +
    {dictionary.links.map((link) => { diff --git a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx index 3fdd7177..fca3e140 100644 --- a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx +++ b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx @@ -15,13 +15,11 @@ import { SiteBrandComponent } from "@/features/common/components/site-brand/site interface MobileHeaderComponentProps { languageCode: string; dictionary: LayoutDictionaryModel["header"]; - siteLogo: React.ReactNode; } export const MobileHeaderComponent: React.FC = ({ languageCode, dictionary, - siteLogo, }) => { const pathname = usePathname(); const [currentPathname, setCurrentPathname] = useState(null); @@ -86,9 +84,7 @@ export const MobileHeaderComponent: React.FC = ({ contentClassName={styles.content} >
    - - {siteLogo} - +
- +
Debugger diff --git a/src/features/common/components/site-brand/site-brand.module.scss b/src/features/common/components/site-brand/site-brand.module.scss index cb1bdbc6..49a29f01 100644 --- a/src/features/common/components/site-brand/site-brand.module.scss +++ b/src/features/common/components/site-brand/site-brand.module.scss @@ -1,8 +1,11 @@ .brand { - display: flex; - align-items: center; - height: 2rem; - position: relative; + width: 100%; + display: flex; + align-items: center; + height: 1.5rem; + gap: .5rem; + position: relative; + cursor: pointer; svg { height: inherit; @@ -24,9 +27,20 @@ } .brand__logo { - position: relative; - display: flex; - align-items: center; + position: relative; + display: flex; + align-items: center; + height: 1.5rem; + animation: rotate 10s linear infinite; +} + +@keyframes rotate { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(1turn); + } } .brand__headline { From b85f7762e6c2ebf8c5c812c86aebbab9765c835c Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Wed, 3 Sep 2025 17:58:56 -0500 Subject: [PATCH 4/9] style wordmark and subtitle --- .../site-brand/site-brand.component.tsx | 2 +- .../site-brand/site-brand.module.scss | 41 +++++++++++-------- 2 files changed, 25 insertions(+), 18 deletions(-) diff --git a/src/features/common/components/site-brand/site-brand.component.tsx b/src/features/common/components/site-brand/site-brand.component.tsx index 6b1ef20c..f7e7fd1b 100644 --- a/src/features/common/components/site-brand/site-brand.component.tsx +++ b/src/features/common/components/site-brand/site-brand.component.tsx @@ -23,7 +23,7 @@ export const SiteBrandComponent: React.FC = ({
-
+
diff --git a/src/features/common/components/site-brand/site-brand.module.scss b/src/features/common/components/site-brand/site-brand.module.scss index 49a29f01..09dbd56c 100644 --- a/src/features/common/components/site-brand/site-brand.module.scss +++ b/src/features/common/components/site-brand/site-brand.module.scss @@ -1,11 +1,11 @@ .brand { - width: 100%; - display: flex; - align-items: center; - height: 1.5rem; - gap: .5rem; - position: relative; - cursor: pointer; + width: 100%; + display: flex; + align-items: center; + height: 1.5rem; + gap: 0.5rem; + position: relative; + cursor: pointer; svg { height: inherit; @@ -27,11 +27,11 @@ } .brand__logo { - position: relative; - display: flex; - align-items: center; - height: 1.5rem; - animation: rotate 10s linear infinite; + position: relative; + display: flex; + align-items: center; + height: 1.5rem; + animation: rotate 10s linear infinite; } @keyframes rotate { @@ -43,10 +43,16 @@ } } +.brand__wordmark { + position: relative; + display: flex; + align-items: center; + height: 1rem; +} + .brand__headline { display: flex; flex-direction: column; - margin-left: 0.625rem; color: var(--color_fg_bold); } @@ -60,8 +66,9 @@ .brand__subtitle { display: flex; - font-size: 0.75rem; - line-height: 0.75rem; + font-size: 1rem; + font-weight: 500; + line-height: .75rem; margin-top: 1px; - letter-spacing: 0.02rem; -} \ No newline at end of file + letter-spacing: .02rem; +} From 978a7da86c3f7e015a428a0f53398f4ba77d6e27 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Thu, 4 Sep 2025 01:05:14 -0500 Subject: [PATCH 5/9] style dropdown mobile menu --- .../mobile-header/mobile-header.module.scss | 44 ++++++++++--------- 1 file changed, 24 insertions(+), 20 deletions(-) diff --git a/src/features/common/components/headers/mobile-header/mobile-header.module.scss b/src/features/common/components/headers/mobile-header/mobile-header.module.scss index 540fe55a..c7c55966 100644 --- a/src/features/common/components/headers/mobile-header/mobile-header.module.scss +++ b/src/features/common/components/headers/mobile-header/mobile-header.module.scss @@ -104,12 +104,8 @@ } .menu { - position: fixed; - top: $main-nav-height-mobile; - z-index: 99999; - height: calc(100% - $main-nav-height-mobile); - width: 100%; - overflow: hidden; + opacity: 1; + transition: all .3s ease-in-out; &[aria-hidden="false"] { display: block; @@ -127,16 +123,22 @@ } .menuContainer { - height: 100%; - width: 100%; - overflow-y: scroll; - background: var(--color_bg_page); + width: calc(100% - 2rem); + position: fixed; + left: 1rem; + top: 4.5rem; + border-radius: 1rem; + background: rgba(0, 0, 0, .04); + border: 1px solid rgba(0, 0, 0, .04); + box-shadow: 0 1px 1px -.5px rgba(0, 0, 0, .04), 0 2px 2px -1px rgba(0, 0, 0, .04), 0 4px 4px -2px rgba(0, 0, 0, .04), 0 8px 8px -4px rgba(0, 0, 0, .04), 0 12px 12px -6px rgba(0, 0, 0, .04); + backdrop-filter: blur(2rem); + z-index: 100; } .menuContent { @include InnerContentFlex; - padding: 0 1.5rem 1.5rem; width: 100%; + padding: .25rem; } .menu__list { @@ -149,25 +151,27 @@ position: relative; list-style: none; width: 100%; - border-bottom: 1px solid $neutrals-functional-300; margin: 0; - padding: 1.5rem 0.5rem; } .menu__item__link { - font-size: 1.25rem; - line-height: 1.75rem; - letter-spacing: -0.1px; + display: flex; + align-items: center; + justify-content: center; + border-radius: .75rem; + width: 100%; + font-size: 1rem; + letter-spacing: -.1px; color: var(--color_fg_bold); text-decoration: none; font-weight: 500; - transition: color 0.2s; + transition: color .2s; cursor: pointer; user-select: none; - padding-bottom: 0.25rem; - border-bottom: 1px solid transparent; + padding: .75rem .5rem; &[data-active="true"] { - border-bottom: 1px solid var(--color_fg_bold); + background-color: hsla(0, 0%, 100%, .5); + box-shadow: 0 0 1px 2px rgba(0, 0, 0, .04); } } From 273a8e41a9373612964b74692d391d2a1213655a Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Thu, 4 Sep 2025 01:55:34 -0500 Subject: [PATCH 6/9] style desktop nav items --- .../headers/header/header.component.tsx | 22 ++--- .../headers/header/header.module.scss | 85 ++++++++++--------- .../mobile-header/mobile-header.component.tsx | 2 - .../mobile-header/mobile-header.module.scss | 4 + .../page-header/page-header.component.tsx | 4 +- src/libs/theme/styles/_variables.scss | 2 +- src/libs/theme/styles/globals.scss | 4 +- 7 files changed, 66 insertions(+), 57 deletions(-) diff --git a/src/features/common/components/headers/header/header.component.tsx b/src/features/common/components/headers/header/header.component.tsx index 9a756977..5c8cd4cf 100644 --- a/src/features/common/components/headers/header/header.component.tsx +++ b/src/features/common/components/headers/header/header.component.tsx @@ -34,15 +34,17 @@ export const HeaderComponent: React.FC = ({ : createUrlPath([languageCode]); return ( -
- + +
+
+
    {dictionary.links.map((link) => { @@ -70,7 +72,7 @@ export const HeaderComponent: React.FC = ({ })}
- -
+
+ ); }; diff --git a/src/features/common/components/headers/header/header.module.scss b/src/features/common/components/headers/header/header.module.scss index bede14de..da561616 100644 --- a/src/features/common/components/headers/header/header.module.scss +++ b/src/features/common/components/headers/header/header.module.scss @@ -1,22 +1,22 @@ @use "@/libs/theme/styles/variables" as *; @use "@/libs/theme/styles/mixins" as *; -.header { - position: fixed; - top: 0; - right: 0; - left: 0; - - z-index: 9001; - backdrop-filter: blur(2rem); -} - .container { @include Container; + max-width: calc(100% - 2rem); display: none; - + position: fixed; + top: 1rem; + right: 0; + left: 0; + border-radius: 1.25rem; + margin: 0 auto; + box-sizing: border-box; background: var(--color_bg_app_bar); - border-bottom: 1px solid rgba(#555, 0.32); + border: 1px solid var(--color_bg_app_bar); + box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .04); + backdrop-filter: blur(3rem); + z-index: 100; @media #{$breakpoint-dimension-sm} { display: block; @@ -29,20 +29,37 @@ } .content { - @include InnerContentFlex; + display: flex; + width: 100%; + margin: 0 auto; height: 100%; position: relative; - grid-column: 1 / -1; align-items: center; justify-content: space-between; } +.brand { + display: flex; + align-items: center; + height: 1rem; + margin-left: 1.5rem; + z-index: 100; +} + +.navContainer { + display: flex; + justify-content: center; + width: 100%; + position: absolute; + left: 0; +} + .navTabs { - flex: 1; display: flex; align-items: center; justify-content: center; - gap: 3rem; + border-radius: 9999px; + padding: .25rem; } .navList { @@ -50,39 +67,33 @@ padding: 0; list-style-type: none; margin: 0; - height: 100%; - - @media #{$breakpoint-dimension-sm} { - gap: 2rem; - } - - @media #{$breakpoint-dimension-md} { - gap: 3rem; - } + gap: 0.25rem; } .navList__item { position: relative; - border-bottom: 0.125rem solid transparent; - color: var(--color_fg_link); &[data-active="true"] { - color: var(--color_fg_selected); - border-bottom: 1px solid var(--color_border_selected); + a { + background-color: var(--color_bg_app_bar); + color: var(--color_fg_bold); + cursor: default; + } } } -.navList__item, .navList__item > a { display: flex; align-items: center; - - font-size: 0.875rem; + padding: .5rem 1rem; + color: var(--color_fg_default); + font-size: .875rem; font-style: normal; - font-weight: 500; - line-height: 1.5rem; - letter-spacing: 0.2px; + font-weight: 600; + line-height: 1.5; + letter-spacing: -.1px; + border-radius: 9999px; &:focus-visible { outline: solid 1px var(--color_border_focus); @@ -90,7 +101,3 @@ border-radius: 0.125rem; } } - -.header_actions { - -} \ No newline at end of file diff --git a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx index fca3e140..15d640ed 100644 --- a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx +++ b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx @@ -76,7 +76,6 @@ export const MobileHeaderComponent: React.FC = ({ return ( <> -
= ({ /> -
= ({ const layoutDictionary = getLayoutDictionary(languageCode); return ( - <> +
= ({ languageCode={languageCode} dictionary={layoutDictionary.header} /> - +
); }; diff --git a/src/libs/theme/styles/_variables.scss b/src/libs/theme/styles/_variables.scss index e5a0bd15..ea9ad6a5 100644 --- a/src/libs/theme/styles/_variables.scss +++ b/src/libs/theme/styles/_variables.scss @@ -150,7 +150,7 @@ $gradient-app-card---resting: linear-gradient( $ribbon-height: 2.5rem; $ribbon-height-mobile: 2.5rem; -$navbar-height: 3rem; +$navbar-height: 5rem; $navbar-height-mobile: 3rem; $main-nav-height: calc($ribbon-height + $navbar-height); $main-nav-height-mobile: calc($ribbon-height-mobile + $navbar-height-mobile); diff --git a/src/libs/theme/styles/globals.scss b/src/libs/theme/styles/globals.scss index 7566b4e7..7c779af1 100644 --- a/src/libs/theme/styles/globals.scss +++ b/src/libs/theme/styles/globals.scss @@ -45,7 +45,7 @@ :root { --color_bg_page: var(--functional-gray-950); --color_fg_bold: var(--functional-gray-50); - --color_fg_default: var(--functional-gray-200); + --color_fg_default: var(--functional-gray-500); --color_fg_link_primary: var(--cloud); --color_bg_app_bar: hsla(0,0%,7%,.04); @@ -196,10 +196,8 @@ html[data-theme="system-light"] { --color_bg_page: var(--functional-gray-0); --color_fg_bold: var(--charcoal2); - --color_fg_default: var(--functional-gray-650); --color_fg_link_primary: var(--sky); - --color_bg_app_bar: rgba(241, 241, 241, 0.66); --color_bg_app_bar_plain: rgba(241, 241, 241); --color_fg_link: var(--charcoal2); From 08a50e42dedf107216cc61b7a8afb23604409187 Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Sun, 7 Sep 2025 01:05:21 -0500 Subject: [PATCH 7/9] create theme-picker component --- .../headers/header/header.component.tsx | 79 ++++++++++++++++++- .../mobile-header/mobile-header.component.tsx | 10 ++- .../page-header/page-header.component.tsx | 9 ++- .../theme-picker/theme-picker.component.tsx | 50 ++++++++++++ .../theme-picker/theme-picker.module.scss | 11 +++ .../theme-toggle/theme-toggle.component.tsx | 10 --- 6 files changed, 148 insertions(+), 21 deletions(-) create mode 100644 src/features/common/components/theme-picker/theme-picker.component.tsx create mode 100644 src/features/common/components/theme-picker/theme-picker.module.scss delete mode 100644 src/features/common/components/theme-toggle/theme-toggle.component.tsx diff --git a/src/features/common/components/headers/header/header.component.tsx b/src/features/common/components/headers/header/header.component.tsx index 5c8cd4cf..7002824d 100644 --- a/src/features/common/components/headers/header/header.component.tsx +++ b/src/features/common/components/headers/header/header.component.tsx @@ -1,6 +1,6 @@ "use client"; -import React from "react"; +import React, { useCallback, useMemo, useState } from "react"; import { usePathname } from "next/navigation"; import { DEFAULT_LANGUAGE_CODE } from "@/features/localization/localization.config"; import { LayoutDictionaryModel } from "@/features/localization/models/layout-dictionary.model"; @@ -10,13 +10,30 @@ import styles from "./header.module.scss"; import { BoxComponent } from "@/features/common/components/box/box.component"; import Link from "next/link"; import { SiteBrandComponent } from "@/features/common/components/site-brand/site-brand.component"; +import { ThemePickerComponent } from "../../theme-picker/theme-picker.component"; +import { + getSanitizedThemePickerCodeValue, + isLightThemePreference, + isSystemThemePreference, +} from "@/features/themes/services/theme.utils"; +import { SystemIconComponent } from "../../bars/ribbon/assets/system-icon.component"; +import { LightIconComponent } from "../../bars/ribbon/assets/light-icon.component"; +import { DarkIconComponent } from "../../bars/ribbon/assets/dark-icon.component"; +import { + ThemeCookieValues, + ThemePickerCodeValues, +} from "@/features/common/values/theme.values"; +import { ThemeModel } from "@/features/common/models/theme.model"; +import { savePreferredThemeInCookie } from "@/features/themes/services/theme.client.utils"; interface HeaderComponentProps { + themeCode: ThemeCookieValues; languageCode: string; - dictionary: LayoutDictionaryModel["header"]; + dictionary: LayoutDictionaryModel; } export const HeaderComponent: React.FC = ({ + themeCode, languageCode, dictionary, }) => { @@ -33,6 +50,50 @@ export const HeaderComponent: React.FC = ({ ? sitePaths.root : createUrlPath([languageCode]); + const themeOptions = useMemo( + () => + dictionary.ribbon.themePicker.options.map((option) => { + return { + code: option.code, + label: option.label, + icon: isSystemThemePreference(option.code) ? ( + + ) : isLightThemePreference(option.code) ? ( + + ) : ( + + ), + }; + }), + [dictionary.ribbon.themePicker.options] + ); + + const sanitizedThemePickerCodeValue = useMemo(() => { + return getSanitizedThemePickerCodeValue(themeCode); + }, [themeCode]); + + const [currentTheme, setCurrentTheme] = useState( + dictionary.ribbon.themePicker.options.filter((element) => + isSystemThemePreference(themeCode) + ? isSystemThemePreference(element.code) + : element.code === sanitizedThemePickerCodeValue + )[0] + ); + + const handleThemeSelection = useCallback( + async (value: ThemePickerCodeValues) => { + const themePreference = await savePreferredThemeInCookie( + value, + languageCode + ); + + if (themePreference) { + setCurrentTheme(themePreference); + } + }, + [languageCode] + ); + return ( = ({ aria-label="Main navigation" >
- +
    - {dictionary.links.map((link) => { + {dictionary.header.links.map((link) => { const linkPath = languageCode === DEFAULT_LANGUAGE_CODE || link.isExternal ? link.path @@ -73,6 +137,13 @@ export const HeaderComponent: React.FC = ({
+
+ +
); }; diff --git a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx index 15d640ed..32f1080b 100644 --- a/src/features/common/components/headers/mobile-header/mobile-header.component.tsx +++ b/src/features/common/components/headers/mobile-header/mobile-header.component.tsx @@ -11,10 +11,12 @@ import { DEFAULT_LANGUAGE_CODE } from "@/features/localization/localization.conf import { sitePaths } from "@/features/seo/site-tree"; import { createUrlPath, getPathnameSegments } from "@/libs/utils/path.utils"; import { SiteBrandComponent } from "@/features/common/components/site-brand/site-brand.component"; +import { ThemeCookieValues } from "@/features/common/values/theme.values"; interface MobileHeaderComponentProps { + themeCode: ThemeCookieValues; languageCode: string; - dictionary: LayoutDictionaryModel["header"]; + dictionary: LayoutDictionaryModel; } export const MobileHeaderComponent: React.FC = ({ @@ -90,8 +92,8 @@ export const MobileHeaderComponent: React.FC = ({ onClick={toggleMobileMenu} aria-label={ mobileMenuState === MobileMenuStateValues.OPEN - ? dictionary.labels.close - : dictionary.labels.open + ? dictionary.header.labels.close + : dictionary.header.labels.open } aria-expanded={mobileMenuState === MobileMenuStateValues.OPEN} > @@ -110,7 +112,7 @@ export const MobileHeaderComponent: React.FC = ({ contentClassName={styles.menuContent} >
    - {dictionary.links.map((link) => { + {dictionary.header.links.map((link) => { const linkPath = languageCode === DEFAULT_LANGUAGE_CODE || link.isExternal ? link.path diff --git a/src/features/common/components/layout/page-header/page-header.component.tsx b/src/features/common/components/layout/page-header/page-header.component.tsx index 3e071584..6ba75f9c 100644 --- a/src/features/common/components/layout/page-header/page-header.component.tsx +++ b/src/features/common/components/layout/page-header/page-header.component.tsx @@ -1,5 +1,6 @@ +"use client"; + import React from "react"; -import { RibbonComponent } from "@/features/common/components/bars/ribbon/ribbon.component"; import { MobileHeaderComponent } from "@/features/common/components/headers/mobile-header/mobile-header.component"; import { HeaderComponent } from "@/features/common/components/headers/header/header.component"; import { ThemeCookieValues } from "@/features/common/values/theme.values"; @@ -19,12 +20,14 @@ export const PageHeaderComponent: React.FC = ({ return (
    ); diff --git a/src/features/common/components/theme-picker/theme-picker.component.tsx b/src/features/common/components/theme-picker/theme-picker.component.tsx new file mode 100644 index 00000000..bbf776f3 --- /dev/null +++ b/src/features/common/components/theme-picker/theme-picker.component.tsx @@ -0,0 +1,50 @@ +import styles from "./theme-picker.module.scss"; +import { ThemePickerCodeValues } from "../../values/theme.values"; + +interface ThemePickerComponentProps { + options: { + code: ThemePickerCodeValues; + icon: React.ReactNode; + label: string; + }[]; + selectedOptionCode: string; + handleSelection: (value: ThemePickerCodeValues) => Promise; +} + +enum PicketListItemStateValues { + INACTIVE = "INACTIVE", + ACTIVE = "ACTIVE", +} + +export const ThemePickerComponent: React.FC = ({ + options, + selectedOptionCode, + handleSelection, +}) => { + return ( +
    +
    + {options.map((option) => { + return ( +
    { + console.log(option.label) + await handleSelection(option.code); + }} + > + {option.icon} +
    + ); + })} +
    +
    + ); +}; diff --git a/src/features/common/components/theme-picker/theme-picker.module.scss b/src/features/common/components/theme-picker/theme-picker.module.scss new file mode 100644 index 00000000..5e4c1e08 --- /dev/null +++ b/src/features/common/components/theme-picker/theme-picker.module.scss @@ -0,0 +1,11 @@ +.container { + +} + +.wrapper { + +} + +.option { + +} \ No newline at end of file diff --git a/src/features/common/components/theme-toggle/theme-toggle.component.tsx b/src/features/common/components/theme-toggle/theme-toggle.component.tsx deleted file mode 100644 index c68a9ec6..00000000 --- a/src/features/common/components/theme-toggle/theme-toggle.component.tsx +++ /dev/null @@ -1,10 +0,0 @@ -interface ThemeToggleComponentProps { - -} - -export const ThemeToggleComponent: React.FC = ({ -}) => { - return ( -
    Theme Toggle
    - ); -}; \ No newline at end of file From 78de796d1bba6ff65a30d6447e4526530513b45a Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Sun, 7 Sep 2025 01:16:39 -0500 Subject: [PATCH 8/9] style theme picker --- .../headers/header/header.module.scss | 10 +++++ .../theme-picker/theme-picker.component.tsx | 6 +-- .../theme-picker/theme-picker.module.scss | 45 +++++++++++++++++-- 3 files changed, 53 insertions(+), 8 deletions(-) diff --git a/src/features/common/components/headers/header/header.module.scss b/src/features/common/components/headers/header/header.module.scss index da561616..3f27108d 100644 --- a/src/features/common/components/headers/header/header.module.scss +++ b/src/features/common/components/headers/header/header.module.scss @@ -101,3 +101,13 @@ border-radius: 0.125rem; } } + +.actions { + display: flex; + gap: .5rem; + + @media #{$breakpoint-dimension-md} { + gap: 1rem; + margin-right: 1.5rem; + } +} \ No newline at end of file diff --git a/src/features/common/components/theme-picker/theme-picker.component.tsx b/src/features/common/components/theme-picker/theme-picker.component.tsx index bbf776f3..43c4e176 100644 --- a/src/features/common/components/theme-picker/theme-picker.component.tsx +++ b/src/features/common/components/theme-picker/theme-picker.component.tsx @@ -29,11 +29,7 @@ export const ThemePickerComponent: React.FC = ({
    { console.log(option.label) diff --git a/src/features/common/components/theme-picker/theme-picker.module.scss b/src/features/common/components/theme-picker/theme-picker.module.scss index 5e4c1e08..90049ed9 100644 --- a/src/features/common/components/theme-picker/theme-picker.module.scss +++ b/src/features/common/components/theme-picker/theme-picker.module.scss @@ -1,11 +1,50 @@ .container { - + display: flex; + align-items: center; + justify-content: center; } .wrapper { - + display: flex; + background-color: var(--color_bg_app_bar); + border: 1px solid var(--color_border_default); + border-radius: 9999px; + overflow: hidden; + width: -moz-fit-content; + width: fit-content; + padding: 0.25rem; + gap: 0.125rem; } .option { + display: flex; + align-items: center; + justify-content: center; + color: var(--color_fg_default); + cursor: pointer; + padding: 0.25rem; + position: relative; + transition: all 0.2s ease; + border-radius: 9999px; + width: 2.5rem; + height: 1.75rem; + + &[data-active="true"] { + background-color: var(--color_bg_layer); + color: var(--color_fg_bold); + box-shadow: 0 1px 2px rgba(0, 0, 0, .1); + } +} + +.option__icon { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + width: 100%; -} \ No newline at end of file + svg { + height: 1rem; + width: 1rem; + } +} From b137b993bba3270f55ef0617662eb9fcd4470d4e Mon Sep 17 00:00:00 2001 From: Christian Samaniego <199278128+christiansamaniego-okta@users.noreply.github.com> Date: Sun, 7 Sep 2025 01:33:41 -0500 Subject: [PATCH 9/9] fix error page props and build errors --- src/app/global-error.tsx | 1 - src/app/not-found.tsx | 1 - .../errors/error-page/error-page.component.tsx | 14 +++++++------- .../theme-picker/theme-picker.component.tsx | 5 ----- .../common/models/static-image-metadata.model.ts | 2 +- 5 files changed, 8 insertions(+), 15 deletions(-) diff --git a/src/app/global-error.tsx b/src/app/global-error.tsx index 911ceda8..6977c3da 100644 --- a/src/app/global-error.tsx +++ b/src/app/global-error.tsx @@ -22,7 +22,6 @@ export default function GlobalError({ diff --git a/src/features/common/components/errors/error-page/error-page.component.tsx b/src/features/common/components/errors/error-page/error-page.component.tsx index 59032e7f..96f0f8c5 100644 --- a/src/features/common/components/errors/error-page/error-page.component.tsx +++ b/src/features/common/components/errors/error-page/error-page.component.tsx @@ -4,23 +4,21 @@ import { ShellComponent } from "@/features/common/components/shell/shell.compone import { MobileHeaderComponent } from "@/features/common/components/headers/mobile-header/mobile-header.component"; import { HeaderComponent } from "@/features/common/components/headers/header/header.component"; import { FooterComponent } from "@/features/common/components/footer/footer.component"; -import { LayoutDictionaryModel } from "@/features/localization/models/layout-dictionary.model"; import { ThemeCookieValues } from "@/features/common/values/theme.values"; -import { getImageDictionary } from "@/features/localization/services/images-dictionary.service"; +import { getLayoutDictionary } from "@/features/localization/services/language-dictionary.service"; interface ErrorPageComponentProps { languageCode: string; themeCode: ThemeCookieValues; - dictionary: LayoutDictionaryModel; children: React.ReactNode; } export const ErrorPageComponent: React.FC = ({ languageCode, themeCode, - dictionary, children, }) => { + const layoutDictionary = getLayoutDictionary(languageCode); return ( @@ -28,17 +26,19 @@ export const ErrorPageComponent: React.FC = ({
    {children}
    diff --git a/src/features/common/components/theme-picker/theme-picker.component.tsx b/src/features/common/components/theme-picker/theme-picker.component.tsx index 43c4e176..2981e145 100644 --- a/src/features/common/components/theme-picker/theme-picker.component.tsx +++ b/src/features/common/components/theme-picker/theme-picker.component.tsx @@ -11,11 +11,6 @@ interface ThemePickerComponentProps { handleSelection: (value: ThemePickerCodeValues) => Promise; } -enum PicketListItemStateValues { - INACTIVE = "INACTIVE", - ACTIVE = "ACTIVE", -} - export const ThemePickerComponent: React.FC = ({ options, selectedOptionCode, diff --git a/src/features/common/models/static-image-metadata.model.ts b/src/features/common/models/static-image-metadata.model.ts index cb771646..c9e1aaa7 100644 --- a/src/features/common/models/static-image-metadata.model.ts +++ b/src/features/common/models/static-image-metadata.model.ts @@ -1,5 +1,5 @@ export interface StaticImageMetadataModel { - src?: string; + src: string; alt: string; width?: number; height?: number;