Skip to content

Commit 85a6335

Browse files
bolanosdevbolanosdev
authored
Merge pull request #2 from bolanosdev/feature/create_landing_page
create coming soon landing page
2 parents be887f4 + 61cef09 commit 85a6335

File tree

9 files changed

+85
-85
lines changed

9 files changed

+85
-85
lines changed

‎.DS_Store

-8 KB
Binary file not shown.

‎app/app.styles.ts

Lines changed: 4 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,11 @@ import { ComponentProperties } from "@bennie-ui/types";
22

33
export const main_styles: ComponentProperties = {
44
size: "sm",
5-
margin: { x: "auto" },
6-
flex: { direction: "col" },
5+
flex: { direction: "col", justifyContent: "center", alignItems: "center" },
76
width: { value: "full" },
8-
colors: {
9-
text: { color: "gray", weight: "400" },
10-
background: { color: "white" },
11-
},
7+
height: { value: "screen" },
8+
colors: {},
129
dark: {
13-
colors: {
14-
text: { color: "gray", weight: "400" },
15-
background: { color: "gray", weight: "800" },
16-
},
17-
},
18-
overrides: {
19-
large: {
20-
width: { value: "2/3" },
21-
},
10+
colors: {},
2211
},
2312
};

‎app/components/header/header.tsx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,11 +13,7 @@ export const Header: FC = () => {
1313
<Section size="2xl">Bolanos Dev</Section>
1414
</Section>
1515
<Section>
16-
<Button
17-
onClick={() => {
18-
alert("user profile");
19-
}}
20-
>
16+
<Button onClick={() => {}}>
2117
<Icon
2218
figure="UserIcon"
2319
colors={{ text: { color: "black" } }}

‎app/root.tsx

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,12 @@ import {
99
import type { LinksFunction } from "@remix-run/node";
1010
import { Section } from "@bennie-ui/section";
1111
import baselineStylesHref from "@bennie-ui/baseline/compiled/baseline.css?url";
12-
import { Header } from "./components/header";
1312
import { main_styles } from "./app.styles";
1413

1514
export const links: LinksFunction = () => [
1615
{ rel: "stylesheet", href: baselineStylesHref },
1716
];
1817

19-
// TODO: check why mx-auto is working and not auto
2018
export function Layout({ children }: { children: React.ReactNode }) {
2119
return (
2220
<html lang="en">
@@ -26,10 +24,9 @@ export function Layout({ children }: { children: React.ReactNode }) {
2624
<Meta />
2725
<Links />
2826
</head>
29-
<body className="w-full h-full bg-white dark:bg-gray-800">
30-
<Section {...main_styles}>
31-
<Header />
32-
<Section id="main-content">{children}</Section>
27+
<body className="w-full h-full bg-white dark:bg-black text-black dark:text-white">
28+
<Section id="main-content" {...main_styles}>
29+
{children}
3330
</Section>
3431
<ScrollRestoration />
3532
<Scripts />

‎app/routes/_index.tsx

Lines changed: 68 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,87 @@
11
import type { MetaFunction } from "@remix-run/cloudflare";
2-
import { Text } from "@bennie-ui/text";
32
import { Section } from "@bennie-ui/section";
4-
import { Icon } from "@bennie-ui/icons";
3+
import { Text, Link } from "@bennie-ui/text";
54

65
export const meta: MetaFunction = () => {
76
return [
8-
{ title: "New Remix App" },
7+
{ title: "BolanosDev" },
98
{
109
name: "description",
11-
content: "Welcome to BolanosDev! Using Bennie-UI and Cloudflare!",
10+
content: "Welcome to BolanosDev!",
1211
},
1312
];
1413
};
1514

1615
export default function Index() {
1716
return (
1817
<Section
19-
padding={{ all: "0.5" }}
2018
width={{ value: "full" }}
21-
colors={{ background: { color: "gray", weight: "900" } }}
19+
flex={{ direction: "col", alignItems: "center" }}
2220
>
23-
<Text>Hero Image</Text>
21+
<Section margin={{ bottom: "20" }}>
22+
<img
23+
src="public/logo_white.png"
24+
width="140px"
25+
height="140px"
26+
alt="logo"
27+
/>
28+
</Section>
29+
<Section
30+
size="6xl"
31+
margin={{ bottom: "20" }}
32+
flex={{ direction: "col", alignItems: "center" }}
33+
>
34+
Coming Soon
35+
<Text size="base" padding={{ top: "4" }}>
36+
I&apos;m determined to finally have a place to share my thoughts
37+
</Text>
38+
</Section>
39+
<Section
40+
width={{ value: "full" }}
41+
flex={{ direction: "row", justifyContent: "center" }}
42+
>
43+
<Section margin={{ right: "4" }}>
44+
<Link href="https://www.instagram.com/cbolanosmx/">
45+
<img
46+
height="32"
47+
width="32"
48+
alt="instagram"
49+
src="https://cdn.simpleicons.org/instagram/fff"
50+
/>
51+
</Link>
52+
</Section>
53+
54+
<Section margin={{ right: "4" }}>
55+
<Link href="https://www.threads.net/@cbolanosmx">
56+
<img
57+
height="32"
58+
width="32"
59+
alt="threads"
60+
src="https://cdn.simpleicons.org/threads/fff"
61+
/>
62+
</Link>
63+
</Section>
64+
65+
<Section margin={{ right: "4" }}>
66+
<Link href="https://github.com/bolanosdev">
67+
<img
68+
height="32"
69+
width="32"
70+
alt="github"
71+
src="https://cdn.simpleicons.org/github/fff"
72+
/>
73+
</Link>
74+
</Section>
75+
</Section>
76+
<Section padding={{ top: "40" }}>
77+
<Text>Built using </Text>
78+
<Link
79+
href="https://github.com/bennie-ui/bennie-ui"
80+
colors={{ text: { color: "blue", weight: "300" } }}
81+
>
82+
bennie-ui
83+
</Link>
84+
</Section>
2485
</Section>
2586
);
2687
}

‎app/routes/examples.tsx

Lines changed: 8 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,15 @@
1-
import { ComponentProperties } from "packages/bennie-ui/libraries/types";
2-
import { Button } from "@bennie-ui/button";
1+
import { Section } from "packages/bennie-ui/components/primitives/section/src";
32

43
export default function Examples() {
5-
const props: ComponentProperties = {
6-
children: "Content",
7-
colors: {
8-
text: { color: "white" },
9-
background: { color: "red" },
10-
border: { color: "teal", weight: "900" },
11-
},
12-
dark: {
13-
colors: {
14-
text: { color: "red" },
15-
background: { color: "white" },
16-
border: { color: "rose", weight: "900" },
17-
},
18-
},
19-
overrides: {
20-
medium: {
21-
children: "sm:Content",
22-
colors: {
23-
text: { color: "sky" },
24-
background: { color: "teal" },
25-
border: { color: "lime" },
26-
},
27-
dark: {
28-
colors: {
29-
text: { color: "teal" },
30-
background: { color: "sky" },
31-
border: { color: "red" },
32-
},
33-
},
34-
},
35-
large: {
36-
children: "lg:Content",
37-
colors: {
38-
text: { color: "orange" },
39-
background: { color: "lime" },
40-
border: { color: "orange" },
41-
},
42-
dark: {
43-
colors: {
44-
text: { color: "lime" },
45-
background: { color: "orange" },
46-
border: { color: "sky" },
47-
},
48-
},
49-
},
50-
},
51-
};
52-
534
return (
545
<div>
55-
<Button {...props}>Button with Classes</Button>
6+
<h1>Example</h1>
7+
8+
<Section grid={{ templates: { cols: "5" } }}>
9+
<div>item1</div>
10+
<div>item2</div>
11+
<div>item3</div>
12+
</Section>
5613
</div>
5714
);
5815
}

‎packages/bennie-ui

Submodule bennie-ui updated 104 files

‎public/Logo.png

90.1 KB
Loading

‎public/logo_white.png

69.3 KB
Loading

0 commit comments

Comments
 (0)