blog-minerva-juppiter

commit a41e961ff336adce098127740bd8d6f20bb9be4b
parent 41a20dc192fa259c04f37fd2d54890aed7aa9028
Author: minerva-jupiter <ryouturn@gmail.com>
Date:   Sun, 30 Mar 2025 00:00:59 +0900

add layout & header footer

Diffstat:
A
src/routes/+layout.svelte
 | 
41
+++++++++++++++++++++++++++++++++++++++++
M
src/routes/+page.svelte
 | 
20
+++++++++++++++-----
A
src/routes/about/+page.svelte
 | 
4
++++

3 files changed, 60 insertions(+), 5 deletions(-)
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -0,0 +1,40 @@
+<header>
+    <h1>Blog</h1>
+    <h2>by Minerva_Juppiter</h2>
+    <nav>
+        <a href="/">Home</a>
+        /
+        <a href="/about">About</a>
+    </nav>
+</header>
+<br/>
+<slot />
+<br/>
+<footer>
+    <p>
+        @all right reserved by Minerva_Juppiter
+    </p>
+</footer>
+
+<style>
+    :global(body) {
+        background-color: black;
+        color: whitesmoke;
+        padding-left: 5rem;
+        padding-right: 5rem;
+    }
+    header {
+        background-color: #c2c2c2;
+        color: #0f0a05;
+        padding: 2rem;
+    }
+    nav a {
+        text-decoration: none;
+        color: black;
+    }
+    footer {
+        background-color: #0f0a05;
+        color: gray;
+        padding: 1rem;
+    }
+</style>+
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
@@ -1,6 +1,3 @@
-<h1>Blog</h1>
-<h2>by Minerva_Juppiter</h2>
-<br/>
 <h3>Articles</h3>
 <ul>
     {#each articles as article,index}
@@ -12,5 +9,18 @@
 
 <script lang="ts">
     import articles from "$lib/assets/articles.json";
+</script>
 
-</script>-
\ No newline at end of file
+<style>
+    h3 {
+        color: whitesmoke;
+        padding-left: 3rem;
+    }
+    ul {
+        padding-left: 3rem;
+    }
+    a {
+        text-decoration: none;
+        color: white;
+    }
+</style>+
\ No newline at end of file
diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte
@@ -0,0 +1,4 @@
+<h1>About</h1>
+<br/>
+<h3>About this page</h3>
+<p>This page is deployed by cloudflare pages & github</p>