sn: components.css 통합

This commit is contained in:
2026-07-27 10:29:45 +09:00
parent 69c3183e35
commit 2652e2cfe0
6 changed files with 142 additions and 84 deletions
-4
View File
@@ -1,9 +1,5 @@
import "./styles/base.css";
import "./styles/components.css";
import "./styles/components-black.css";
import "./styles/components-blue.css";
import "./styles/components-green.css";
import "./styles/components-red.css";
import { AppProvider } from "./providers";
import { cookies } from "next/headers";
@@ -1,20 +0,0 @@
@tailwind components;
@layer components {
.card {
@apply relative m-[0.6rem] box-border min-h-[2rem] rounded-[0.5rem] p-[0.6rem] text-[1.3rem] text-label;
}
.card-border {
@apply border border-border bg-background shadow-blur;
}
.card-header {
@apply -mx-[0.6rem] flex items-center justify-between border-b border-b-border p-4;
}
.card-footer {
@apply -mx-[0.6rem] mt-2 flex items-center justify-center border-t border-t-border py-4;
}
input[type="file"] {
@apply h-[40px] w-[200px] cursor-pointer rounded-md border border-input bg-field px-3 py-2 text-sm text-foreground;
}
}
@@ -1,20 +0,0 @@
@tailwind components;
@layer components {
.card {
@apply relative m-[0.6rem] box-border min-h-[2rem] rounded-[0.5rem] p-[0.6rem] text-[1.3rem] text-label;
}
.card-border {
@apply border border-border bg-background shadow-blur;
}
.card-header {
@apply -mx-[0.6rem] flex items-center justify-between border-b border-b-border p-4;
}
.card-footer {
@apply -mx-[0.6rem] mt-2 flex items-center justify-center border-t border-t-border py-4;
}
input[type="file"] {
@apply h-[40px] w-[200px] cursor-pointer rounded-md border border-input bg-field px-3 py-2 text-sm text-foreground;
}
}
@@ -1,20 +0,0 @@
@tailwind components;
@layer components {
.card {
@apply relative m-[0.6rem] box-border min-h-[2rem] rounded-[0.5rem] p-[0.6rem] text-[1.3rem] text-label;
}
.card-border {
@apply border border-border bg-background shadow-blur;
}
.card-header {
@apply -mx-[0.6rem] flex items-center justify-between border-b border-b-border p-4;
}
.card-footer {
@apply -mx-[0.6rem] mt-2 flex items-center justify-center border-t border-t-border py-4;
}
input[type="file"] {
@apply h-[40px] w-[200px] cursor-pointer rounded-md border border-input bg-field px-3 py-2 text-sm text-foreground;
}
}
-20
View File
@@ -1,20 +0,0 @@
@tailwind components;
@layer components {
.card {
@apply relative m-[0.6rem] box-border min-h-[2rem] rounded-[0.5rem] p-[0.6rem] text-[1.3rem] text-label;
}
.card-border {
@apply border border-border bg-background shadow-blur;
}
.card-header {
@apply -mx-[0.6rem] flex items-center justify-between border-b border-b-border p-4;
}
.card-footer {
@apply -mx-[0.6rem] mt-2 flex items-center justify-center border-t border-t-border py-4;
}
input[type="file"] {
@apply h-[40px] w-[200px] cursor-pointer rounded-md border border-input bg-field px-3 py-2 text-sm text-foreground;
}
}
+142
View File
@@ -190,6 +190,148 @@
.sn-popup-help-text {
@apply mt-2 rounded-md border border-border bg-secondary px-4 py-3 text-[1.05rem] text-label;
}
.form-section-title {
@apply mt-4 border border-border bg-[#eaf3fb] p-2 text-center text-xl font-medium text-[#647784];
}
[data-theme="black"] {
.card {
color: #fff;
background-color: #0a0a0a !important;
}
form {
color: rgb(255 255 255);
}
label {
color: rgb(241, 241, 241);
}
input {
height: 3.2rem;
background-color: #1a1a1a;
border: 1px solid #262626;
border-radius: 4px;
}
input.text-gray-600 {
color: #f1f1f1;
}
button[role="combobox"] {
color: #f1f1f1;
background-color: rgb(26, 26, 26);
}
div [role="tablist"] {
border: unset;
gap: 4px;
}
.tabs-trigger[data-state="inactive"] {
color: #a4b7bf;
background: #55595d;
}
.tabs-trigger[data-state="inactive"]:hover {
color: #6bbaff;
background: #4c4f52;
}
.card-border {
box-shadow: 0 0 10px -1px #0000000f;
border: 1px solid #393939;
@apply border-[#3f4042] bg-[rgba(255,255,255,0.065)];
}
a[aria-current="page"] {
background-color: rgb(32, 148, 250);
color: #000;
}
.card-header {
@apply border-b-[#3f4042];
}
.form-section-title {
@apply bg-[#5e7b9c] text-[#fff];
}
.gis-layer-panel {
background: #111214;
border-right-color: #2f3136;
box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.gis-layer-panel-title {
color: #f3f4f6;
}
.gis-layer-panel hr {
border-color: #2f3136;
}
.gis-layer-row {
color: #e5e7eb;
}
.gis-layer-row:hover {
background: rgba(255, 255, 255, 0.08);
}
.gis-layer-row span,
.gis-layer-row label {
color: #e5e7eb !important;
}
.gis-layer-row input[type="checkbox"] {
accent-color: #c026d3;
}
.gis-layer-action-button {
background: #1a1c20;
border-color: #3b82f6;
color: #cfe3ff;
}
.gis-layer-action-button:hover {
background: #23262b;
}
.gis-layer-setting {
background: #111214;
border-top: 1px solid #2f3136;
}
.gis-layer-toggle {
background: #111214;
border-color: #2f3136;
color: #f3f4f6;
}
.gis-layer-toggle:hover {
background: #1a1c20;
}
input[type="file"] {
background-color: #1a1a1a;
border-color: #262626;
color: #f1f1f1;
}
}
[data-theme="blue"] {
.card-border {
@apply border-[#3f4042] bg-[rgba(255,255,255,0.065)];
}
.card-header {
@apply border-b-[#3f4042];
}
.form-section-title {
@apply bg-[#eaf3fb] text-[#647784];
}
}
[data-theme="green"] {
.card-border {
@apply border-[#3f4042] bg-[rgba(255,255,255,0.065)];
}
.card-header {
@apply border-b-[#3f4042];
}
.form-section-title {
@apply bg-[#ebf7f7] text-[#64908f];
}
}
[data-theme="red"] {
.card-border {
@apply border-[#3f4042] bg-[rgba(255,255,255,0.065)];
}
.card-header {
@apply border-b-[#3f4042];
}
.form-section-title {
@apply bg-[#f6f6f9] text-[#808080];
}
}
}
/* `I/I 분석 > 침입수 분석결과`는 나중에 다시 사용할 수 있도록 라우트는 유지하고 LNB에서만 임시 숨김 처리한다. */
/* `I/I 분석 > 침입수 분석결과`, `RDII 분석결과`는 지도 popup 흐름으로 대체하고 레거시 라우트는 유지한 채 LNB에서만 숨긴다. */