feat: update to Astro v2.5.7 (latest)

.gitignore

@@ -17,6 +17,5 @@ yarn-error.log*
 # macOS-specific files
 .DS_Store
 
-
 # vscode
 .vscode/

.nvmrc

@@ -0,0 +1 @@
+v18.16.0

astro.config.mjs

@@ -7,7 +7,7 @@ export default {
   outDir: './dist', // When running `astro build`, path to final static output
   publicDir: './public', // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing.
   build: {
-    site: 'https://devprotocol.xyz', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
+    site: 'https://devprotocol.xyz/', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
     sitemap: true, // Generate sitemap (set to "false" to disable)
   },
   server: {

package.json

@@ -15,31 +15,31 @@
   },
   "devDependencies": {
     "@astrojs/renderer-vue": "^0.2.1",
-    "astro": "^1.2.3",
+    "@astrojs/tailwind": "^3.1.3",
+    "@astrojs/vue": "^2.2.1",
+    "astro": "^2.5.7",
     "autoprefixer": "^10.4.0",
     "bignumber.js": "9.0.2",
-    "eslint": "^8.5.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-config-standard": "^16.0.3",
-    "eslint-plugin-import": "^2.25.3",
+    "eslint": "^8.41.0",
+    "eslint-config-prettier": "^8.8.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-n": "^16.0.0",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-promise": "^6.0.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-promise": "^6.1.1",
     "husky": "^7.0.4",
     "node-fetch": "2.6.1",
     "postcss": "^8.4.5",
-    "prettier": "^2.6.0",
-    "prettier-plugin-astro": "^0.0.12",
-    "prettier-plugin-tailwindcss": "^0.1.8",
+    "prettier": "^2.8.8",
+    "prettier-plugin-astro": "^0.10.0",
+    "prettier-plugin-tailwindcss": "^0.3.0",
     "ramda": "^0.28.0",
     "remark-cli": "^10.0.1",
-    "tailwindcss": "^3.0.7",
-    "@astrojs/tailwind": "^1.0.1",
-    "@astrojs/vue": "^1.0.2"
+    "tailwindcss": "^3.0.7"
   },
   "description": "Dev Protocol's open-source website, built with Astro",
   "repository": "https://github.com/dev-protocol/devprotocol.xyz.git",
   "author": "dev-protocol",
-  "license": "MIT",
-  "dependencies": {}
+  "license": "MIT"
 }

src/components/About/About.astro

@@ -1,14 +1,14 @@
 <section
-  class="flex max-w-7xl flex-col px-6 lg:px-20 text-center md:text-left bg-white pt-24 dark:bg-darkPrimary mx-auto"
+  class="mx-auto flex max-w-7xl flex-col bg-white px-6 pt-24 text-center dark:bg-darkPrimary md:text-left lg:px-20"
 >
   <div class="m-auto space-y-10">
     <h3
-      class="font-black text-center font-display text-6xl my-6 md:my-0 md:mt-4 lg:mb-12"
+      class="font-display my-6 text-center text-6xl font-black md:my-0 md:mt-4 lg:mb-12"
     >
       About
     </h3>
     <div>
-      <h4 class="text-3xl sm:text-4xl font-display mb-4">
+      <h4 class="font-display mb-4 text-3xl sm:text-4xl">
         What is the mission and vision of Dev Protocol?
       </h4>
       <p>
@@ -19,7 +19,7 @@
       </p>
     </div>
     <div>
-      <h4 class="text-3xl sm:text-4xl font-display mb-4">
+      <h4 class="font-display mb-4 text-3xl sm:text-4xl">
         Where does the Dev Protocol idea come from?
       </h4>
       <p>
@@ -33,7 +33,7 @@
       </p>
     </div>
     <div>
-      <h4 class="text-3xl sm:text-4xl font-display mb-4">
+      <h4 class="font-display mb-4 text-3xl sm:text-4xl">
         The value of the Dev Protocol
       </h4>
       <p>

src/components/About/Team.astro

