CreatorLMS Editor

파일 목록

css

css/app.js css/app.js css/style.css css/style.css

page

page/account

계정 수동 생성 ❓ page/account/account_create.html 무료 계정 ❓ page/account/free_account_list.html 무료 계정 > 상세 정보 (탭형) ❓ page/account/free_account_view_tab.html 유료 계정 ❓ page/account/paid_account_list.html 유료 계정 상세 정보 ❓ page/account/paid_account_view.html 유료 계정 > 상세 정보 (탭형) ❓ page/account/paid_account_view_tab.html

page/main

대시보드 ❓ page/main/main.html

page/ops

관리자 추가 ❓ page/ops/admin_form.html 관리자 리스트 ❓ page/ops/admin_list.html 관리자 수정 ❓ page/ops/admin_modify.html API 로그 ❓ page/ops/api_log.html 메일발송 로그 ❓ page/ops/mail_log.html SMS 발송 로그 ❓ page/ops/sms_log.html

page/payment

page/payment/customer_pay_log.html page/payment/customer_pay_log.html page/payment/customer_refund_list.html page/payment/customer_refund_list.html 도메인 SSL 연장 로그 ❓ page/payment/domain_log.html 결제 리스트 ❓ page/payment/pay_log.html 포인트 사용 로그 ❓ page/payment/point_log.html 환불 등록 ❓ page/payment/refund_form.html 환불 리스트 ❓ page/payment/refund_list.html 세금/현금영수증 ❓ page/payment/tax_doc.html page/payment/user_pay_log.html page/payment/user_pay_log.html page/payment/user_refund_log.html page/payment/user_refund_log.html

page/product

상품 등록 ❓ page/product/product_form.html 상품 리스트 ❓ page/product/product_list.html 상품 상세 ❓ page/product/product_view.html

page/settle

계정 정산 리스트 ❓ page/settle/month_list.html page/settle/settle_log.html page/settle/settle_log.html

page/sidebar_menu.html

page/sidebar_menu.html page/sidebar_menu.html

page/site

FAQ 등록 ❓ page/site/faq_form.html FAQ ❓ page/site/faq_list.html 공지사항 등록 ❓ page/site/notice_form.html 공지사항 ❓ page/site/notice_list.html 공지사항 상세 ❓ page/site/notice_view.html 페이지 추가 ❓ page/site/page_form.html 페이지 관리 ❓ page/site/page_list.html 페이지 수정 ❓ page/site/page_modify.html 팝업창 수정 ❓ page/site/popup_form.html 팝업창 ❓ page/site/popup_list.html page/site/popup_modify.html page/site/popup_modify.html 1:1 문의 상세 ❓ page/site/qna_form.html 1:1 문의 ❓ page/site/qna_list.html SEO 관리 ❓ page/site/seo.html

page/stats

page/stats/account.html page/stats/account.html page/stats/sales.html page/stats/sales.html page/stats/visit.html page/stats/visit.html

편집

css/style.css

/* Minimal tweaks on top of Bootstrap 5 */
:root{
  --sidebar-w: 260px;
}

