P82282866/kt-event-marketing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

07-14번 화면 파란색을 따뜻한 붉은 계열로 통일

Browse Source 
- 인라인 CSS 변수 수정 (#0066FF → #FF6B6B)
- 배경 그라디언트를 붉은 톤으로 변경 (#F8F9FF → #FFF5F5)
- 모든 화면의 색상 통일감 확보

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
doyeon 2025-10-21 10:11:42 +09:00
parent 2833a596ab
commit 8c07bcc0d8
8 changed files with 49 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
design/uiux/prototype/07-AI참여방법설계.html
View File

@ -18,14 +18,14 @@
--color-primary: #E31E24;
--color-primary-hover: #C71820;
--color-primary-light: #FF4D52;
--color-secondary: #0066FF;
--color-secondary-hover: #004DBF;
--color-secondary-light: #4D94FF;
--color-secondary: #FF6B6B;
--color-secondary-hover: #FF5252;
--color-secondary-light: #FF8787;
--color-success: #00C853;
--color-warning: #FFA000;
--color-error: #D32F2F;
--color-info: #0288D1;
--color-info: #FF9800;
--color-gray-50: #F8F9FA;
--color-gray-100: #F1F3F5;
@ -82,7 +82,7 @@
font-size: 16px;
line-height: 1.5;
color: var(--color-gray-900);
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
min-height: 100vh;
@ -186,13 +186,13 @@
.method-card--selected {
border-color: var(--color-secondary);
background: linear-gradient(135deg, #F0F7FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
box-shadow: var(--shadow-l);
}
.method-card--recommended {
border-color: var(--color-secondary);
background: linear-gradient(135deg, #F0F7FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
}
.method-card__badge {
@ -360,7 +360,7 @@
.custom-method__input:focus {
outline: none;
border-color: var(--color-secondary);
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
box-shadow: 0 0 0 3px rgba(255, 107, 107, 0.15);
}
.custom-method__hint {

16
design/uiux/prototype/08-AI홍보문구생성.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #C41E24;
--color-primary-light: #FFE9EA;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E0EFFF;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #00C853;
--color-success-light: #E8F5E9;
--color-error: #FF3B30;
@ -99,7 +99,7 @@
/* Layout */
.copy-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}
@ -149,7 +149,7 @@
position: absolute;
width: 100%;
height: 100%;
border: 4px solid rgba(0, 102, 255, 0.1);
border: 4px solid rgba(255, 107, 107, 0.1);
border-radius: 50%;
border-top-color: var(--color-secondary);
animation: spin 1s linear infinite;
@ -277,13 +277,13 @@
.copy-card--selected {
border-color: var(--color-secondary);
background: linear-gradient(135deg, #F0F7FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
box-shadow: var(--shadow-lg);
}
.copy-card--recommended {
border-color: var(--color-secondary);
background: linear-gradient(135deg, #F0F7FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
}
.copy-card__badge {
@ -474,7 +474,7 @@
.form-group__textarea:focus {
outline: none;
border-color: var(--color-secondary);
box-shadow: 0 0 0 3px rgba(0, 102, 255, 0.1);
box-shadow: 0 0 0 3px rgba(255, 107, 107, 0.15);
}
.edit-modal__actions {

10
design/uiux/prototype/09-AI이미지생성.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -137,7 +137,7 @@
/* Layout */
.image-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}
@ -248,7 +248,7 @@
.image-item {
position: relative;
aspect-ratio: 1;
background: linear-gradient(135deg, #E0E7FF 0%, #F0F7FF 100%);
background: linear-gradient(135deg, #FFE9E9 0%, #FFF5F5 100%);
border-radius: var(--radius-l);
overflow: hidden;
cursor: pointer;

8
design/uiux/prototype/10-AI영상제작.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -137,7 +137,7 @@
/* Layout */
.video-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}

14
design/uiux/prototype/11-SNS콘텐츠생성.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -137,7 +137,7 @@
/* Layout */
.sns-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}
@ -230,7 +230,7 @@
.platform-card__header {
padding: var(--spacing-m);
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
border-bottom: 1px solid var(--color-border-light);
display: flex;
justify-content: space-between;
@ -297,7 +297,7 @@
.post-preview__header {
padding: var(--spacing-s);
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
display: flex;
align-items: center;
gap: var(--spacing-s);
@ -324,7 +324,7 @@
.post-preview__image {
width: 100%;
aspect-ratio: 1 / 1;
background: linear-gradient(135deg, #E0E7FF 0%, #F0F7FF 100%);
background: linear-gradient(135deg, #FFE9E9 0%, #FFF5F5 100%);
display: flex;
align-items: center;
justify-content: center;

10
design/uiux/prototype/12-QR포스터생성.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -137,7 +137,7 @@
/* Layout */
.qr-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}
@ -242,7 +242,7 @@
/* Info Card */
.info-card {
background: linear-gradient(135deg, #E3F2FD 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFE9E9 0%, #FFFFFF 100%);
border-left: 4px solid var(--color-secondary);
padding: var(--spacing-m);
border-radius: var(--radius-m);

8
design/uiux/prototype/13-콘텐츠편집.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -141,7 +141,7 @@
/* Layout */
.edit-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}

16
design/uiux/prototype/14-콘텐츠최종승인.html
View File

@ -11,9 +11,9 @@
--color-primary: #E31E24;
--color-primary-dark: #B71C1C;
--color-primary-light: #FFEBEE;
--color-secondary: #0066FF;
--color-secondary-dark: #0052CC;
--color-secondary-light: #E3F2FD;
--color-secondary: #FF6B6B;
--color-secondary-dark: #FF5252;
--color-secondary-light: #FFE9E9;
--color-success: #4CAF50;
--color-success-light: #E8F5E9;
--color-warning: #FF9800;
@ -137,7 +137,7 @@
/* Layout */
.approval-container {
min-height: 100vh;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
padding-bottom: var(--spacing-2xl);
}
@ -230,7 +230,7 @@
.content-card__header {
padding: var(--spacing-m);
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
border-bottom: 1px solid var(--color-border-light);
display: flex;
justify-content: space-between;
@ -284,7 +284,7 @@
.image-item {
aspect-ratio: 1;
background: linear-gradient(135deg, #E0E7FF 0%, #F0F7FF 100%);
background: linear-gradient(135deg, #FFE9E9 0%, #FFF5F5 100%);
border-radius: var(--radius-m);
display: flex;
align-items: center;
@ -301,7 +301,7 @@
.sns-item {
padding: var(--spacing-s);
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
border-radius: var(--radius-m);
display: flex;
align-items: center;
@ -343,7 +343,7 @@
/* Poster Preview */
.poster-preview {
aspect-ratio: 3 / 4;
background: linear-gradient(135deg, #F8F9FF 0%, #FFFFFF 100%);
background: linear-gradient(135deg, #FFF5F5 0%, #FFFFFF 100%);
border-radius: var(--radius-m);
padding: var(--spacing-l);
display: flex;