hehihoho3/h-lab
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: dedupe to shared components (publish badge, filter selects, gap token)

Browse Source 
- publish.html: status column uses shared .badge (badge-muted/warning/
  success) instead of its own .st-badge inline-color span
- collection.html / discover.html: drop .filter-sel rules now that the
  shared `select` styling covers them (row-sel kept for compact inline)
- style.css: .gap-2 uses var(--space-2) for token consistency

No behavior change; follow-up cleanup from the design-uplift review.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
hehihoho3@gmail.com 2026-05-31 10:45:15 +09:00
parent 152dc0bae4
commit 9828918b97
4 changed files with 4 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/main/resources/static/css/style.css
View File

@ -36,7 +36,7 @@ ul {
}
.gap-2 {
gap: 0.5rem;
gap: var(--space-2);
}
.gap-4 {

2
src/main/resources/templates/collection.html
View File

@ -128,8 +128,6 @@
</div>
<style>
.filter-sel { padding:8px; height:42px; background:rgba(255,255,255,0.05); border:1px solid var(--glass-border); border-radius:var(--radius-md); color:white; outline:none; }
.filter-sel option { background:#1e1e2d; color:white; }
.hidden { display:none !important; }
.row-sel { padding:4px 6px; background:rgba(255,255,255,0.05); border:1px solid var(--glass-border); border-radius:6px; color:white; font-size:0.8rem; outline:none; }
.row-sel option { background:#1e1e2d; color:white; }

2
src/main/resources/templates/discover.html
View File

@ -99,8 +99,6 @@
</div>
<style>
.filter-sel { padding:8px; height:42px; background:rgba(255,255,255,0.05); border:1px solid var(--glass-border); border-radius:var(--radius-md); color:white; outline:none; }
.filter-sel option { background:#1e1e2d; color:white; }
.row-sel { padding:4px 6px; background:rgba(255,255,255,0.05); border:1px solid var(--glass-border); border-radius:6px; color:white; font-size:0.8rem; outline:none; }
.row-sel option { background:#1e1e2d; color:white; }
</style>

7
src/main/resources/templates/publish.html
View File

@ -41,13 +41,12 @@
<style>
.tab.active { border-color:#7C3AED; color:#fff; }
.st-badge { font-size:0.7rem; padding:2px 8px; border-radius:999px; font-weight:bold; }
</style>
<script th:inline="javascript">
/*<![CDATA[*/
let curStatus = '';
const ST = { DRAFT:{t:'작성중',c:'#64748b'}, READY:{t:'발행대기',c:'#f59e0b'}, PUBLISHED:{t:'발행완료',c:'#10b981'} };
const ST = { DRAFT:{t:'작성중',cls:'badge-muted'}, READY:{t:'발행대기',cls:'badge-warning'}, PUBLISHED:{t:'발행완료',cls:'badge-success'} };
function esc(s){ return (s==null?'':String(s)).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;'); }
async function api(url, opts){
@ -73,11 +72,11 @@
document.getElementById('cnt').textContent = data.length + '건';
if(data.length===0){ body.innerHTML = '<tr><td colspan="6" class="p-8 text-center text-muted">발행 패키지가 없습니다. 재가공 화면에서 발행안을 저장하세요.</td></tr>'; return; }
body.innerHTML = data.map(p=>{
const st = ST[p.status] || {t:p.status,c:'#64748b'};
const st = ST[p.status] || {t:p.status,cls:'badge-muted'};
const sched = p.scheduledAt ? String(p.scheduledAt).substring(0,16).replace('T',' ') : '-';
const urlCell = p.publishedUrl ? `<a href="${esc(p.publishedUrl)}" target="_blank" class="hover:underline" style="color:#60a5fa;">열기</a>` : '-';
return `<tr style="border-bottom:1px solid var(--glass-border);">
<td class="p-3"><span class="st-badge" style="background:${st.c}22; color:${st.c};">${st.t}</span></td>
<td class="p-3"><span class="badge ${st.cls}">${st.t}</span></td>
<td class="p-3 text-sm">${esc(p.platform||'')}</td>
<td class="p-3 text-sm" style="max-width:360px;"><div style="display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">${esc(p.title||'(제목 없음)')}</div></td>
<td class="p-3 text-sm text-muted">${sched}</td>