body{ background:#f6f7fb; }

.app-shell{ min-height:100vh; }

.sidebar{
  width:var(--sidebar-w);
  position:fixed;
  top:0; left:0;
  height:100vh;
  overflow-y:auto;
  background:#111827;
}

.sidebar .brand{
  height:56px;
  display:flex;
  align-items:center;
  padding:0 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.sidebar .brand a{
  color:#fff;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.2px;
}

/* ===== Sidebar nav ===== */
.sidebar .nav-section{
  padding:10px 10px; /* tighter */
}

/* (구버전 호환) 섹션 라벨 */
.sidebar .nav-label{
  color:rgba(255,255,255,.75);
  font-size:.95rem;
  font-weight:700;
  margin:8px 10px 6px;
  padding:10px 6px 6px;
  border-top:1px solid rgba(255,255,255,.10);
  text-transform:none;
  letter-spacing:0;
}

/* (신버전) details/summary 기반 섹션 */
.nav-group{
  border-top:1px solid rgba(255,255,255,.10);
  padding-top:8px;
  margin-top:8px;
}
.nav-group:first-child{
  border-top:none;
  padding-top:0;
  margin-top:0;
}

.nav-title{
  list-style:none;
  cursor:pointer;
  user-select:none;
  color:rgba(255,255,255,.80);
  font-size:.95rem;
  font-weight:700;
  padding:6px 6px;
  margin:0 4px 4px;
}
.nav-title::-webkit-details-marker{ display:none; }
.nav-title::marker{ content:""; }

.nav-title:after{
  content:"›";
  float:right;
  opacity:.55;
  transform:rotate(90deg);
  transition:transform .12s ease;
}
.nav-group:not([open]) .nav-title:after{
  transform:rotate(0deg);
}

.nav-items{ padding:0 4px 2px; }

.sidebar .nav-link{
  color:rgba(255,255,255,.78);
  border-radius:.5rem;
  padding:.30rem .75rem;  /* 50% tighter */
  display:flex;
  gap:.6rem;
  align-items:center;
}

.sidebar .nav-link:hover{
  color:#fff;
  background:rgba(255,255,255,.08);
}

.sidebar .nav-link.active{
  color:#fff;
  background:rgba(59,130,246,.22);
  border:1px solid rgba(59,130,246,.35);
}

.main{
  margin-left:var(--sidebar-w);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.topbar{
  height:56px;
  position:sticky;
  top:0;
  z-index:1020;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.08);
}

.content{
  padding:20px 20px 40px;
  flex:1;
}

.card-kpi .kpi-title{ color:#6b7280; font-size:.85rem; }
.card-kpi .kpi-value{ font-size:1.6rem; font-weight:700; }
.card-kpi .kpi-meta{ color:#6b7280; font-size:.85rem; }

.section-title{
  font-weight:700;
  letter-spacing:.2px;
}

.help-text{
  color:#6b7280;
  font-size:.9rem;
}

.table thead th{
  color:#6b7280;
  font-weight:600;
  font-size:.85rem;
}

.form-label{ color:#374151; font-weight:600; }
.form-control, .form-select{ border-radius:.6rem; }
.btn{ border-radius:.6rem; }

.badge-soft{
  background:rgba(59,130,246,.12);
  color:#1d4ed8;
  border:1px solid rgba(59,130,246,.25);
}

@media (max-width: 991.98px){
  :root{ --sidebar-w: 0px; }
  .sidebar{ display:none; }
  .main{ margin-left:0; }
}

.brand-badge{
  font-size:1.1rem;
  font-weight:700;
  padding:6px 12px;
  border-radius:999px;
  background:#f1f3f5;
  border:1px solid #dee2e6;
  letter-spacing:.5px;
}

.brand-btn{
  font-size:1.15rem;
  font-weight:700;
  padding:6px 14px;
  border-radius:8px;
  border:1px solid #ced4da;
  background:#fff;
  cursor:default;
}
.brand-btn:hover{ background:#f8f9fa; }

.dash-badge{
  font-size:20px !important;
}

/* === filter inline (single row) === */
.filter-inline{
  display:flex;
  flex-wrap:nowrap;          /* 여러 줄 금지 */
  gap:12px;
  overflow-x:auto;           /* 한 줄 유지 + 가로 스크롤 */
  padding-bottom:6px;
}
.filter-cell{
  flex:0 0 auto;             /* 줄바꿈 방지 */
  min-width:360px;           /* 각 필터 최소 폭 */
}
.filter-cell .filter-line{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.filter-cell .filter-label{
  width:110px;               /* 라벨 고정폭 */
  padding-top:6px;
  font-weight:600;
  color:#374151;
  white-space:nowrap;
}
.filter-cell .filter-input{
  flex:1;
  min-width:0;
}
.chk-row{
  flex-wrap:nowrap;          /* 체크박스도 줄바꿈 금지 */
  overflow-x:auto;
  white-space:nowrap;
}

.filter-actions{
  display:flex;
  justify-content:center;    /* 하단 중앙 */
  margin-top:12px;
}
.filter-actions .btn{
  min-width:160px;
  font-weight:700;
}

.brand-title { font-size: 26px; }  /* 서비스 타이틀 */

간단 소스 편집기