-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
migrate from mantine to tailwind on the home page
- Loading branch information
1 parent
9ba7159
commit 2817f05
Showing
22 changed files
with
417 additions
and
506 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,21 +1,19 @@ | ||
| import { Group, Image, Paper } from "@mantine/core"; | ||
| import { Image } from "@mantine/core"; | ||
| import { FooterLinks } from "./footer-links"; | ||
|
|
||
| import classes from "./footer-bar.module.css"; | ||
|
|
||
| export function FooterBar() { | ||
| return ( | ||
| <Paper radius="lg" className={classes.container}> | ||
| <div className="mt-[120px] flex border-t-2 flex-col border-slate-200 relative place-items-center px-6 py-8 sm:flex-row"> | ||
| <Image | ||
| src="/logo/hubone_logo_full.svg" | ||
| fit="contain" | ||
| h={36} | ||
| w={150} | ||
| className={classes.logo} | ||
| className="static sm:absolute" | ||
| /> | ||
| <Group className={classes.footerLinks}> | ||
| <div className="my-0 mx-auto relative sm:static"> | ||
| <FooterLinks /> | ||
| </Group> | ||
| </Paper> | ||
| </div> | ||
| </div> | ||
| ); | ||
| } |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,24 +1,16 @@ | ||
| import { Container } from "@mantine/core"; | ||
|
|
||
| export function Section({ | ||
| id, | ||
| children, | ||
| }: { | ||
| id: string; | ||
| children: React.ReactNode[]; | ||
| children: React.ReactNode[] | React.ReactNode; | ||
| }) { | ||
| return ( | ||
| <Container | ||
| <div | ||
| id={id} | ||
| size="lg" | ||
| mt="16em" | ||
| style={{ | ||
| display: "flex", | ||
| flexDirection: "column", | ||
| alignItems: "center", | ||
| }} | ||
| className="max-w-7xl mx-auto mt-48 px-4 sm:px-6 lg:px-8 flex flex-col place-items-center" | ||
| > | ||
| {children} | ||
| </Container> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,43 +1,23 @@ | ||
| // import { Card, Text, useMantineTheme } from "@mantine/core"; | ||
| // import { Icon as IconType } from "@tabler/icons-react"; | ||
| import { cn } from "@/lib/utils"; | ||
|
|
||
| // export function FeatureCard({ | ||
| // title, | ||
| // description, | ||
| // Icon, | ||
| // }: { | ||
| // title: string; | ||
| // description: string; | ||
| // Icon: IconType; | ||
| // }) { | ||
| // const theme = useMantineTheme(); | ||
| // return ( | ||
| // <Card | ||
| // shadow="lg" | ||
| // radius="lg" | ||
| // style={{ border: `1px solid ${theme.colors.gray[1]}` }} | ||
| // p="xl" | ||
| // > | ||
| // <Icon size={50} stroke={2} color={theme.colors.primary[4]} /> | ||
| // <Text | ||
| // size="lg" | ||
| // sx={{ | ||
| // "&::after": { | ||
| // content: '""', | ||
| // display: "block", | ||
| // backgroundColor: theme.colors.primary[4], | ||
| // width: 45, | ||
| // height: 2, | ||
| // marginTop: theme.spacing.sm, | ||
| // }, | ||
| // }} | ||
| // mt="md" | ||
| // > | ||
| // {title} | ||
| // </Text> | ||
| // <Text size="sm" c="dimmed" mt="sm"> | ||
| // {description} | ||
| // </Text> | ||
| // </Card> | ||
| // ); | ||
| // } | ||
| export default function FeatureCard({ invert = false }: { invert?: boolean }) { | ||
| return ( | ||
| <div | ||
| className={cn( | ||
| "h-96 flex w-full px-20 gap-6 bg-secondary rounded-xl place-items-center", | ||
| invert && "flex-row-reverse bg-transparent" | ||
| )} | ||
| > | ||
| <div className="w-3/5 space-y-4 "> | ||
| <h3 className="text-xl sm:text-4xl font-bold">Title</h3> | ||
| <p> | ||
| Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem | ||
| nesciunt beatae, perspiciatis, distinctio vel itaque illum ut | ||
| excepturi eius a ad repellendus! Laboriosam quod aliquid atque | ||
| provident ullam inventore vitae. | ||
| </p> | ||
| </div> | ||
| <div className=" w-2/5">Diagram</div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,29 +1,24 @@ | ||
| // import Section from "@/components/home/section"; | ||
| // import Heading from "@/components/home/heading"; | ||
| // import { SimpleGrid } from "@mantine/core"; | ||
| // import { FeatureCard } from "./feature-card"; | ||
| import Heading from "@/components/home/heading"; | ||
| import Section from "@/components/home/section"; | ||
| import FeatureCard from "./feature-card"; | ||
| // import { featuresData } from "./featuresData"; | ||
|
|
||
| // export function Features() { | ||
| // const features = featuresData.map((feature) => ( | ||
| // <FeatureCard key={feature.title} {...feature} Icon={feature.icon} /> | ||
| // )); | ||
| export function Features() { | ||
| // const features = featuresData.map((feature) => ( | ||
| // <FeatureCard key={feature.title} {...feature} Icon={feature.icon} /> | ||
| // )); | ||
|
|
||
| // return ( | ||
| // <Section id="features"> | ||
| // <Heading | ||
| // title="What is Important to Us?" | ||
| // description="HubOne focuses on making your life easier. This is why we made sure to | ||
| // follow these principles." | ||
| // /> | ||
|
|
||
| // <SimpleGrid | ||
| // cols={3} | ||
| // spacing={48} | ||
| // breakpoints={[{ maxWidth: "md", cols: 1 }]} | ||
| // > | ||
| // {features} | ||
| // </SimpleGrid> | ||
| // </Section> | ||
| // ); | ||
| // } | ||
| return ( | ||
| <Section id="features"> | ||
| <Heading | ||
| title="What is HubOne?" | ||
| description="HubOne focuses on making your work easier. Here is how." | ||
| /> | ||
| <div className="space-y-8 py-12"> | ||
| <FeatureCard /> | ||
| <FeatureCard invert /> | ||
| <FeatureCard /> | ||
| </div> | ||
| </Section> | ||
| ); | ||
| } |
Oops, something went wrong.
2817f05There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Successfully deployed to the following URLs:
hubone – ./
hubone.vercel.app
*.huboneapp.com
hubone-ihsen.vercel.app
hubone-git-main-ihsen.vercel.app
huboneapp.com