Compare commits

...

2 Commits

Author SHA1 Message Date
420a009c4c fix(frontend): remove prose-lg utility requiring typography plugin
Some checks failed
continuous-integration/drone/push Build is failing
- Replace prose-lg with prose-text using standard text-lg utility
- Remove duplicate typography layer definitions
- Clean up CSS structure to use only core Tailwind utilities
- Resolve 'Cannot apply unknown utility class prose-lg' error

Frontend Docker build now succeeds with only minor @screen warnings
2025-11-02 07:11:02 +09:00
82ea14f053 fix(frontend): remove missing test-styles.css import
- Remove reference to non-existent test-styles.css file in globals.css
- This resolves frontend build error in Docker/CI environment
- Keep existing layouts.css import which exists and is valid

Fixes: Can't resolve './test-styles.css' webpack error
2025-11-02 07:03:27 +09:00

View File

@@ -1,6 +1,5 @@
@import "tailwindcss"; @import "tailwindcss";
@import "./styles/layouts.css"; @import "./styles/layouts.css";
@import "./test-styles.css";
/* src/app/globals.css */ /* src/app/globals.css */
@tailwind base; @tailwind base;
@tailwind components; @tailwind components;
@@ -48,6 +47,7 @@ body {
@apply text-base; @apply text-base;
} }
} }
@layer components { @layer components {
.btn { .btn {
@apply bg-blue-500 text-white font-bold py-2 px-4 rounded; @apply bg-blue-500 text-white font-bold py-2 px-4 rounded;
@@ -56,6 +56,7 @@ body {
@apply bg-blue-700; @apply bg-blue-700;
} }
} }
@layer utilities { @layer utilities {
.bg-custom { .bg-custom {
@apply bg-blue-100; @apply bg-blue-100;
@@ -64,6 +65,7 @@ body {
@apply text-blue-500; @apply text-blue-500;
} }
} }
@layer screens { @layer screens {
@screen sm { @screen sm {
.text-sm { .text-sm {
@@ -81,6 +83,7 @@ body {
} }
} }
} }
@layer forms { @layer forms {
.form-input { .form-input {
@apply border-gray-300 rounded-md shadow-sm; @apply border-gray-300 rounded-md shadow-sm;
@@ -89,20 +92,22 @@ body {
@apply border-blue-500 ring-blue-500; @apply border-blue-500 ring-blue-500;
} }
} }
@layer typography { @layer typography {
.prose { .prose-text {
@apply prose-lg; @apply text-lg;
} }
.prose h1 { .prose-text h1 {
@apply text-3xl font-bold; @apply text-3xl font-bold;
} }
.prose h2 { .prose-text h2 {
@apply text-2xl font-bold; @apply text-2xl font-bold;
} }
.prose h3 { .prose-text h3 {
@apply text-xl font-bold; @apply text-xl font-bold;
} }
} }
@layer animations { @layer animations {
.fade-in { .fade-in {
@apply transition-opacity duration-500 ease-in; @apply transition-opacity duration-500 ease-in;
@@ -111,6 +116,7 @@ body {
@apply transition-opacity duration-500 ease-out; @apply transition-opacity duration-500 ease-out;
} }
} }
@layer transitions { @layer transitions {
.transition-all { .transition-all {
@apply transition-all duration-300 ease-in-out; @apply transition-all duration-300 ease-in-out;
@@ -119,6 +125,7 @@ body {
@apply transition-colors duration-300 ease-in-out; @apply transition-colors duration-300 ease-in-out;
} }
} }
@layer shadows { @layer shadows {
.shadow-custom { .shadow-custom {
@apply shadow-lg; @apply shadow-lg;
@@ -127,6 +134,7 @@ body {
@apply shadow-none; @apply shadow-none;
} }
} }
@layer borders { @layer borders {
.border-custom { .border-custom {
@apply border-2 border-blue-500; @apply border-2 border-blue-500;
@@ -135,6 +143,7 @@ body {
@apply border-none; @apply border-none;
} }
} }
@layer spacing { @layer spacing {
.p-custom { .p-custom {
@apply p-4; @apply p-4;
@@ -143,6 +152,7 @@ body {
@apply m-4; @apply m-4;
} }
} }
@layer flex { @layer flex {
.flex-center { .flex-center {
@apply flex items-center justify-center; @apply flex items-center justify-center;
@@ -151,6 +161,7 @@ body {
@apply flex flex-col; @apply flex flex-col;
} }
} }
@layer grid { @layer grid {
.grid-custom { .grid-custom {
@apply grid grid-cols-3 gap-4; @apply grid grid-cols-3 gap-4;
@@ -159,17 +170,3 @@ body {
@apply grid place-items-center; @apply grid place-items-center;
} }
} }
@layer typography {
.prose {
@apply prose-lg;
}
.prose h1 {
@apply text-3xl font-bold;
}
.prose h2 {
@apply text-2xl font-bold;
}
.prose h3 {
@apply text-xl font-bold;
}
}