chore: run prettier (#32)

* chore: run prettier

* chore: add mdx to list of recommneded extension

* chore: setup format on save and use prettier for mdx

* chore: handle html whitespace properly

Author: nartc

.devcontainer/devcontainer.json

@@ -1,21 +1,21 @@
 // For format details, see https://aka.ms/devcontainer.json. For config options, see the
 // README at: https://github.com/devcontainers/templates/tree/main/src/javascript-node
 {
-	"name": "Node.js",
-	"image": "mcr.microsoft.com/devcontainers/javascript-node:16-bullseye"
+  "name": "Node.js",
+  "image": "mcr.microsoft.com/devcontainers/javascript-node:16-bullseye"
 
-	// Features to add to the dev container. More info: https://containers.dev/features.
-	// "features": {},
+  // Features to add to the dev container. More info: https://containers.dev/features.
+  // "features": {},
 
-	// Use 'forwardPorts' to make a list of ports inside the container available locally.
-	// "forwardPorts": [],
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  // "forwardPorts": [],
 
-	// Use 'postCreateCommand' to run commands after the container is created.
-	// "postCreateCommand": "yarn install",
+  // Use 'postCreateCommand' to run commands after the container is created.
+  // "postCreateCommand": "yarn install",
 
-	// Configure tool-specific properties.
-	// "customizations": {},
+  // Configure tool-specific properties.
+  // "customizations": {},
 
-	// Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
-	// "remoteUser": "root"
+  // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
+  // "remoteUser": "root"
 }

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,10 +1,9 @@
 ---
 name: Feature request
 about: Suggest an idea for this project
-title: ''
-labels: ''
-assignees: ''
-
+title: ""
+labels: ""
+assignees: ""
 ---
 
 **Is your feature request related to a problem? Please describe.**

.prettierrc.cjs

@@ -1,11 +1,13 @@
 module.exports = {
-    plugins: [require.resolve('prettier-plugin-astro')],
-    overrides: [
-      {
-        files: '*.astro',
-        options: {
-          parser: 'astro',
-        },
+  plugins: [require.resolve("prettier-plugin-astro")],
+  overrides: [
+    {
+      files: "*.astro",
+      options: {
+        parser: "astro",
+        // ensure HTML tag breaks properly
+        htmlWhitespaceSensitivity: "ignore",
       },
-    ],
-  };
+    },
+  ],
+};

.vscode/extensions.json

@@ -1,4 +1,8 @@
 {
-  "recommendations": ["astro-build.astro-vscode", "esbenp.prettier-vscode"],
+  "recommendations": [
+    "astro-build.astro-vscode",
+    "esbenp.prettier-vscode",
+    "unifiedjs.vscode-mdx"
+  ],
   "unwantedRecommendations": []
 }

.vscode/settings.json

@@ -5,7 +5,15 @@
   "deno.importMap": ".netlify/edge-functions-import-map.json",
   "deno.path": "/home/codespace/.config/netlify/deno-cli/deno",
   "prettier.documentSelectors": ["**/*.astro"],
-   "[astro]": {
+  "[astro]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "[mdx]": {
+    "editor.defaultFormatter": "esbenp.prettier-vscode"
+  },
+  "editor.formatOnSave": true,
+  "editor.formatOnSaveMode": "file",
+  "editor.codeActionsOnSave": {
+    "source.organizeImports": true
   }
 }

CODE_OF_CONDUCT.md

@@ -17,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-* Demonstrating empathy and kindness toward other people
-* Being respectful of differing opinions, viewpoints, and experiences
-* Giving and gracefully accepting constructive feedback
-* Accepting responsibility and apologizing to those affected by our mistakes,
+- Demonstrating empathy and kindness toward other people
+- Being respectful of differing opinions, viewpoints, and experiences
+- Giving and gracefully accepting constructive feedback
+- Accepting responsibility and apologizing to those affected by our mistakes,
   and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the
+- Focusing on what is best not just for us as individuals, but for the
   overall community
 
 Examples of unacceptable behavior include:
 
-* The use of sexualized language or imagery, and sexual attention or
+- The use of sexualized language or imagery, and sexual attention or
   advances of any kind
-* Trolling, insulting or derogatory comments, and personal or political attacks
-* Public or private harassment
-* Publishing others' private information, such as a physical or email
+- Trolling, insulting or derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or email
   address, without their explicit permission
-* Other conduct which could reasonably be considered inappropriate in a
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
@@ -106,7 +106,7 @@ Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban
 
 **Community Impact**: Demonstrating a pattern of violation of community
-standards, including sustained inappropriate behavior,  harassment of an
+standards, including sustained inappropriate behavior, harassment of an
 individual, or aggression toward or disparagement of classes of individuals.
 
 **Consequence**: A permanent ban from any sort of public interaction within

README.md

@@ -1,6 +1,9 @@
 # Angular Snippets
+
 <!-- ALL-CONTRIBUTORS-BADGE:START - Do not remove or modify this section -->
+
 [![All Contributors](https://img.shields.io/badge/all_contributors-6-orange.svg?style=flat-square)](#contributors-)
+
 <!-- ALL-CONTRIBUTORS-BADGE:END -->
 
 A website to find and share code snippets for Angular.

src/components/BlogCard.astro

@@ -19,10 +19,7 @@ url = url + "/";
 <li
   class="flex flex-col leading-relaxed rounded-2xl border border-zinc-900/10 dark:border-zinc-700/40 hover:dark:bg-zinc-800/20 hover:bg-zinc-200/20 dark:text-zinc-400"
 >
-  <a
-    class="flex flex-col gap-2 sm:gap-4 pt-5 px-5 pb-8"
-    href={url}
-  >
+  <a class="flex flex-col gap-2 sm:gap-4 pt-5 px-5 pb-8" href={url}>
     <time class="shrink-0 text-base sm:hidden">{shortDate}</time>
     <span class="flex items-center justify-between mb-1">
       <h2 class="text-xl font-medium text-black dark:text-white">{title}</h2>

src/components/BlogImage.astro

@@ -15,4 +15,4 @@ const { src, alt, loading = "lazy" } = Astro.props;
   loading={loading}
   alt={alt}
   class="rounded-xl overflow-hidden"
-/>
+/>

src/components/Footer.astro

@@ -1,3 +1,5 @@
-<footer class="mx-auto text-sm px-8 pt-8 pb-12 text-gray-500 dark:text-gray-400 max-w-7xl text-right">
-An open source project created by Santhosh Yadav.
-</footer>
+<footer
+  class="mx-auto text-sm px-8 pt-8 pb-12 text-gray-500 dark:text-gray-400 max-w-7xl text-right"
+>
+  An open source project created by Santhosh Yadav.
+</footer>