220 lines
3.9 KiB
CSS
220 lines
3.9 KiB
CSS
/* ==================================================
|
|
adm_style.clean.css
|
|
외부용 관리자 페이지 덮어쓰기 전용
|
|
기존 adm_style.css 수정 금지
|
|
================================================== */
|
|
|
|
/* ---------- 기본 톤 ---------- */
|
|
body {
|
|
background: #f8fafc;
|
|
color: #111827;
|
|
}
|
|
|
|
/* ---------- 카드 공통 ---------- */
|
|
.card {
|
|
border-radius: 14px;
|
|
border-color: #e5e7eb;
|
|
background: #ffffff;
|
|
}
|
|
|
|
/* ---------- 관리자 요약 영역 ---------- */
|
|
.adm-summary {
|
|
border: 1px solid #e5e7eb !important;
|
|
border-radius: 14px;
|
|
background: #ffffff;
|
|
box-shadow: 0 1px 2px rgba(0,0,0,0.04);
|
|
}
|
|
|
|
.adm-summary .adm-row {
|
|
padding: 10px 16px;
|
|
border-bottom: 1px solid #e5e7eb;
|
|
}
|
|
|
|
.adm-summary .adm-row:last-child {
|
|
border-bottom: none;
|
|
}
|
|
|
|
.adm-summary .label {
|
|
color: #6b7280;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.adm-summary .value.bold {
|
|
color: #111827;
|
|
font-weight: 700;
|
|
}
|
|
|
|
/* ---------- 사용량 바 ---------- */
|
|
.usage-box {
|
|
width: 520px;
|
|
}
|
|
|
|
.usage-text {
|
|
font-size: 12px;
|
|
color: #6b7280;
|
|
}
|
|
|
|
.usage-bar {
|
|
height: 10px;
|
|
border-radius: 999px;
|
|
background: #e5e7eb;
|
|
overflow: hidden;
|
|
margin-top: 6px;
|
|
}
|
|
|
|
.usage-used {
|
|
background: #2563eb !important;
|
|
height: 100%;
|
|
}
|
|
|
|
.usage-remain {
|
|
display: none;
|
|
}
|
|
|
|
/* ---------- 검색 영역 ---------- */
|
|
.adm-search {
|
|
background: #ffffff;
|
|
border: 1px solid #e5e7eb;
|
|
border-radius: 12px;
|
|
padding: 10px 14px;
|
|
}
|
|
|
|
.adm-search input,
|
|
.adm-search select {
|
|
height: 36px;
|
|
border-radius: 8px;
|
|
border: 1px solid #e5e7eb;
|
|
}
|
|
|
|
/* ---------- 상단 타이틀 ---------- */
|
|
.adm-title {
|
|
font-size: 22px;
|
|
font-weight: 700;
|
|
margin: 20px 0;
|
|
}
|
|
|
|
/* ---------- 상단 보조 버튼 ---------- */
|
|
.adm-title-actions button {
|
|
background: #f3f4f6;
|
|
border: 1px solid #e5e7eb;
|
|
color: #374151;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
.adm-title-actions button:hover {
|
|
background: #e5e7eb;
|
|
}
|
|
|
|
/* ---------- 저장 버튼 ---------- */
|
|
#btnSave_comp {
|
|
background: #2563eb !important;
|
|
border-color: #2563eb !important;
|
|
color: #ffffff !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
#btnSave_comp:hover {
|
|
background: #1d4ed8 !important;
|
|
}
|
|
|
|
/* ---------- 삭제 버튼 ---------- */
|
|
#btnDelete {
|
|
background: transparent !important;
|
|
color: #dc2626 !important;
|
|
border-color: #dc2626 !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
#btnDelete:hover {
|
|
background: #fee2e2 !important;
|
|
}
|
|
|
|
/* ---------- 추가 버튼 ---------- */
|
|
#btnAdd {
|
|
background: transparent !important;
|
|
color: #16a34a !important;
|
|
border-color: #16a34a !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
#btnAdd:hover {
|
|
background: #ecfdf5 !important;
|
|
}
|
|
|
|
/* ---------- 일괄 생성 버튼 ---------- */
|
|
#btnBulkCreate {
|
|
background: #f3f4f6 !important;
|
|
color: #374151 !important;
|
|
border-color: #e5e7eb !important;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
/* ---------- Grid 카드 ---------- */
|
|
.grid-card {
|
|
border-radius: 14px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
/* ---------- w2ui Grid 외부용 ---------- */
|
|
.w2ui-grid {
|
|
border-radius: 14px;
|
|
overflow: hidden;
|
|
border: 1px solid #e5e7eb;
|
|
}
|
|
|
|
.w2ui-grid-header {
|
|
background: #f9fafb !important;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.w2ui-grid-records tr {
|
|
height: 44px;
|
|
}
|
|
|
|
/* ---------- 홈 버튼 ---------- */
|
|
.btn-home-fixed {
|
|
background: #111827;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.btn-home-fixed:hover {
|
|
background: #000000;
|
|
}
|
|
|
|
/* ===============================
|
|
외부 사용자용 레이아웃 폭 제한
|
|
=============================== */
|
|
|
|
/* 페이지 전체 폭 컨테이너 효과 */
|
|
body {
|
|
background: #f8fafc; /* 살짝 밝은 배경 */
|
|
}
|
|
|
|
/* 관리자 페이지 실 컨텐츠 폭 제한 */
|
|
.adm-title,
|
|
.adm-summary,
|
|
.adm-search,
|
|
.card {
|
|
max-width: 1400px; /* ← 여기만 조절 */
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
/* 카드 간 간격 통일 */
|
|
.card {
|
|
border-radius: 12px;
|
|
}
|
|
|
|
/* 검색 영역도 카드 느낌 */
|
|
.adm-search {
|
|
background: #fff;
|
|
padding: 12px 16px;
|
|
border-radius: 12px;
|
|
border: 1px solid #e5e7eb;
|
|
}
|
|
|
|
/* 버튼 그룹 정리 */
|
|
.adm-search button {
|
|
white-space: nowrap;
|
|
}
|