chore: update Astro to v3

package.json

@@ -16,21 +16,21 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/solid-js": "^2.2.0",
-    "@astrojs/tailwind": "^3.1.3",
-    "@tailwindcss/typography": "^0.5.9",
-    "astro": "^2.6.4",
-    "feather-icons": "^4.29.0",
-    "solid-js": "^1.7.6",
-    "tailwindcss": "^3.3.2"
+    "@astrojs/solid-js": "^3.0.0",
+    "@astrojs/tailwind": "^5.0.0",
+    "@tailwindcss/typography": "^0.5.10",
+    "astro": "^3.0.8",
+    "feather-icons": "^4.29.1",
+    "solid-js": "^1.7.11",
+    "tailwindcss": "^3.3.3"
   },
   "packageManager": "[email protected]",
   "devDependencies": {
-    "@solidjs/testing-library": "^0.7.1",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@types/testing-library__jest-dom": "^5.14.6",
+    "@solidjs/testing-library": "^0.8.4",
+    "@testing-library/jest-dom": "^6.1.3",
+    "@types/testing-library__jest-dom": "^6.0.0",
     "jsdom": "^22.1.0",
     "vite-plugin-solid": "^2.7.0",
-    "vitest": "^0.32.2"
+    "vitest": "^0.34.3"
   }
 }

src/components/navigation/MenuWithRibbon.astro

@@ -33,7 +33,7 @@ const { ribbonTitle } = Astro.props
   <div id="menu-ribbon-button" class="flex cursor-pointer">
     <img src="/menu.svg" alt="menu" />
   </div>
-  <span>{ribbonTitle}</span>
+  <span class={cx('text-sm','md:text-base','md:py-6')}>{ribbonTitle}</span>
   <div>
     <a class="flex" href={blogSiteRoot}
       ><img class="logo" src="/logo-white.svg" alt="home" />