update packages and navigation

.prettierrc

@@ -1,4 +1,5 @@
 {
+  "plugins": ["prettier-plugin-astro"],
   "overrides": [
     {
       "files": ["*.astro"],

package.json

@@ -17,9 +17,9 @@
     "@astrojs/mdx": "^0.19.7",
     "@astrojs/react": "^2.2.1",
     "@astrojs/rss": "^2.4.3",
-    "@astrojs/sitemap": "^1.3.3",
+    "@astrojs/sitemap": "^2.0.1",
     "@astrojs/tailwind": "^4.0.0",
-    "astro": "^2.7.4",
+    "astro": "^2.9.1",
     "astro-auto-import": "^0.3.0",
     "date-fns": "^2.30.0",
     "date-fns-tz": "^2.0.0",
@@ -27,9 +27,9 @@
     "fuse.js": "^6.6.2",
     "github-slugger": "^2.0.0",
     "gray-matter": "^4.0.3",
-    "marked": "^5.1.0",
+    "marked": "^5.1.1",
-    "prettier-plugin-astro": "^0.10.0",
+    "prettier-plugin-astro": "^0.11.0",
-    "prettier-plugin-tailwindcss": "^0.3.0",
+    "prettier-plugin-tailwindcss": "^0.4.1",
     "prop-types": "^15.8.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -37,24 +37,24 @@
     "react-lite-youtube-embed": "^2.3.52",
     "remark-collapse": "^0.1.2",
     "remark-toc": "^8.0.1",
-    "sharp": "^0.32.1",
+    "sharp": "^0.32.4",
-    "swiper": "^10.0.3"
+    "swiper": "^10.0.4"
   },
   "devDependencies": {
-    "@tailwindcss/forms": "^0.5.3",
+    "@tailwindcss/forms": "^0.5.4",
     "@tailwindcss/typography": "^0.5.9",
-    "@types/marked": "^5.0.0",
+    "@types/marked": "^5.0.1",
-    "@types/node": "20.4.0",
+    "@types/node": "20.4.3",
-    "@types/react": "18.2.14",
+    "@types/react": "18.2.15",
-    "@types/react-dom": "18.2.6",
+    "@types/react-dom": "18.2.7",
     "autoprefixer": "^10.4.14",
-    "eslint": "^8.44.0",
+    "eslint": "^8.45.0",
-    "postcss": "^8.4.24",
+    "postcss": "^8.4.27",
     "prettier": "^3.0.0",
-    "prettier-plugin-astro": "^0.10.0",
+    "prettier-plugin-astro": "^0.11.0",
-    "prettier-plugin-tailwindcss": "^0.3.0",
+    "prettier-plugin-tailwindcss": "^0.4.1",
-    "sass": "^1.63.6",
+    "sass": "^1.64.1",
-    "tailwindcss": "^3.3.2",
+    "tailwindcss": "^3.3.3",
     "tailwind-bootstrap-grid": "^5.0.1",
     "typescript": "5.1.6"
   }

readme.md

@@ -70,19 +70,19 @@
 
 ### 👉 Install Dependencies
 
-```
+```bash
 npm install
 ```
 
 ### 👉 Development Command
 
-```
+```bash
 npm run dev
 ```
 
 ### 👉 Build Command
 
-```
+```bash
 npm run build
 ```
 

src/layouts/partials/Header.astro

@@ -31,26 +31,23 @@ const { pathname } = Astro.url;
     <!-- navbar toggler -->
     <input id="nav-toggle" type="checkbox" class="hidden" />
     <label
-      id="show-button"
       for="nav-toggle"
-      class="order-3 flex cursor-pointer items-center text-dark dark:text-white lg:order-1 lg:hidden"
+      class="order-3 cursor-pointer text-dark dark:text-white lg:order-1"
     >
-      <svg class="h-6 fill-current" viewBox="0 0 20 20">
+      <span id="show-button" class="flex items-center lg:order-1 lg:hidden">
-        <title>Menu Open</title>
+        <svg class="h-6 fill-current" viewBox="0 0 20 20">
-        <path d="M0 3h20v2H0V3z m0 6h20v2H0V9z m0 6h20v2H0V0z"></path>
+          <title>Menu Open</title>
-      </svg>
+          <path d="M0 3h20v2H0V3z m0 6h20v2H0V9z m0 6h20v2H0V0z"></path>
-    </label>
+        </svg>
-    <label
+      </span>
-      id="hide-button"
+      <span id="hide-button" class="hidden items-center lg:order-1">
-      for="nav-toggle"
+        <svg class="h-6 fill-current" viewBox="0 0 20 20">
-      class="order-3 hidden cursor-pointer items-center text-dark dark:text-white lg:order-1"
+          <title>Menu Close</title>
-    >
+          <polygon
-      <svg class="h-6 fill-current" viewBox="0 0 20 20">
+            points="11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2"
-        <title>Menu Close</title>
+            transform="rotate(45 10 10)"></polygon>
-        <polygon
+        </svg>
-          points="11 9 22 9 22 11 11 11 11 22 9 22 9 11 -2 11 -2 9 9 9 9 -2 11 -2"
+      </span>
-          transform="rotate(45 10 10)"></polygon>
-      </svg>
     </label>
     <!-- /navbar toggler -->
     <ul