lots of design adjustments

package.json

@@ -28,7 +28,8 @@
     "webpack": "^5.86.0",
     "webpack-cli": "^5.1.4",
     "webpack-dev-middleware": "^7.2.1",
-    "webpack-hot-middleware": "^2.26.1"
+    "webpack-hot-middleware": "^2.26.1",
+    "yaml": "^2.5.0"
   },
   "scripts": {
     "start": "node ./src/js/server.js --config ./config.json",

src/css/blog.css

@@ -2,7 +2,6 @@ body {
   --paragraph-vertical-margin: 1.5rem;
 }
 
-
 .blog-header {
   display: flex;
   align-items: center;
@@ -116,8 +115,7 @@ body {
   left: 0;
   bottom: 0;
   width: 2rem;
-  background: var(--accent);
-  opacity: .5;
+  background: var(--accent80);
 }
 .blog-content .blog-info i {
   position: absolute;
@@ -155,7 +153,7 @@ body {
 .blog-content figure img,
 .blog-content .video-container iframe {
   border-radius: 1rem;
-  box-shadow: 0 0 15px rgba(0,0,0,.1);
+  box-shadow: var(--medium-shadow);
   max-width: 500px;
   width: 100%;
   margin-bottom: 1rem;
@@ -193,21 +191,37 @@ body {
 }
 .blog-pagination li {
   flex-grow: 1;
+  width: 100%;
 }
 .blog-pagination .blog-pagination-next {
   text-align: right;
 }
+.blog-pagination  .blog-pagination-list {
+  text-align: center;
+}
 
+/* elden ring style */
 
 body.tag-elden-ring {
-  --background: #020202;
-  --text: #c9c4ba;
-  --accent: #C7A770;
-  /* --accent-alt: #587263; */
-  --accent-alt: #8f7753;
-  --nav-color: #C7A770;
-  --nav-color-invert: #C7A770;
-  --text-secondary: var(--accent-alt)
+  --accent10: #f8f4ed;
+  --accent20: #e9ddc8;
+  --accent30: #dbc7a3;
+  --accent40: #cdb07f;
+  --accent50: #be9a5a;
+  --accent60: #a58041;
+  --accent70: #806432;
+  --accent80: #5c4724;
+  --accent90: #372b16;
+  --accent95: #120e07;
+  --accent: var(--accent50);
+  --accent-alt: var(--accent70);
+
+  --background: var(--accent95);
+  --text: var(--accent10);
+  --text-secondary: var(--accent-alt);
+
+  --nav-color: var(--accent);
+  --nav-color-invert: var(--accent);
 }
 body.tag-elden-ring #menu-toggle:checked + #header #logo span.logo-head::after,
 body.tag-elden-ring #header.sticky #logo span.logo-head::after {
@@ -251,19 +265,11 @@ body.tag-elden-ring .blog-content a {
   text-decoration: none;
 }
 
-/* body.tag-elden-ring .blog-content a:hover {
-  color: var(--accent-alt);
-}
-
-body.tag-elden-ring .blog-content a:visited {
-  color: var(--accent-alt);
-} */
-
 body.tag-elden-ring .blog-content  a[href*="eldenring.wiki.fextralife.com"] {
   text-decoration: underline;
   text-decoration-style: dotted;
   color: var(--text);
 }
 body.tag-elden-ring .blog-content  a[href*="eldenring.wiki.fextralife.com"]:hover {
   color: var(--accent);
-}
+}