rs blogpost fixes & hamburder menu

config.toml

@@ -12,7 +12,7 @@ default_language = "en"
 author = "mana"
 
 taxonomies = [
-    { name = "tags", feed = true}
+    { name = "tags", feed = false}
 ]
 
 [markdown]
@@ -43,6 +43,7 @@ paths_keep_dates = false
 # Put all your custom variables here
 header_nav = [
   { url = "/", name_en = "peachmoon.moe" },
+  { url = "/updates", name_en = "updates" },
   { url = "/blog", name_en = "blog" },
   { url = "/now", name_en = "now" },
   { url = "/webcore", name_en = "webcore" },
@@ -52,7 +53,6 @@ header_nav = [
   { url = "/rkgk", name_en = "rkgk" },
   { url = "/quiz", name_en = "quizzes" },
   { url = "/about", name_en = "about" },
-  { url = "/updates", name_en = "updates" },
   { url = "/links", name_en = "links" },
   { url = "/contact", name_en = "contact me" }
 ]

content/blog/_index.md

@@ -1,4 +1,5 @@
 +++
 title = "mana's blog"
 sort_by = "date"
+template = "blog-section.html"
 +++

content/blog/egglish.md

@@ -2,6 +2,8 @@
 title = "a glossary of egglish terms"
 date = "2024-05-08"
 template = "blog-page.html"
+[taxonomies]
+  tags = ["girlblogging"]
 +++
 ![pastel music notes](../../img/emoji/nowplaying.gif) *now playing ー [✦ A Jellyfish Playlist~](https://www.youtube.com/watch?v=hAGT23rNwnc)* ![pastel music notes](../../img/emoji/nowplaying.gif)
 

content/blog/fifth.md

@@ -2,6 +2,8 @@
 title = "my birthday ♡"
 date = "2024-07-22"
 template = "blog-page.html"
+[taxonomies]
+  tags = ["girlblogging"]
 +++
 tomorrow is my birthday~! I'm planning on having a pastel mermaid-themed cake with buttercream icing ^w^ and ordering pizza out for the occasion, in addition to heading to my local starbucks to get a free birthday drink uwu (it's dumb that it can only be redeemed on my birthday, but whatever \>w< it's fine...)
 

content/blog/shingles.md

@@ -3,7 +3,7 @@ title = "varicella zoster"
 date = "2024-09-08"
 template = "blog-page.html"
 [taxonomies]
-  tags = ["example", "butts"]
+  tags = ["girlblogging", "kpop"]
 +++
 ![pastel music notes](../../img/emoji/nowplaying.gif) *now playing -- [toumin shoujo](https://www.youtube.com/watch?v=Cq7bl44zOII) by BiSH* ![pastel music notes](../../img/emoji/nowplaying.gif)
 

content/blog/sixth.md

@@ -2,6 +2,8 @@
 title = "state of the bujo"
 date = "2024-08-09"
 template = "blog-page.html"
+[taxonomies]
+  tags = ["journaling"]
 +++
 ![pastel music notes](../../img/emoji/nowplaying.gif) *now playing -- [heart attack](https://youtu.be/BVVfMFS3mgc?si=PUE8v3gIy6VjpH-A) by chuu (loona)* ![pastel music notes](../../img/emoji/nowplaying.gif)
 

content/blog/third.md

@@ -2,6 +2,8 @@
 title = "what I've been up to lately"
 date = "2024-04-22"
 template = "blog-page.html"
+[taxonomies]
+  tags = ["journaling"]
 +++
 ![pastel music notes](../../img/emoji/nowplaying.gif) *now playing ー [[sunflower] by Snail's House](https://www.youtube.com/watch?v=7aJ8iy6qsZo)* ![pastel music notes](../../img/emoji/nowplaying.gif)<figure style="float: right;">
 

content/quiz/index.md

@@ -1,73 +1,73 @@
 +++
 title = "quizzes I've taken"
 +++
-<div class="three-column">
+<div class="masonry-container">
 
 [![you are a weird doll!](weirddoll.png)](https://linwood.neocities.org/quiz)
 
-[![you're a fairy](tag_fairy.gif)](https://springhole.net/quizzes/fantasycreature/index.html)
+[![you're a fairy](tag_fairy.png)](https://springhole.net/quizzes/fantasycreature/index.html)
 
-[![you're a flower fairy](whatfairy_flowerfairy.gif)](https://springhole.net/quizzes/fairyquiz/index.html)
+[![you're a flower fairy](whatfairy_flowerfairy.png)](https://springhole.net/quizzes/fairyquiz/index.html)
 
 [![you're a glazed donut](glazeddonut.png)](https://andou.gay/quiz/glazed)
 
-[![you are a deredere](deredere.jpg)](https://theotaku.com/quizzes/view/3760/what_type_of_dere_are_you%3F_)
+[![you are a deredere](deredere.png)](https://theotaku.com/quizzes/view/3760/what_type_of_dere_are_you%3F_)
 
-[![you are sakura miku](sakumiku.jpg)](https://www.theotaku.com/quizzes/view/3913/which_hatsune_miku_nendoroid_model_are_you%3F)
+[![you are sakura miku](sakumiku.png)](https://www.theotaku.com/quizzes/view/3913/which_hatsune_miku_nendoroid_model_are_you%3F)
 
-[![you are sailor moon!](moon.gif)](https://web.archive.org/web/20090805085714/http://geocities.com/Tokyo/Garden/7024/scoutquiz.html)
+[![you are sailor moon!](moon.png)](https://web.archive.org/web/20090805085714/http://geocities.com/Tokyo/Garden/7024/scoutquiz.html)
 
-[![you are tomoe mami](mamitomoe.jpg)](https://www.theotaku.com/quizzes/view/3096/which_madoka_magica_girl_are_you%3F)
+[![you are tomoe mami](mamitomoe.png)](https://www.theotaku.com/quizzes/view/3096/which_madoka_magica_girl_are_you%3F)
 
-[![you are takara miyuki!](miyuki.jpg)](https://www.theotaku.com/quizzes/view/1078/what_lucky_star_character_are_you%3F)
+[![you are takara miyuki!](miyuki.png)](https://www.theotaku.com/quizzes/view/1078/what_lucky_star_character_are_you%3F)
 
 [![your alignment is chaotic neutral](chaoticneutral.png)](http://easydamus.com/alignmenttest.html)
 
-[![your flavor is marshmallow!](marshmallow.jpg)](https://uquiz.com/quiz/Hi7XMK/what-flavor-are-you-with-a-minor-analysis)
+[![your flavor is marshmallow!](marshmallow.png)](https://uquiz.com/quiz/Hi7XMK/what-flavor-are-you-with-a-minor-analysis)
 
 [![your fruit is dragonfruit!](DragonFruit.png)](https://gudetea.github.io/FruitCard-Odyssey/)
 
-[![my color palette personality is...pink!](INFP2.jpg)](https://ktestone.com/colorPaletteEng/)
+[![my color palette personality is...pink!](INFP2.png)](https://ktestone.com/colorPaletteEng/)
 
 [![your flowerBTI is...freesia](INFP.png)](https://ktestone.com/flowerBTIEng/)
 
-[![the window inside your mind is...snowy!](INFJ.jpg)](https://ktestone.com/heartWindowEng/)
+[![the window inside your mind is...snowy!](INFJ.png)](https://ktestone.com/heartWindowEng/)
 
-[![your polaroid personality is..ISFJ](ISFJ2.jpg)](https://ktestone.com/polaroidCharacteristicEng/)
+[![your polaroid personality is..ISFJ](ISFJ2.png)](https://ktestone.com/polaroidCharacteristicEng/)
 
-[![your digital personality is...simulation data](INFJ4.jpg)](https://ktestone.com/digitalCharEng/)
+[![your digital personality is...simulation data](INFJ4.png)](https://ktestone.com/digitalCharEng/)
 
-[![your frequently spoken words are...worry](INFJ6.jpg)](https://ktestone.com/speechHabitEng/)
+[![your frequently spoken words are...worry](INFJ6.png)](https://ktestone.com/speechHabitEng/)
 
-[![my bubble personality is...simulation bubble](INFJ3.jpg)](https://ktestone.com/bubbleCharEng/)
+[![my bubble personality is...simulation bubble](INFJ3.png)](https://ktestone.com/bubbleCharEng/)
 
 [![your factBTI is...ISFJ Oasis](ISFJ.png)](https://ktestone.com/personalColorFactEng/)
 
-[![your raindrop personality is...sleeping rain](ISFP2.jpg)](https://ktestone.com/rainDropEng/)
+[![your raindrop personality is...sleeping rain](ISFP2.png)](https://ktestone.com/rainDropEng/)
 
 [![your egg personality is...water drop eggs!](INFJ.png)](https://ktestone.com/eggCharEng/)
 
-[![your hanbok-BTI is...INFJ-A](INFJ5.jpg)](https://ktestone.com/hanbokBTIEng/)
+[![your hanbok-BTI is...INFJ-A](INFJ5.png)](https://ktestone.com/hanbokBTIEng/)
 
 [![your 2022 color is...grandis](ISFJ2.png)](https://ktestone.com/personalColor2022Eng/)
 
 [![your fox type is...fennec!](fennecfox.png)](https://www.allthetests.com/personality-tests/animals/foxes/quiz23/1198205618/what-type-of-fox-are-you)
 
-[![your fly, sparrow personality is...pleasant sparrow](ENFP.jpg)](https://ktestone.com/flyJjackCharEng/)
+[![your fly, sparrow personality is...pleasant sparrow](ENFP.png)](https://ktestone.com/flyJjackCharEng/)
 
-[![your rice ball characcter personality is...grain rice](ENFP2.jpg)](https://ktestone.com/onigiriCharEng/)
+[![your rice ball characcter personality is...grain rice](ENFP2.png)](https://ktestone.com/onigiriCharEng/)
 
-[![your spring petal love is...dandelion petal](ISFP3.jpg)](https://ktestone.com/loveSpringFlowerEng/)
+[![your spring petal love is...dandelion petal](ISFP3.png)](https://ktestone.com/loveSpringFlowerEng/)
 
-[![test by myself and others: i don't really know myself either](INFJ2.jpg)](https://ktestone.com/meOtherEng/)
+[![test by myself and others: i don't really know myself either](INFJ2.png)](https://ktestone.com/meOtherEng/)
 
-[![your love dice romance type is...romatic romance](ISFP.jpg)](https://ktestone.com/loveDiceLoveEng/)
+[![your love dice romance type is...romatic romance](ISFP.png)](https://ktestone.com/loveDiceLoveEng/)
 
-[![my self profile is...caring is essential ego](ISFJ.jpg)](https://ktestone.com/egoProfileEng/)
+[![my self profile is...caring is essential ego](ISFJ.png)](https://ktestone.com/egoProfileEng/)
 
-[![your doodle glassboard personality is...nervous doodle](INFP.jpg)](https://ktestone.com/doodleGlassBoardCharEng/)
+[![your doodle glassboard personality is...nervous doodle](INFP.png)](https://ktestone.com/doodleGlassBoardCharEng/)
 
-[![your sick burn picking type is...stubborn](INTJ.jpg)](https://ktestone.com/charFactPokPickEng/)
+[![your sick burn picking type is...stubborn](INTJ.png)](https://ktestone.com/charFactPokPickEng/)
 
 [![your animal crossing villager type is...uchi!](acvillager.png)](https://www.gotoquiz.com/what_is_your_animal_crossing_personality_answ)
 
@@ -75,9 +75,9 @@ title = "quizzes I've taken"
 
 [![your color is...ocean bay](colortest.png)](https://ktestone.com/kapable.github.io/personalColorEng/)
 
-[![your dominant element is...water!](element-water.jpg)](https://www.springhole.net/quizzes/dominant-element-quiz/index.html)
+[![your dominant element is...water!](element-water.png)](https://www.springhole.net/quizzes/dominant-element-quiz/index.html)
 
-[![i am...cheddar cheese!](cheddar03.gif)](https://web.archive.org/web/20040802234501/http://cupped-expressions.net/cheese/quiz/)
+[![i am...cheddar cheese!](cheddar03.png)](https://web.archive.org/web/20040802234501/http://cupped-expressions.net/cheese/quiz/)
 </div>
 
 <a href="https://www.dragonflycave.com/quizzes/what-type-are-you/grass"><img src="https://www.dragonflycave.com/typequiz/grass.png" alt="Grass" title="I am a Grass-type!"></a>

content/updates.md

@@ -1,23 +0,0 @@
-+++
-title = "site updates"
-template = "page-notop.html"
-+++
-- **24/09/13**: new layout, new [stardew valley](/games/sdv) page, new [blog post](/blog/retrospring); added [links](/links), updated basically the entire site.
-- **24/08/09**: new [blog post](/blog/sixth/)!
-- **24/07/22**: updated [about](/about/) and added a new [blog post](/blog/fifth/).
-- **24/07/14**: added a new [quiz](/quiz) and a few new [picrews](/picrew).
-- **24/07/13**: took a bunch of new [quizzes](/quiz) and added them!
-- **24/07/05**: completely redid the css for the entire site and changed much of the structure. layout version 2 is live!
-- **24/05/22**: added a [now](../now) page. what's a [now page](https://nownownow.com/about)? also added some more [egglish](../blog/egglish/) terms, changed the way the link menu is displayed, and minor edits to [about](../about).
-- **24/05/11**: new [blog post](../blog/egglish/), minor changes to [about](../about/) page, added new [quiz](../quiz/) results
-- **24/04/22**: wao! new [blog post](../blog/third)!
-- **24/04/21**: updated the [about](../about) section!
-- **24/04/05**: added more art to the [fridge](../fridge/) from [lucidiot](https://tilde.town/~lucidiot/).
-- **24/04/03**: added more art to the [fridge](../fridge/) from [Palette Jam](https://palettejam.carrd.co/).
-- **24/03/30**: changed the color palette of the site.
-- **24/03/27**: added new art to the [fridge](../fridge/) from [Lian](https://transfem.social/@LianSirenia)!; restructured the old art page and called it the fridge >w< tell me it's not cute: you can't.
-- **24/03/13**: added [second blog post](../blog/second/)
-- **24/03/11**: added [fanart & creations](../fridge/), added more to [picrews](../picrew)
-- **24/03/06**: added [first blog post](../blog/first/), removed under construction graphic
-- **24/02/27**: filled out [about](../about/) section, added some fanlistings to the front page.
-- **24/02/21**: initial upload, a peachmoon is born!

content/updates/20240221.md

@@ -0,0 +1,6 @@
++++
+date = "2024-02-21"
+[taxonomies]
+  tags = ["updates"]
++++
+initial upload, a peachmoon is born!

content/updates/20240227.md

@@ -0,0 +1,6 @@
++++
+date = "2024-02-27"
+[taxonomies]
+  tags = ["updates"]
++++
+filled out [about](../about/) section, added some fanlistings to the front page.

content/updates/20240306.md

@@ -0,0 +1,6 @@
++++
+date = "2024-03-06"
+[taxonomies]
+  tags = ["updates"]
++++
+added [first blog post](../blog/first/), removed under construction graphic

content/updates/20240311.md

@@ -0,0 +1,6 @@
++++
+date = "2024-03-11"
+[taxonomies]
+  tags = ["updates"]
++++
+added [fanart & creations](../fridge/), added more to [picrews](../picrew)

content/updates/20240313.md

@@ -0,0 +1,6 @@
++++
+date = "2024-03-13"
+[taxonomies]
+  tags = ["updates"]
++++
+added [second blog post](../blog/second/)

content/updates/20240327.md

@@ -0,0 +1,6 @@
++++
+date = "2024-03-27"
+[taxonomies]
+  tags = ["updates"]
++++
+added new art to the [fridge](../fridge/) from [Lian](https://transfem.social/@LianSirenia)!; restructured the old art page and called it the fridge >w< tell me it's not cute: you can't.

content/updates/20240330.md

@@ -0,0 +1,6 @@
++++
+date = "2024-03-30"
+[taxonomies]
+  tags = ["updates"]
++++
+changed the color palette of the site.

content/updates/20240403.md

@@ -0,0 +1,6 @@
++++
+date = "2024-04-03"
+[taxonomies]
+  tags = ["updates"]
++++
+added more art to the [fridge](../fridge/) from [Palette Jam](https://palettejam.carrd.co/).

content/updates/20240405.md

@@ -0,0 +1,6 @@
++++
+date = "2024-04-05"
+[taxonomies]
+  tags = ["updates"]
++++
+added more art to the [fridge](../fridge/) from [lucidiot](https://tilde.town/~lucidiot/).

content/updates/20240421.md

@@ -0,0 +1,6 @@
++++
+date = "2024-04-21"
+[taxonomies]
+  tags = ["updates"]
++++
+updated the [about](../about) section!

content/updates/20240422.md

@@ -0,0 +1,6 @@
++++
+date = "2024-04-22"
+[taxonomies]
+  tags = ["updates"]
++++
+wao! new [blog post](../blog/third)!

content/updates/20240511.md

@@ -0,0 +1,6 @@
++++
+date = "2024-05-11"
+[taxonomies]
+  tags = ["updates"]
++++
+new [blog post](../blog/egglish/), minor changes to [about](../about/) page, added new [quiz](../quiz/) results

content/updates/20240522.md

@@ -0,0 +1,6 @@
++++
+date = "2024-05-22"
+[taxonomies]
+  tags = ["updates"]
++++
+added a [now](../now) page. what's a [now page](https://nownownow.com/about)? also added some more [egglish](../blog/egglish/) terms, changed the way the link menu is displayed, and minor edits to [about](../about).

content/updates/20240705.md

@@ -0,0 +1,6 @@
++++
+date = "2024-07-05"
+[taxonomies]
+  tags = ["updates"]
++++
+completely redid the css for the entire site and changed much of the structure. layout version 2 is live!

content/updates/20240713.md

@@ -0,0 +1,6 @@
++++
+date = "2024-07-13"
+[taxonomies]
+  tags = ["updates"]
++++
+took a bunch of new [quizzes](/quiz) and added them!

content/updates/20240714.md

@@ -0,0 +1,6 @@
++++
+date = "2024-07-14"
+[taxonomies]
+  tags = ["updates"]
++++
+added a new [quiz](/quiz) and a few new [picrews](/picrew).

content/updates/20240722.md

@@ -0,0 +1,6 @@
++++
+date = "2024-07-22"
+[taxonomies]
+  tags = ["updates"]
++++
+updated [about](/about/) and added a new [blog post](/blog/fifth/).

content/updates/20240809.md

@@ -0,0 +1,6 @@
++++
+date = "2024-08-09"
+[taxonomies]
+  tags = ["updates"]
++++
+new [blog post](/blog/sixth/)!

content/updates/20240913.md

@@ -0,0 +1,6 @@
++++
+date = "2024-09-13"
+[taxonomies]
+  tags = ["updates"]
++++
+new layout, new [stardew valley](/games/sdv) page, new [blog post](/blog/retrospring); added [links](/links), updated basically the entire site.

content/updates/_index.md

@@ -0,0 +1,4 @@
++++
+title = "site updates"
+sort_by = "date"
++++

static/css/style.css

@@ -166,14 +166,20 @@ pre {
   margin: 0;
 }
 
+p.bottomnav {
+  text-align: right;
+  margin: auto;
+  position:sticky;
+  bottom: 15px;
+}
+
 .center {
   text-align: center;
 }
 
 .QandA ol {
   list-style: decimal;
-  margin-left: 2.5em;
-  font-style: oblique;
+  margin-left: 3em;
 }
 
 .QandA ul {
@@ -258,6 +264,59 @@ time {
   font-size: 0.9em;
 }
 
+.tag {
+  list-style: none;
+  padding-left: 0;
+  line-height: 2.5rem;
+  text-align: center;
+}
+.tag ol {
+  justify-content: center;
+}
+
+.tag li {
+  display: inline-block;
+  font-family: firstly, cursive;
+  font-size: 1.5em;
+  padding: 0.125rem 0.25rem;
+  text-decoration: none;
+}
+
+.tagcloud {
+  list-style: none;
+  padding-left: 0;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: center;
+  line-height: 2.5rem;
+}
+
+.tagcloud a {
+  display:block;
+  font-family: firstly, cursive;
+  --size: 4;
+  font-size: calc(var(--size) * 0.5rem + 1.5rem);
+  padding: 0.125rem 0.25rem;
+  text-decoration: none;
+  position: relative;
+}
+
+.tagcloud a[data-weight="1"] { --size: 1; }
+.tagcloud a[data-weight="2"] { --size: 2; }
+.tagcloud a[data-weight="3"] { --size: 3; }
+.tagcloud a[data-weight="4"] { --size: 4; }
+.tagcloud a[data-weight="5"] { --size: 5; }
+.tagcloud a[data-weight="6"] { --size: 6; }
+.tagcloud a[data-weight="7"] { --size: 7; }
+.tagcloud a[data-weight="8"] { --size: 8; }
+.tagcloud a[data-weight="9"] { --size: 9; }
+
+.tagcloud li:nth-child(2n+1) a { --color: var(--headColor); }
+.tagcloud li:nth-child(3n+1) a { --color: var(--hovColor); }
+.tagcloud li:nth-child(4n+1) a { --color: var(--linkColor); }
+
+
 dt {
   font-weight:bold;
   margin-left: 3em;
@@ -334,22 +393,27 @@ hr {
 }
 
 .four-column {
-  display:flex;
-  flex-wrap:wrap;
-  width:98%;
-  margin:auto;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); 
+  gap: 10px;
+  padding: 10px;
   text-align: center;
 }
 
 .four-column > * {
-  width:100%;
-  justify-content: center;
-  align-items: center;
-  align-content: space-evenly;
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+.four-column a {
+  position: relative;
 }
 
 .four-column img {
-  max-width: 390px;
+  width: 100%;
+  height: auto;
+  display: block;
   justify-content: space-evenly;
 }
 
@@ -357,9 +421,53 @@ hr {
   margin: 0;
 }
 
-@media (min-width:768px) {
+@media (max-width:768px) {
   .four-column > * {
-      width:calc(100% / 4);
+    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
+  }
+}
+
+
+.masonry-container {
+  column-count: 3; /* Number of columns */
+  column-gap: .1rem; /* Spacing between columns */
+  padding: .1rem;
+}
+
+.masonry-container > * {
+  break-inside: avoid; /* Prevents items from breaking inside columns */
+  margin-bottom: 10px; /* Space between items */
+}
+
+.masonry-item img {
+  width: auto;
+  height: auto; /* Maintains aspect ratio */
+  display: block;
+}
+
+/* Responsive adjustments */
+@media (max-width: 1200px) {
+  .masonry-container {
+      column-count: 3; /* 3 columns on medium screens */
+  }
+}
+
+@media (max-width: 900px) {
+  .masonry-container {
+      column-count: 2; /* 2 columns on smaller screens */
+  }
+}
+
+@media (max-width: 640px) {
+  .masonry-container {
+      column-count: 1; /* 1 column on very small screens */
+  }
+  .masonry-container p {
+    padding: 0;
+    margin: 0;
+  }
+  .masonry-container img {
+    width: calc(100% - .2rem);
   }
 }
 
@@ -468,18 +576,13 @@ profile-img img {
     height: fit-content;
     position: relative;
     justify-items: center;
+    background-color: var(--metaColor);
   }
-  .left-sidebar a {
-    float: left;
-    padding: .7rem;
-  }
-  .page-content {margin-left: 0; width: 94%;}
-}
-@media screen and (max-width: 400px) {
   .left-sidebar a {
     text-align: center;
     float: none;
   }
+  .page-content {margin-left: 0; width: 94%;}
 }
 
 nav-icon {
@@ -500,3 +603,30 @@ nav-icon img {
     position: relative;
   }
 }
+.topnav {
+  padding: 0;
+}
+/* Hide the link that should open and close the topnav on small screens */
+.topnav .icon {
+  display: none;
+}
+
+ /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
+ @media screen and (max-width: 700px) {
+  .topnav #myLinks {
+    display: none;
+  }
+  .topnav a:not(:first-child) {display: none;}
+  .topnav a.icon {
+    display: block;
+  }
+}
+
+/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
+@media screen and (max-width: 700px) {
+  .topnav.responsive {position: relative;}
+  .topnav.responsive a {
+    clear: both;
+    display: block;
+  }
+} 

static/js/script.js

@@ -29,3 +29,17 @@ fetch(url)
     }).then(function (json) {
         song.innerHTML = json['track']['name'] + ' - ' + json['track']['artist']['#text'];
     });
+
+    function myFunction() {
+      var x = document.getElementById("myTopnav");
+      if (x.className === "left-sidebar") {
+        x.className += " responsive";
+      } else {
+        x.className = "left-sidebar";
+      }
+      if (x.style.display === "block") {
+        x.style.display = "none";
+      } else {
+        x.style.display = "block";
+      }
+    } 

templates/blog-page.html

@@ -26,8 +26,8 @@
   {% if not loop.last %}
   /
   {% endif %}
-  {% endfor %}
-  {% endif %}<br>
+  {% endfor %}<br>
+  {% endif %}
 {% if config.extra.author and config.extra.display_author == true %}
   <time datetime="{{ page.date }}">published <span class="metaData">{{ page.date }}</span></time>
   <address rel="author">by {{config.extra.author}}<br></address>

templates/blog-section.html

@@ -0,0 +1,38 @@
+{% extends "base.html" %}
+
+{% block content %}
+<h1>{{ section.title }}</h1>
+<hr style="border: dashed 1px; color: var(--hovColor); width: 93%; margin: 1em auto;">
+
+<div class="tag" role="navigation" aria-label="tag cloud">
+  <p>
+  <ol>
+  <li>tags:</li>
+  <li><a href="/tags/cooking"> cooking </a></li>
+  <li><a href="/tags/girlblogging"> girlblogging </a></li>
+  <li><a href="/tags/journaling"> journaling </a></li>
+  <li><a href="/tags/kpop"> kpop </a></li>
+  </ol>
+  </div>
+</p>
+
+{{ section.content | safe }}
+
+{% if paginator %}
+{% set pages = paginator.pages %}
+{% else %}
+{% set pages = section.pages %}
+{% endif %}
+
+<ul class="titleList">
+{% for page in pages %}
+  <li>
+    {{ page.date }} &nbsp;<a href="{{ page.permalink | safe }}">{{ page.title }}</a>
+  </li>
+{% endfor %}
+</ul>
+</p>
+{% if paginator %}
+<div class="metaData">{% if paginator.previous %}<a href="{{ paginator.first }}">⥶</a> &nbsp <a href="{{ paginator.previous }}"><</a>{% endif %} &nbsp {{ paginator.current_index }} / {{ paginator.number_pagers }} &nbsp {% if paginator.next %}<a href="{{ paginator.next }}">></a> &nbsp <a href="{{ paginator.last }}">⥸</a>{% endif %}</div>
+{% endif %}
+{% endblock content %}

templates/head.html

@@ -1,6 +1,7 @@
 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<meta name="robots" content="index, follow">
+<meta name="referrer" content="no-referrer" />
+<meta name="robots" content="noimageai,noai,GPC,noindex,nofollow,nosnippet,noimageindex,nocache,none" />
 {% if page.title %}
 {% set title = page.title %}
 {% elif section.title %}

templates/section.html

@@ -13,14 +13,10 @@
 {% endif %}
 
 <ul class="titleList">
-{% for page in pages %}
-  <li>
-    {{ page.date }} &nbsp;<a href="{{ page.permalink | safe }}">{{ page.title }}</a>
-  </li>
+  {% for page in pages %}
+  {% set line = page.content | trim_start_matches(pat="<p>") | trim_end_matches(pat="</p>") -%}
+  {% set size = line | length - 5 -%}
+  <li><strong>{{ page.date | date(format="%y/%m/%d")}}</strong>: {{ line | truncate(length=size, end="") | safe }}</li>
 {% endfor %}
 </ul>
-
-{% if paginator %}
-<div class="metaData">{% if paginator.previous %}<a href="{{ paginator.first }}">⥶</a> &nbsp <a href="{{ paginator.previous }}"><</a>{% endif %} &nbsp {{ paginator.current_index }} / {{ paginator.number_pagers }} &nbsp {% if paginator.next %}<a href="{{ paginator.next }}">></a> &nbsp <a href="{{ paginator.last }}">⥸</a>{% endif %}</div>
-{% endif %}
 {% endblock content %}

templates/sidebar.html

@@ -1,6 +1,7 @@
 <profile-img>
   <a href="/picrew/" title="picrew" style="padding: 0;"><img id="randomImage" alt="mana's pfp"></a>
 </profile-img>
+<div class="topnav" id="myTopnav" style="padding: 0;">
 {% set current_lang = config.default_language %}
 {% if page %}
   {% set current_lang = page.lang %}
@@ -42,10 +43,16 @@
   </div>
   <div>
     {% if config.generate_feeds %}
+    {% block rss %}
       <a target="_blank" rel="noopener noreferrer" href="{{ get_url(path="atom.xml", trailing_slash=false) }}" title="Subscribe via RSS for updates."><i class="ph ph-rss"></i></a>
+      {% endblock rss %}
     {% endif %}
   </div>
   <div style="padding-bottom: 7px; padding-left: 0;">
     <script src="//counter1.fc2.com/counter.php?id=39521789&main=1"></script><noscript><img src="//counter1.fc2.com/counter_img.php?id=39521789&main=1" alt="fc2 counter"></noscript>
   </div>
 </nav-icon>
+</div>
+<div class="topnav">
+<a href="javascript:void(0);" class="icon" onclick="myFunction()">
+  <i class="ph ph-list"></i></a></div>