chore: autoformat with shopify liquid vscode plugin

Author: jgravois

.devcontainer/devcontainer.json

@@ -20,7 +20,7 @@
         "prettier.prettier-vscode",
         "mhutchie.git-graph",
         "redhat.vscode-xml",
-        "sissel.shopify-liquid",
+        "shopify.theme-check-vscode",
         "tombi-toml.tombi"
       ]
     }

.pre-commit-config.yaml

@@ -31,12 +31,6 @@ repos:
       - id: check-added-large-files
         args: ["--maxkb=2500"]
 
-  - repo: https://github.com/pre-commit/mirrors-prettier
-    rev: v3.1.0
-    hooks:
-      - id: prettier
-        types_or: ["html"]
-
   - repo: local
     hooks:
       - id: frontmatter-timestamp

.prettierrc

@@ -1,5 +1,6 @@
 {
   "tabWidth": 2,
   "useTabs": false,
-  "printWidth": 130
+  "printWidth": 130,
+  "liquidSingleQuote": false
 }

.vscode/settings.json

@@ -7,11 +7,11 @@
   "files.trimFinalNewlines": true,
   "files.trimTrailingWhitespace": true,
   "editor.tabSize": 2,
-  "[html]": {
-    "editor.defaultFormatter": "prettier.prettier-vscode",
-    "editor.formatOnSave": true
-  },
   "files.associations": {
     "*.html": "liquid"
+  },
+  "[liquid]": {
+    "editor.defaultFormatter": "Shopify.theme-check-vscode",
+    "editor.formatOnSave": true
   }
 }

src/_includes/article.html

@@ -8,16 +8,22 @@
     {% assign url = item.url %}
   {% endif %}
 {% else %}
-  {% assign url = item.url
-  %}
+  {% assign url = item.url %}
   {% if item.external %}
     {% assign url = item.external %}
   {% endif %}
 {% endif %}
 
 <article class="d-block mb-3 pb-4">
-  <a href="{{ url }}" {% if item.external %}target="_blank"{% endif %}>{{- item.title -}}</a>
-  <br />
+  <a
+    href="{{ url }}"
+    {% if item.external %}
+      target="_blank"
+    {% endif %}
+  >
+    {{- item.title -}}
+  </a>
+  <br>
   <span class="text-body-tertiary font-poppins fs-7">
     {% if item.outlet %}{{ item.outlet }} |{% endif %}
     {% if item.tags.size > 0 %}{{ item.tags | join: ", " }} |{% endif %}