diff --git a/src/components/Divider.astro b/src/components/Divider.astro
new file mode 100644
index 0000000..18011d6
--- /dev/null
+++ b/src/components/Divider.astro
@@ -0,0 +1,9 @@
+---
+import styles from "../styles/divider.module.css"
+---
+
+
+
+
+
+
diff --git a/src/components/Jumbo.astro b/src/components/Jumbo.astro
new file mode 100644
index 0000000..b85bc04
--- /dev/null
+++ b/src/components/Jumbo.astro
@@ -0,0 +1,16 @@
+---
+import styles from "../styles/jumbo.module.css"
+import Divider from "./Divider.astro"
+import logoLong from "../images/logoLong.svg"
+import { Image } from "astro:assets"
+---
+
+
+
+
+
+
+ Full Stack Web Developer and Discord Bot Developer
+
+
+
diff --git a/src/components/Welcome.astro b/src/components/Welcome.astro
deleted file mode 100644
index f23cd79..0000000
--- a/src/components/Welcome.astro
+++ /dev/null
@@ -1,3 +0,0 @@
-
diff --git a/src/images/logoLong.svg b/src/images/logoLong.svg
new file mode 100644
index 0000000..73984d5
--- /dev/null
+++ b/src/images/logoLong.svg
@@ -0,0 +1,77 @@
+
+
+
+
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index d68e267..c7912d2 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,6 +1,5 @@
---
import "mdui/mdui.css"
-import { Image } from "astro:assets"
import "../styles/layout.css"
import logo from "../images/logo.svg"
---
@@ -16,18 +15,18 @@ import logo from "../images/logo.svg"
rel="stylesheet"
/>
- Henry Hiles
+ Henry Hiles - Home
-
+
- Title
-
+ Henry Hiles
+
-
-
+
+
Home
diff --git a/src/pages/index.astro b/src/pages/index.astro
index f0bdbf8..966d237 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,8 +1,6 @@
---
-import Welcome from "../components/Welcome.astro"
+import Jumbo from "../components/Jumbo.astro"
import Layout from "../layouts/Layout.astro"
---
-
-
-
+
diff --git a/src/styles/divider.module.css b/src/styles/divider.module.css
new file mode 100644
index 0000000..18e84fd
--- /dev/null
+++ b/src/styles/divider.module.css
@@ -0,0 +1,33 @@
+.container {
+ width: 100%;
+ display: flex;
+ justify-content: center;
+}
+
+.dividerIcon {
+ margin: 10px 0 15px;
+ position: relative;
+
+ & mdui-icon {
+ font-size: 48px;
+ }
+}
+
+.dividerIcon::before,
+.dividerIcon::after {
+ border-bottom: 0.5rem solid;
+ border-radius: 5em;
+ content: "";
+ margin: 0 1em;
+ position: absolute;
+ top: 50%;
+ width: 6rem;
+}
+
+.dividerIcon::before {
+ right: 100%;
+}
+
+.dividerIcon::after {
+ left: 100%;
+}
diff --git a/src/styles/jumbo.module.css b/src/styles/jumbo.module.css
new file mode 100644
index 0000000..46a09d3
--- /dev/null
+++ b/src/styles/jumbo.module.css
@@ -0,0 +1,14 @@
+#jumbo {
+ font-size: 2em;
+ text-align: center;
+
+ & #logoLong {
+ width: 35rem;
+ height: min-content;
+ }
+
+ & #shortAbout {
+ display: block;
+ padding: 2rem 1rem;
+ }
+}
diff --git a/src/styles/layout.css b/src/styles/layout.css
index 2507137..c3d04f7 100644
--- a/src/styles/layout.css
+++ b/src/styles/layout.css
@@ -10,11 +10,19 @@ mdui-top-app-bar {
padding-left: 1em;
gap: 0.2em;
+ & mdui-top-app-bar-title {
+ font-weight: bold;
+ }
+
& mdui-icon {
font-size: 32px;
}
}
+spacer {
+ flex-grow: 1;
+}
+
:not(:defined) {
visibility: hidden;
}