@@ -1,112 +1,129 @@
 ---
 const people = [
-    {
-        name: "Mayumi Hara",
-        title: 'CEO',
-        img: '/assets/teams/mayu.png',
-        link: "https://www.linkedin.com/in/hara-mayumi-58799b37/"
-    },
-    {
-        name: "Aggre",
-        title: 'CTO',
-        img: '/assets/teams/aggre.png',
-        link: "https://www.linkedin.com/in/aggre/"
-    },
-    {
-        name: "Mariko Miyamoto",
-        title: 'COO',
-        img: '/assets/teams/mariko.png',
-        link: "https://www.linkedin.com/in/mariko-miyamoto-96a907112/"
-    },
-    {
-        name: "Kaoru Kimura",
-        title: 'Biz Dev / Partner Business',
-        img: '/assets/teams/KaoruKimura.jpg',
-        link: "https://www.linkedin.com/in/kaorukimura/"
-    },
-    {
-        name: "Stu",
-        title: 'Core Dev',
-        img: '/assets/teams/stu.jpg',
-        link: "https://github.com/stuartwk"
-    },
-        {
-        name: "Shubham Kukreti",
-        title: 'Developer Relations',
-        img: "https://github.com/KukretiShubham.png",
-        link: "https://github.com/KukretiShubham/"
-    },
-    {
-        name: "Yash",
-        title: 'Core Dev',
-        img: '/assets/teams/Yash.jpg',
-        link: "https://www.linkedin.com/in/yashragrawal"
-    },
-    {
-        name: "Matteu",
-        title: 'UX Engineer',
-        img: '/assets/teams/matteu.jpg',
-        link: "https://matteusan.me"
-    },
-    {
-        name: 'Masako Arita',
-        title: 'General Manager',
-        img: '/assets/teams/masako.jpeg',
-        link: "https://medium.com/@masako_76810/about"
-    },
-    {
-        name: "Kent Kuroiwa",
-        title: 'Communications Lead',
-        img: '/assets/teams/kent.jpg',
-        link: "https://twitter.com/kurochandev"
-    },
-    {
-        name: 'Andrew Giunta',
-        title: 'Data Analyst',
-        img: '/assets/teams/andrew.jpg',
-        link: "https://twitter.com/andrewdevproto1"
-    },
-    {
-        name: 'Martin Ruilova',
-        title: 'Operation ＆ Governance Analyst',
-        img: '/assets/teams/Martin_Rui.jpg',
-        link: "https://www.linkedin.com/in/martinruilova/"
-    },
-    {
-        name: 'Dr. Eelco Fiole',
-        title: 'The Director of Governance Lead',
-        img: '/assets/teams/Eelco.jpg',
-        link: "https://www.linkedin.com/in/fiole"
-    },
-    {
-        name: 'Hiroki Omae',
-        title: 'Adviser',
-        img: '/assets/teams/omae_hiroki.jpg',
-        link: "https://learning.unity3d.jp/speaker/hiroki-omae/"
-    }
+  {
+    name: 'Mayumi Hara',
+    title: 'CEO',
+    img: '/assets/teams/mayu.png',
+    link: 'https://www.linkedin.com/in/hara-mayumi-58799b37/',
+  },
+  {
+    name: 'Aggre',
+    title: 'CTO',
+    img: '/assets/teams/aggre.png',
+    link: 'https://www.linkedin.com/in/aggre/',
+  },
+  {
+    name: 'Mariko Miyamoto',
+    title: 'COO',
+    img: '/assets/teams/mariko.png',
+    link: 'https://www.linkedin.com/in/mariko-miyamoto-96a907112/',
+  },
+  {
+    name: 'Kaoru Kimura',
+    title: 'Biz Dev / Partner Business',
+    img: '/assets/teams/KaoruKimura.jpg',
+    link: 'https://www.linkedin.com/in/kaorukimura/',
+  },
+  {
+    name: 'Stu',
+    title: 'Core Dev',
+    img: '/assets/teams/stu.jpg',
+    link: 'https://github.com/stuartwk',
+  },
+  {
+    name: 'Shubham Kukreti',
+    title: 'Developer Relations',
+    img: 'https://github.com/KukretiShubham.png',
+    link: 'https://github.com/KukretiShubham/',
+  },
+  {
+    name: 'Yash',
+    title: 'Core Dev',
+    img: '/assets/teams/Yash.jpg',
+    link: 'https://www.linkedin.com/in/yashragrawal',
+  },
+  {
+    name: 'Matteu',
+    title: 'UX Engineer',
+    img: '/assets/teams/matteu.jpg',
+    link: 'https://matteusan.me',
+  },
+  {
+    name: 'Masako Arita',
+    title: 'General Manager',
+    img: '/assets/teams/masako.jpeg',
+    link: 'https://medium.com/@masako_76810/about',
+  },
+  {
+    name: 'Kent Kuroiwa',
+    title: 'Communications Lead',
+    img: '/assets/teams/kent.jpg',
+    link: 'https://twitter.com/kurochandev',
+  },
+  {
+    name: 'Andrew Giunta',
+    title: 'Data Analyst',
+    img: '/assets/teams/andrew.jpg',
+    link: 'https://twitter.com/andrewdevproto1',
+  },
+  {
+    name: 'Martin Ruilova',
+    title: 'Operation ＆ Governance Analyst',
+    img: '/assets/teams/Martin_Rui.jpg',
+    link: 'https://www.linkedin.com/in/martinruilova/',
+  },
+  {
+    name: 'Dr. Eelco Fiole',
+    title: 'The Director of Governance Lead',
+    img: '/assets/teams/Eelco.jpg',
+    link: 'https://www.linkedin.com/in/fiole',
+  },
+  {
+    name: 'Hiroki Omae',
+    title: 'Adviser',
+    img: '/assets/teams/omae_hiroki.jpg',
+    link: 'https://learning.unity3d.jp/speaker/hiroki-omae/',
+  },
 ]
 ---
 
