Fixed #962

teacat · Dec 30, 2023 · 338672f · 338672f
1 parent 53ba15d
commit 338672f
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 3 deletions.
diff --git a/languages/zh-tw/components/wrap.yml b/languages/zh-tw/components/wrap.yml
@@ -17,6 +17,17 @@ Type: Article
 Relatives:
     - Grid
 
+#=======================================================
+# 變數
+# Variables
+#=======================================================
+
+Variables:
+    - Name: "--gap"
+      Default: "1rem"
+      Description: "項目之間的空白間隙寬度。"
+      Target: ".ts-wrap"
+
 #=======================================================
 # 基本樣式
 # Definitions

diff --git a/src/wrap.css b/src/wrap.css
@@ -2,13 +2,17 @@
    Variables
    ========================================================================== */
 
+.ts-wrap {
+    --gap: 1rem;
+}
+
 /* ==========================================================================
    Base
    ========================================================================== */
 
 .ts-wrap {
     display: flex;
-    gap: 1rem;
+    gap: var(--gap);
     flex-wrap: wrap;
 }
 
@@ -64,13 +68,13 @@
  */
 
 .ts-wrap.is-relaxed {
-    gap: 2rem;
+    --gap: 2rem;
 }
 
 /**
  * Compact
  */
 
 .ts-wrap.is-compact {
-    gap: 0.5rem;
+    --gap: 0.5rem;
 }