From 287b5f7a1168b76048791043ef319ef9f16402c6 Mon Sep 17 00:00:00 2001 From: natebwangsut Date: Sat, 27 May 2023 13:46:07 +0700 Subject: [PATCH 1/3] WIP: fix: adding blog page --- src/components/About.astro | 20 +- src/components/Footer.tsx | 19 + src/components/Landing.astro | 6 +- src/components/NavBar.css | 9 + src/components/NavBar.tsx | 45 ++ src/components/Tab.css | 19 +- src/components/layout/Layout.svelte | 26 - .../landing/social/LandingSocial.svelte | 2 + src/layout/BaseLayout.astro | 71 ++ src/pages/blog.astro | 7 + src/pages/index.astro | 95 +-- src/styles/layout.css | 669 ------------------ 12 files changed, 205 insertions(+), 783 deletions(-) create mode 100644 src/components/Footer.tsx create mode 100644 src/components/NavBar.css create mode 100644 src/components/NavBar.tsx delete mode 100644 src/components/layout/Layout.svelte create mode 100644 src/layout/BaseLayout.astro create mode 100644 src/pages/blog.astro delete mode 100644 src/styles/layout.css diff --git a/src/components/About.astro b/src/components/About.astro index 0235d03..226e485 100644 --- a/src/components/About.astro +++ b/src/components/About.astro @@ -1,7 +1,15 @@ --- -import { frontmatter, Content } from '../contents/about/about.md' +import { frontmatter, Content } from "../contents/about/about.md"; --- +
+

+ {frontmatter.title} + {frontmatter.accent} +

+ +
+ - -
-

- {frontmatter.title} - {frontmatter.accent} -

- -
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx new file mode 100644 index 0000000..a515df0 --- /dev/null +++ b/src/components/Footer.tsx @@ -0,0 +1,19 @@ +/** @jsxImportSource solid-js */ + +const Footer = () => { + return ( + + ); +}; + +export default Footer; diff --git a/src/components/Landing.astro b/src/components/Landing.astro index c95862b..81d682b 100644 --- a/src/components/Landing.astro +++ b/src/components/Landing.astro @@ -8,13 +8,13 @@ const titles = LANDING_TITLE_NAME.split(" "); ---
-
+
{ titles.map((value, index) => ( {value} - )) - } + )) + }
diff --git a/src/components/NavBar.css b/src/components/NavBar.css new file mode 100644 index 0000000..ee83080 --- /dev/null +++ b/src/components/NavBar.css @@ -0,0 +1,9 @@ +div.navbar { + width: 940px; + margin: 0 auto; + display: flex; + flex-direction: row; + gap: 1rem; + /* TODO: Use google font for all monospace */ + font-family: monospace; +} diff --git a/src/components/NavBar.tsx b/src/components/NavBar.tsx new file mode 100644 index 0000000..66fd019 --- /dev/null +++ b/src/components/NavBar.tsx @@ -0,0 +1,45 @@ +/** @jsxImportSource solid-js */ + +import { For } from "solid-js"; + +import "./NavBar.css"; + +const menuItems = [ + { + name: "~", + link: "/", + }, + { + name: "./blog", + link: "/blog", + disabled: false, + }, + +]; + +const NavBar = (props: {}) => { + return ( +
+
+ + {(item, index) => ( + // TODO: Use monospace font + +
+ {item.name} +
+ + )} + +
+ ); +}; + +export default NavBar; diff --git a/src/components/Tab.css b/src/components/Tab.css index 20ad249..9db0e3e 100644 --- a/src/components/Tab.css +++ b/src/components/Tab.css @@ -2,14 +2,6 @@ div { color: #aaa; } -div.tab-content > h2 { - color: var(--mint-6); - margin-bottom: 0.5rem; -} - -div.tab-content > p { - color: #fff; -} li.tab-list { padding: 8px; @@ -34,5 +26,14 @@ div.tab-content { flex: 2; margin: 8px; padding: 8px; - min-height: 500px; + height: 600px; +} + +div.tab-content > h2 { + color: var(--mint-6); + margin-bottom: 0.5rem; +} + +div.tab-content > p { + color: #fff; } diff --git a/src/components/layout/Layout.svelte b/src/components/layout/Layout.svelte deleted file mode 100644 index fbc71ae..0000000 --- a/src/components/layout/Layout.svelte +++ /dev/null @@ -1,26 +0,0 @@ - - - - -
-
- -
-
- © {new Date().getFullYear()} | designed and developed by - @natebwangsut -
-
diff --git a/src/components/section/landing/social/LandingSocial.svelte b/src/components/section/landing/social/LandingSocial.svelte index 7c14fcd..a939564 100644 --- a/src/components/section/landing/social/LandingSocial.svelte +++ b/src/components/section/landing/social/LandingSocial.svelte @@ -36,6 +36,7 @@ target="_blank" rel="noreferrer" aria-label={sl.alt} + style="margin: auto;" >