feat(WEB-131): add loyalty page
This commit is contained in:
@@ -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"
|
||||
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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"
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import Title from "@/components/MyPages/Title"
|
||||
import Title from "@/components/Title"
|
||||
|
||||
import Friend from "./Friend"
|
||||
import Stats from "./Stats"
|
||||
|
||||
@@ -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"
|
||||
|
||||
|
||||
@@ -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"
|
||||
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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>
|
||||
}
|
||||
@@ -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);
|
||||
}
|
||||
}
|
||||
@@ -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)
|
||||
Reference in New Issue
Block a user