feat(WEB-250): overview hero final ui

This commit is contained in:
Simon Emanuelsson
2024-05-24 10:13:24 +02:00
parent f884383c3c
commit 16b817f469
164 changed files with 6262 additions and 990 deletions

View File

@@ -1,34 +1,29 @@
.content {
display: grid;
padding-bottom: 7.7rem;
padding-left: 0;
padding-right: 0;
padding-bottom: var(--Spacing-x9);
padding-left: var(--Spacing-x0);
padding-right: var(--Spacing-x0);
position: relative;
}
@media screen and (min-width: 950px) {
.content {
gap: 10rem;
grid-template-columns: 25rem 1fr;
padding-bottom: 17.5rem;
padding-left: 2.4rem;
padding-right: 2.4rem;
padding-top: 5.8rem;
}
}
.blocks {
display: grid;
gap: 4.2rem;
padding-top: 4rem;
padding-left: 1.6rem;
padding-right: 1.6rem;
gap: var(--Spacing-x5);
padding-left: var(--Spacing-x2);
padding-right: var(--Spacing-x2);
}
@media screen and (min-width: 950px) {
@media screen and (min-width: 1367px) {
.content {
gap: var(--Spacing-x9);
grid-template-columns: 25rem 1fr;
padding-left: var(--Spacing-x3);
padding-right: var(--Spacing-x3);
}
.blocks {
gap: 6.4rem;
padding-left: 0;
padding-right: 0;
gap: var(--Spacing-x7);
padding-left: var(--Spacing-x0);
padding-right: var(--Spacing-x0);
}
}

View File

@@ -1,8 +1,7 @@
import { _ } from "@/lib/translation"
import { serverClient } from "@/lib/trpc/server"
import MaxWidth from "@/components/MaxWidth"
import Content from "@/components/MyPages/AccountPage/Content"
import Breadcrumbs from "@/components/MyPages/Breadcrumbs"
import Sidebar from "@/components/MyPages/Sidebar"
import styles from "./page.module.css"
@@ -15,19 +14,15 @@ export default async function MyPages({
const accountPage = await serverClient().contentstack.accountPage.get()
return (
<>
<Breadcrumbs />
<div className={styles.content}>
<Sidebar lang={params.lang} />
<MaxWidth className={styles.blocks} tag="main">
{accountPage.content.length ? (
<Content lang={params.lang} content={accountPage.content} />
) : (
<p>No content published</p>
)}
</MaxWidth>
</div>
</>
<section className={styles.content}>
<Sidebar lang={params.lang} />
<main className={styles.blocks}>
{accountPage.content.length ? (
<Content lang={params.lang} content={accountPage.content} />
) : (
<p>{_("No content published")}</p>
)}
</main>
</section>
)
}