From 518c406ff605af2a8f946f765f36fbe265f0b29c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C3=ABl=20Gallego?= <mic.gallego@gmail.com>
Date: Thu, 19 Feb 2026 10:19:28 +0900
Subject: [PATCH] Add doc for Squish filter

---
 _filters/squish.md | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)
 create mode 100644 _filters/squish.md

diff --git a/_filters/squish.md b/_filters/squish.md
new file mode 100644
index 00000000..569983df
--- /dev/null
+++ b/_filters/squish.md
@@ -0,0 +1,32 @@
+---
+title: squish
+description: Liquid filter that remove all whitespace on both ends of the string, and then changing remaining consecutive whitespace groups into one space each.
+---
+
+Remove all whitespace on both ends of the string, and then changing remaining consecutive whitespace groups into one space each. `squish` is commonly used
+to dynamically create a list of classes or inline styles.
+
+<p class="code-label">Input</p>
+```liquid
+{%- raw -%}
+{% capture styles %}
+  --background: {% if section.settings.use_primary_background %}#ffffff{% else %}#000000{% endif %};
+  --border-radius: {% if section.settings.use_rounded %}10{% else %}0{% endif %}px;
+{% endcapture %}
+
+{% capture class %}
+  card
+  {% if section.settings.show_compact_card %}
+    card--compact
+  {% endif %}
+{% endcapture %}
+
+<div style="{{ styles | squish }}" class="{{ class | squish }}">
+</div>
+```
+
+<p class="code-label">Output</p>
+```text
+<div style="--background: #ffffff; --border-radius: 10px" class="card card--compact">
+</div>
+```