Update packages/configs/action (#331)

* Update packages & configs

* Fix action

.github/workflows/publish.yml → .github/workflows/Deploy.yml

@@ -1,4 +1,4 @@
-name: Astro Deploy
+name: Deploy
 
 on:
   workflow_dispatch:
@@ -18,7 +18,7 @@ env:
   BUILD_PATH: "."
 
 jobs:
-  build:
+  Build:
     name: Build
     runs-on: ubuntu-latest
     steps:
@@ -30,32 +30,35 @@ jobs:
         with:
           version: latest
 
-      - name: Setup Node
-        uses: actions/setup-node@v3
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
         with:
           node-version: "*"
           check-latest: true
           cache: "pnpm"
 
-      - name: Setup pages
+      - name: Configure GitHub Pages
         id: pages
         uses: actions/configure-pages@v3
 
-      - run: |
-          pnpm install --frozen-lockfile
-          pnpm build
+      - name: Install node_modules
+        run: pnpm install --frozen-lockfile
+
+      - name: Astro build
+        run: pnpm build
+
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v2
         with:
           path: ${{ env.BUILD_PATH }}/dist
 
-  deploy:
+  Deploy:
     name: Deploy
     runs-on: ubuntu-latest
-    needs: build
+    needs: Build
     environment:
       name: github-pages
-      url: ${{ steps.deployment.outputs.pages_url }}
+      url: ${{ steps.deployment.outputs.page_url }}
     steps:
       - name: Deploy to GitHub Pages
         id: deployment

README.md

@@ -1,25 +1,55 @@
-# surge-synth-team.org
+# https://surge-synthesizer.github.io/
 
-### This website is built with [Astro](https://astro.build/) & [Tailwind CSS](https://tailwindcss.com/).
+**Built with [Astro](https://astro.build/) & [Tailwind CSS](https://tailwindcss.com/)**
 
-### [Astro Editor Setup](https://docs.astro.build/en/editor-setup/) & [Tailwind Editor Setup](https://tailwindcss.com/docs/editor-setup)
+1. Install [node.js](https://nodejs.org/en)
+    - (Optional) Install [pnpm](https://pnpm.io/)
+2. `npm install`/`pnpm install` to install dependencies
+3. `npm run dev`/`pnpm dev` to run the development server
 
+# Adding and editing pages
+
+To make changes, all you need to is fork the project. Once you have done that you can create a branch on your fork make changes and then open a PR. [This](https://github.com/surge-synthesizer/surge/blob/main/doc/How%20to%20Git.md) git document for the OSS Surge-Synthesizer project outlines a suggested way of doing work and then creating PRs.
+
+Once you have created a branch in your fork you can then just click the edit button (upper right corner) to edit a post in the `src/content/pages` folder. Because the posts are markdown documents you can just edit stuff in place in the GitHub editor.
+
+To add a page, open the `src/content/pages` folder in your fork and click the create new file button.
+
+A post has a frontmatter section and a body section. The frontmatter section is metadata about the post, such as which image to use and what categories it belongs to. A new post would have frontmatter that looks something like:
+
+```
 ---
+slug: surge-xt
+title: Surge XT
+summary: Surge XT is an open source hybrid synthesizer, and the synth which started the Surge Synth Team project!
+order: 1
+thumbnail: /screenshots/surge-xt.png
+categories: [Synth]
+url: https://surge-synthesizer.github.io
+issue_tracker: https://github.com/surge-synthesizer/surge/issues
+---
+```
+
+The title is the display name for the post, the summary is the text in the card on the main page, the thumbnail is an image for the project, and the categories are a comma-separated list of any appropriate categories (look at the other projects for categories that already exist). The order determines which position a post appears in on the main page.
+
+The body section of a post is where you can write a description of the project in markdown. It is everything after the frontmatter section.
 
-#### **Install these VS Code Extensions**
+# Editor setup
+
+## Official guides
+
+-   [Astro](https://docs.astro.build/en/editor-setup/)
+-   [Tailwind](https://tailwindcss.com/docs/editor-setup)
+
+## VS Code Setup
 
 -   [Astro](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode)
+-   [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)
 -   [Prettier](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode)
 -   [MDX](https://marketplace.visualstudio.com/items?itemName=unifiedjs.vscode-mdx)
--   [Tailwind CSS IntelliSense](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss)
-
-Optional:
-
 -   [YAML](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml)
 
-In your VS Code `settings.json` file:
-
-#### Set Prettier as your default formatter
+### Set Prettier as your default formatter
 
 ```json
 {
@@ -34,7 +64,7 @@ In your VS Code `settings.json` file:
 }
 ```
 
-#### Format on paste, save & type
+### Format on paste, save & type
 
 ```json
 {
@@ -44,7 +74,7 @@ In your VS Code `settings.json` file:
 }
 ```
 
-#### Associate CSS files with tailwind
+### Associate CSS files with tailwind
 
 ```json
 {
@@ -53,43 +83,3 @@ In your VS Code `settings.json` file:
     }
 }
 ```
-
-# Working on the site
-
--   Install [node.js](https://nodejs.org/en)
--   Install [pnpm](https://pnpm.io/) (optionally)
--   Run `npm install` or `pnpm install` depending on your choice of package manager
--   Run `npm run dev` or `pnpm dev` to run the development server @ http://localhost:3000/
--   Run `npm run build` or `pnpm build` to build the site to the `dist` directory
--   Run `npm run preview` or `pnpm preview` to preview the built site
-
-Static assets (images, fonts, etc.) live in the `public` directory.
-
-You can use Tailwind inline or edit the main file in the `src/css` directory.
-
-# Adding and editing pages
-
-To make changes, all you need to is fork the project. Once you have done that, you can create a branch on your fork make changes and then open a pull request. [This](https://github.com/surge-synthesizer/surge/blob/main/doc/How%20to%20Git.md) document from the open source Surge Synthesizer project outlines a suggested way of doing work and then creating pull requests.
-
-Once you have created a branch in your fork, you can just click the Edit button (upper right corner) to edit a post in the `src/content/pages` folder. Since the posts are Markdown documents, you can just edit stuff in place in GitHub's code editor.
-
-To add a page, open the `src/content/pages` folder in your fork and click Create New File button.
-
-A post has a frontmatter section and a body section. The frontmatter section is metadata about the post, such as which image to use and what categories it belongs to. A new post would have frontmatter that looks something like:
-
-```
----
-slug: surge-xt
-title: Surge XT
-summary: Surge XT is an open source hybrid synthesizer, and the synth which started the Surge Synth Team project!
-order: 1
-thumbnail: /screenshots/surge-xt.png
-categories: [Synth]
-url: https://surge-synthesizer.github.io
-issue_tracker: https://github.com/surge-synthesizer/surge/issues
----
-```
-
-The title is the display name for the post, the summary is the text in the card on the main page, the thumbnail is an image for the project, and the categories are a comma-separated list of any appropriate categories (look at the other projects for categories that already exist). The order determines which position a post appears in on the main page.
-
-The body section of a post is where you can write a description of the project in markdown. It is everything after the frontmatter section.

astro.config.ts

@@ -31,5 +31,5 @@ export default defineConfig({
             wrap: true,
         },
     },
-    integrations: [mdx(), react(), tailwind()],
+    integrations: [mdx(), react(), tailwind({ applyBaseStyles: false })],
 });

package.json

@@ -1,6 +1,7 @@
 {
     "name": "surge-synthesizer.github.io",
     "private": true,
+    "type": "module",
     "scripts": {
         "astro": "astro",
         "dev": "astro dev",