diff --git a/src/components/layout/Navbar/index.tsx b/src/components/layout/Navbar/index.tsx index 91420943..deddcbd2 100644 --- a/src/components/layout/Navbar/index.tsx +++ b/src/components/layout/Navbar/index.tsx @@ -17,8 +17,9 @@ import styles from './style.module.scss'; interface NavbarProps { accessType?: UserAccessType; + quiet?: boolean; } -const Navbar = ({ accessType }: NavbarProps) => { +const Navbar = ({ accessType, quiet }: NavbarProps) => { const size = useWindowSize(); const headerRef = useRef(null); @@ -50,14 +51,20 @@ const Navbar = ({ accessType }: NavbarProps) => { if (!accessType) { return (
-
- - ACM General Logo - Membership Portal - +
+ {quiet ? ( + + ACM General Logo + + ) : ( + + ACM General Logo + Membership Portal + + )}
-
+ {!quiet ?
: null}
); } diff --git a/src/components/layout/Navbar/style.module.scss b/src/components/layout/Navbar/style.module.scss index 8f4d73e8..0a83c094 100644 --- a/src/components/layout/Navbar/style.module.scss +++ b/src/components/layout/Navbar/style.module.scss @@ -18,6 +18,11 @@ width: 100%; z-index: 20; + &.quiet { + border-bottom: 1px solid var(--theme-elevated-stroke); + height: vars.$header-height; + } + .toggleIcon { background-color: inherit; display: none; @@ -64,7 +69,6 @@ .navLeft { align-items: center; - cursor: pointer; display: flex; gap: 1.25rem; height: 100%; diff --git a/src/components/layout/Navbar/style.module.scss.d.ts b/src/components/layout/Navbar/style.module.scss.d.ts index 6fd6516c..1aa0e704 100644 --- a/src/components/layout/Navbar/style.module.scss.d.ts +++ b/src/components/layout/Navbar/style.module.scss.d.ts @@ -13,6 +13,7 @@ export type Styles = { mobileSwitch: string; navLeft: string; portalLinks: string; + quiet: string; toggleIcon: string; wainbow: string; }; diff --git a/src/components/layout/PageLayout/index.tsx b/src/components/layout/PageLayout/index.tsx index c905fcde..d8961f3d 100644 --- a/src/components/layout/PageLayout/index.tsx +++ b/src/components/layout/PageLayout/index.tsx @@ -5,11 +5,12 @@ import styles from './style.module.scss'; interface LayoutProps { accessType?: UserAccessType; + quietNavbar?: boolean; } -const PageLayout = ({ accessType, children }: PropsWithChildren) => ( +const PageLayout = ({ accessType, quietNavbar, children }: PropsWithChildren) => ( <> - +
{children}
); diff --git a/src/components/onboarding/OnboardingScreen/index.tsx b/src/components/onboarding/OnboardingScreen/index.tsx index 3f1b9b9b..0dfdf2cb 100644 --- a/src/components/onboarding/OnboardingScreen/index.tsx +++ b/src/components/onboarding/OnboardingScreen/index.tsx @@ -1,6 +1,7 @@ import { Button, Typography } from '@/components/common'; import Communities from '@/components/onboarding/Communities'; import Intro from '@/components/onboarding/Intro'; +import { CollectionSlider } from '@/components/store'; import Step4 from '@/public/assets/graphics/store/step4.svg'; import { ReactNode, useState } from 'react'; import { AiOutlineClockCircle } from 'react-icons/ai'; @@ -39,7 +40,19 @@ const steps: Step[] = [ { title: 'Redeem your points at the ACM Store!', caption: 'Purchase merch with your points and show off your ACM spirit!', - content:
, + content: ( + <> +
+
+ +
+ + ), }, { title: 'That’s a glimpse on how we run ACM at UCSD.', diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 114772d1..64b011f3 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -37,7 +37,7 @@ export default function MyApp({ Component, pageProps, router }: AppProps) { /> - + diff --git a/src/pages/onboard.tsx b/src/pages/onboard.tsx index 944866d4..3e4a780a 100644 --- a/src/pages/onboard.tsx +++ b/src/pages/onboard.tsx @@ -30,6 +30,7 @@ export const getServerSideProps: GetServerSideProps = async ({ que return { props: { destination: route || config.homeRoute, + quietNavbar: true, }, }; };