344 lines
8.7 KiB
CSS
344 lines
8.7 KiB
CSS
@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;
|
|
}
|
|
|
|
.sn-popup-page {
|
|
@apply flex h-screen min-w-0 flex-col overflow-hidden bg-background text-foreground;
|
|
}
|
|
|
|
.sn-popup-modal-page {
|
|
@apply flex h-screen items-start justify-center bg-container px-3 py-3 text-foreground;
|
|
}
|
|
|
|
.sn-popup-shell {
|
|
@apply w-full overflow-hidden rounded-[12px] border border-border bg-background;
|
|
}
|
|
|
|
.sn-popup-modal-shell {
|
|
@apply w-full overflow-hidden rounded-[12px] border border-border bg-background;
|
|
}
|
|
|
|
.sn-popup-header {
|
|
@apply flex min-h-[44px] items-center justify-between border-b border-border bg-primary px-5 py-3;
|
|
}
|
|
|
|
.sn-popup-modal-header {
|
|
@apply flex h-[44px] items-center border-b border-border bg-secondary px-[18px];
|
|
}
|
|
|
|
.sn-popup-title {
|
|
@apply text-[1.45rem] font-semibold text-primary-foreground;
|
|
}
|
|
|
|
.sn-popup-modal-title {
|
|
@apply text-[1.35rem] font-semibold tracking-[-0.01em] text-foreground;
|
|
}
|
|
|
|
.sn-popup-header-link {
|
|
@apply mr-3 text-[1.05rem] font-medium text-primary-foreground hover:text-primary-foreground;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
.sn-popup-header-button {
|
|
@apply border px-3 py-1 text-[1.05rem] text-primary-foreground;
|
|
border-color: color-mix(in srgb, var(--primary-foreground) 30%, transparent);
|
|
}
|
|
|
|
.sn-popup-section {
|
|
@apply flex min-h-0 flex-1 flex-col overflow-hidden p-4;
|
|
}
|
|
|
|
.sn-popup-filter-panel {
|
|
@apply grid grid-cols-1 gap-3 border-b border-border bg-secondary pb-4;
|
|
}
|
|
|
|
.sn-popup-filter-panel-compact {
|
|
@apply border-b border-border bg-secondary pb-3;
|
|
}
|
|
|
|
.sn-popup-field {
|
|
@apply block min-w-0;
|
|
}
|
|
|
|
.sn-popup-field-label {
|
|
@apply mb-1 text-[1.05rem] font-medium text-label;
|
|
}
|
|
|
|
.sn-popup-input {
|
|
@apply h-10 w-full rounded-md border border-input bg-field px-3 text-[1.05rem] text-foreground outline-none placeholder:text-placeholder focus:ring-2 focus:ring-ring;
|
|
}
|
|
|
|
.sn-popup-input-sm {
|
|
@apply h-[32px] rounded-[6px] border border-input bg-field px-[10px] text-[1.02rem] font-medium text-foreground outline-none transition placeholder:text-placeholder focus:ring-2 focus:ring-ring;
|
|
}
|
|
|
|
.sn-popup-actions {
|
|
@apply flex flex-wrap items-end justify-end gap-2;
|
|
}
|
|
|
|
.sn-popup-primary-button {
|
|
@apply h-10 px-5 !text-[1.05rem];
|
|
}
|
|
|
|
.sn-popup-secondary-button {
|
|
@apply h-10 rounded-md border border-input bg-background px-5 text-[1.05rem] text-foreground hover:bg-accent;
|
|
}
|
|
|
|
.sn-popup-secondary-button-sm {
|
|
@apply h-9 rounded-md border border-input bg-background px-4 text-[1.05rem] text-foreground hover:bg-accent;
|
|
}
|
|
|
|
.sn-popup-danger-button-sm {
|
|
@apply h-9 rounded-md border border-destructive bg-background px-4 text-[1.05rem] text-destructive;
|
|
}
|
|
|
|
.sn-popup-danger-button-sm:hover {
|
|
background-color: color-mix(in srgb, var(--destructive) 10%, var(--background));
|
|
}
|
|
|
|
.sn-popup-primary-button-sm {
|
|
@apply h-[32px] min-w-[56px] rounded-sm bg-primary px-0 py-2 text-sm font-medium text-primary-foreground hover:opacity-90;
|
|
}
|
|
|
|
.sn-popup-status-bar {
|
|
@apply border-b border-border bg-secondary px-5 py-2 text-[1rem] text-label;
|
|
}
|
|
|
|
.sn-popup-success-bar {
|
|
@apply border-b border-border bg-secondary px-5 py-2 text-[1rem] text-foreground;
|
|
}
|
|
|
|
.sn-popup-card {
|
|
@apply overflow-hidden rounded-[10px] border border-border bg-background;
|
|
}
|
|
|
|
.sn-popup-panel-title {
|
|
@apply text-[1.05rem] font-medium tracking-[-0.01em] text-label;
|
|
}
|
|
|
|
.sn-popup-grid-table {
|
|
@apply w-full border-collapse text-[1.05rem];
|
|
}
|
|
|
|
.sn-popup-grid-head-row {
|
|
@apply bg-secondary text-title;
|
|
}
|
|
|
|
.sn-popup-grid-head-row-strong {
|
|
@apply bg-muted text-foreground;
|
|
}
|
|
|
|
.sn-popup-grid-head-cell {
|
|
@apply border border-border px-2 py-2;
|
|
}
|
|
|
|
.sn-popup-grid-head-cell-sub {
|
|
@apply border border-border px-2 py-1;
|
|
}
|
|
|
|
.sn-popup-grid-cell {
|
|
@apply border border-border px-2 py-2 text-foreground;
|
|
}
|
|
|
|
.sn-popup-grid-row {
|
|
@apply bg-background;
|
|
}
|
|
|
|
.sn-popup-grid-row-hover {
|
|
}
|
|
|
|
.sn-popup-grid-row-hover:hover {
|
|
background-color: color-mix(in srgb, var(--secondary) 60%, var(--background));
|
|
}
|
|
|
|
.sn-popup-grid-row-selected {
|
|
@apply bg-primary-transparent;
|
|
}
|
|
|
|
.sn-popup-empty-cell {
|
|
@apply text-label;
|
|
}
|
|
|
|
.sn-popup-badge {
|
|
@apply inline-flex items-center justify-center px-2 py-1 text-[12px] font-semibold;
|
|
}
|
|
|
|
.sn-popup-badge-danger {
|
|
@apply bg-destructive text-destructive-foreground;
|
|
}
|
|
|
|
.sn-popup-badge-normal {
|
|
@apply border border-border bg-background text-foreground;
|
|
}
|
|
|
|
.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에서만 숨긴다. */
|
|
[data-sidebar="menu"] > *:nth-child(2) [data-sidebar="menu-sub"] > li:nth-child(2) {
|
|
display: none;
|
|
}
|
|
[data-sidebar="menu"] > *:nth-child(2) [data-sidebar="menu-sub"] > li:nth-child(4) {
|
|
display: none;
|
|
}
|