feat(WEB-131): add loyalty page

This commit is contained in:
Christel Westerberg
2024-04-17 16:20:55 +02:00
parent 4243056fe8
commit c00f7b78eb
21 changed files with 386 additions and 11 deletions

View File

@@ -2,7 +2,7 @@ import Link from "next/link"
import { serverClient } from "@/lib/trpc/server"
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import styles from "./current.module.css"

View File

@@ -3,7 +3,7 @@ import { Lock } from "react-feather"
import { serverClient } from "@/lib/trpc/server"
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import Button from "@/components/TempDesignSystem/Button"
import styles from "./next.module.css"

View File

@@ -1,5 +1,5 @@
import Image from "@/components/Image"
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import styles from "./challenges.module.css"

View File

@@ -1,4 +1,4 @@
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import Friend from "./Friend"
import Stats from "./Stats"

View File

@@ -1,7 +1,7 @@
import Link from "next/link"
import Image from "@/components/Image"
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import styles from "./shortcuts.module.css"

View File

@@ -1,7 +1,7 @@
import { dt } from "@/lib/dt"
import Image from "@/components/Image"
import Title from "@/components/MyPages/Title"
import Title from "@/components/Title"
import styles from "./stay.module.css"

View File

@@ -4,9 +4,10 @@ import { LogOut } from "react-feather"
import { GetNavigationMyPages } from "@/lib/graphql/Query/NavigationMyPages.graphql"
import { request } from "@/lib/graphql/request"
import Title from "@/components/Title"
import Link from "@/components/TempDesignSystem/Link"
import Title from "../Title"
import { mapMenuItems } from "./helpers"
import styles from "./sidebar.module.css"

View File

@@ -1,21 +0,0 @@
import { headingVariants } from "./variants"
import type { HeadingProps } from "@/types/components/myPages/title"
export default function Title({
as,
children,
className = "",
level = "h1",
uppercase = false,
weight,
}: HeadingProps) {
const Hx = level
const classNames = headingVariants({
className,
text: uppercase ? "uppercase" : undefined,
type: as ?? level,
weight,
})
return <Hx className={classNames}>{children}</Hx>
}

View File

@@ -1,85 +0,0 @@
.heading {
/* font-family: var(--ff-brandon-text); */
margin: 0;
padding: 0;
}
.uppercase {
text-transform: uppercase;
}
.h1 {
font-size: var(--typography-Title1-Mobile-fontSize);
line-height: var(--typography-Title1-Mobile-lineHeight);
}
.h2 {
font-size: var(--typography-Title2-Mobile-fontSize);
line-height: var(--typography-Title2-Mobile-lineHeight);
}
.h3 {
font-size: var(--typography-Title3-Mobile-fontSize);
line-height: var(--typography-Title3-Mobile-lineHeight);
}
.h4 {
font-size: var(--typography-Title4-Mobile-fontSize);
line-height: var(--typography-Title4-Mobile-lineHeight);
}
.h5 {
font-size: var(--typography-Title5-Mobile-fontSize);
line-height: var(--typography-Title5-Mobile-lineHeight);
}
.light {
font-weight: 300;
}
.regular {
font-weight: 400;
}
.medium {
font-weight: 500;
}
.semiBold {
font-weight: 600;
}
.bold {
font-weight: 700;
}
.black {
font-weight: 900;
}
@media screen and (min-width: 950px) {
.h1 {
font-size: var(--typography-Title1-Desktop-fontSize);
line-height: var(--typography-Title1-Desktop-lineHeight);
}
.h2 {
font-size: var(--typography-Title2-Desktop-fontSize);
line-height: var(--typography-Title2-Desktop-lineHeight);
}
.h3 {
font-size: var(--typography-Title3-Desktop-fontSize);
line-height: var(--typography-Title3-Desktop-lineHeight);
}
.h4 {
font-size: var(--typography-Title4-Desktop-fontSize);
line-height: var(--typography-Title4-Desktop-lineHeight);
}
.h5 {
font-size: var(--typography-Title5-Desktop-fontSize);
line-height: var(--typography-Title5-Desktop-lineHeight);
}
}

View File

@@ -1,33 +0,0 @@
import { cva } from "class-variance-authority"
import styles from "./title.module.css"
const config = {
variants: {
text: {
uppercase: styles.uppercase,
},
type: {
h1: styles.h1,
h2: styles.h2,
h3: styles.h3,
h4: styles.h4,
h5: styles.h5,
h6: styles.h6,
},
weight: {
light: styles.light,
regular: styles.regular,
medium: styles.medium,
semiBold: styles.semiBold,
bold: styles.bold,
black: styles.black,
},
},
defaultVariants: {
type: "h1",
weight: "black",
},
} as const
export const headingVariants = cva(styles.heading, config)