-<div class="bg-white dark:bg-darkPrimary pb-10">
-  <div class="max-w-7xl mx-auto py-10 px-4 text-center sm:px-6 lg:px-8">
+<div class="bg-white pb-10 dark:bg-darkPrimary">
+  <div class="mx-auto max-w-7xl py-10 px-4 text-center sm:px-6 lg:px-8">
     <div class="space-y-8 sm:space-y-12">
       <div class="space-y-5 sm:mx-auto sm:max-w-xl sm:space-y-4 lg:max-w-5xl">
-        <h2 class="text-3xl font-extrabold font-display tracking-tight sm:text-4xl">The Team</h2>
+        <h2
+          class="font-display text-3xl font-extrabold tracking-tight sm:text-4xl"
+        >
+          The Team
+        </h2>
       </div>
-      <ul role="list" class="mx-auto grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-4 md:gap-x-6 lg:max-w-5xl lg:gap-x-8 lg:gap-y-12 xl:grid-cols-6">
-        {people.map(person => (
-        <li>
-          <div class="space-y-4">
-            <a href={person.link}><img class="mx-auto h-20 w-20 rounded-full lg:w-24 lg:h-24" src={person.img} alt={person.name}></a>
-            <div class="space-y-2">
-              <div class="text-xs font-medium lg:text-sm">
-                <a href={person.link}><h3>{person.name}</h3></a>
-                <p class="text-indigo-500">{person.title}</p>
+      <ul
+        role="list"
+        class="mx-auto grid grid-cols-2 gap-x-4 gap-y-8 sm:grid-cols-4 md:gap-x-6 lg:max-w-5xl lg:gap-x-8 lg:gap-y-12 xl:grid-cols-6"
+      >
+        {
+          people.map((person) => (
+            <li>
+              <div class="space-y-4">
+                <a href={person.link}>
+                  <img
+                    class="mx-auto h-20 w-20 rounded-full lg:h-24 lg:w-24"
+                    src={person.img}
+                    alt={person.name}
+                  />
+                </a>
+                <div class="space-y-2">
+                  <div class="text-xs font-medium lg:text-sm">
+                    <a href={person.link}>
+                      <h3>{person.name}</h3>
+                    </a>
+                    <p class="text-indigo-500">{person.title}</p>
+                  </div>
+                </div>
               </div>
-            </div>
-          </div>
-        </li>
-        ))}
+            </li>
+          ))
+        }
       </ul>
     </div>
   </div>

src/components/Creators/Hero.astro

@@ -1,16 +1,5 @@
 <section
-  class="
-    mt-20
-    lg:mt-0
-    flex flex-col
-    items-center
-    justify-center
-    min-h-screen
-    text-center text-lg
-    lg:text-left
-    lg:flex-row-reverse
-    m-auto
-  "
+  class="m-auto mt-20 flex min-h-screen flex-col items-center justify-center text-center text-lg lg:mt-0 lg:flex-row-reverse lg:text-left"
 >
   <div class="w-auto items-center lg:mx-20">
     <img
@@ -22,15 +11,15 @@
     />
   </div>
   <div class="mx-12 p-4 lg:max-w-half">
-    <h3 class="font-bold text-6xl mt-4">Create public goods to Earn.</h3>
-    <p class="max-w-prose my-6">
+    <h3 class="mt-4 text-6xl font-bold">Create public goods to Earn.</h3>
+    <p class="my-6 max-w-prose">
       Creators can start monetization of any kind of works by issuing their own
       social token (ERC-20) and then promoting them to the community. It's like
       a "stock company" with all the features you need to grow your business,
       including efficient management of ownership and distribution of revenue.
     </p>
-    <a href="https://stakes.social/create" class="mt-6 mx-4 ml-0">
-      <button class="bg-black text-white py-2 px-6 rounded">
+    <a href="https://stakes.social/create" class="mx-4 mt-6 ml-0">
+      <button class="rounded bg-black py-2 px-6 text-white">
         Submit a Project
       </button>
     </a>