🚩: import 사용에 문제가 되어 tailwild.config에서 전역적으로 스타일링 정의하는 방식으로 커스텀 후 적용 및 확인 성공

4BFC · 4BFC · commit e6b3b37962f1 · 2024-09-16T06:00:31.000+09:00
diff --git a/trends/tailwindcss/TextAdventureGame/src/index.html b/trends/tailwindcss/TextAdventureGame/src/index.html
@@ -11,6 +11,7 @@
 <body>
   <div class="bg-blue-500 text-blue-50 test-padding">test</div>
   <div class="bg-blue-500 text-blue-50 w-[50px]">test</div>
+  <div class="bg-status2 text-success w-[20px] p-padding-02">test</div>
 </body>
 
 </html>
diff --git a/trends/tailwindcss/tailwind.config.js b/trends/tailwindcss/tailwind.config.js
@@ -4,7 +4,22 @@ module.exports = {
     './TextAdventureGame/src/**/*.{html,js,ts,css,scss}',
   ],
   theme: {
-    extend: {},
+    extend: {
+      spacing: {
+        'padding-01': '18rem',
+        'padding-02': '21rem',
+        'padding-03': '24rem',
+      },
+      colors: {
+        primary: "#000000",
+        sub: "#D9D9D9",
+        status1: "#000000",
+        status2: "#222222",
+        errorCancel: "#FF0000",
+        success: "#0038FF",
+        safety: "#32BF00",
+      }
+    },
   },
   plugins: [],
 }
