jekkinoopy/sechskies
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 統一後台品牌視覺

Browse Source
This commit is contained in:
jekkinoopy
2026-08-02 23:03:18 +08:00
parent 8b8a0bb6f7
commit 44c9cc6fe2
7 changed files with 47 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/assets/admin.css
+8 -4
View File
@@ -23,8 +23,8 @@ button, input, select, textarea { font: inherit; }
button, .button { min-height: 42px; } button, .button { min-height: 42px; }
.admin-topbar { position: sticky; z-index: 20; top: 0; min-height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; color: var(--color-text-inverse); background: var(--color-bg); border-bottom: 1px solid rgba(255, 204, 0, .3); } .admin-topbar { position: sticky; z-index: 20; top: 0; min-height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; color: var(--color-text-inverse); background: var(--color-bg); border-bottom: 1px solid rgba(255, 204, 0, .3); }
.admin-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 900; letter-spacing: .06em; } .admin-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.admin-brand i { color: var(--color-brand); } .admin-brand__logo { display: block; width: clamp(190px, 20vw, 250px); max-height: 46px; height: auto; object-fit: contain; }
.admin-brand small { padding-left: 10px; color: var(--color-brand-light); border-left: 1px solid rgba(255, 255, 255, .25); font-weight: 500; } .admin-brand small { padding-left: 10px; color: var(--color-brand-light); border-left: 1px solid rgba(255, 255, 255, .25); font-weight: 500; }
.admin-topbar__actions { display: flex; align-items: center; gap: 18px; font-size: .9rem; } .admin-topbar__actions { display: flex; align-items: center; gap: 18px; font-size: .9rem; }
.admin-topbar__actions a { color: var(--color-brand-light); text-decoration: none; } .admin-topbar__actions a { color: var(--color-brand-light); text-decoration: none; }
@@ -109,11 +109,14 @@ tbody tr:hover { background: rgba(255, 204, 0, .06); }
.inline-form label { display: flex; flex-direction: column; gap: 6px; color: var(--color-text-muted); font-size: .82rem; font-weight: 700; } .inline-form label { display: flex; flex-direction: column; gap: 6px; color: var(--color-text-muted); font-size: .82rem; font-weight: 700; }
.auth-page { display: grid; place-items: center; padding: 24px; color: var(--color-text-inverse); background: var(--color-bg); background-image: radial-gradient(circle at 20% 10%, rgba(255, 204, 0, .16), transparent 32%), radial-gradient(circle at 80% 90%, rgba(252, 238, 167, .1), transparent 34%); } .auth-page { display: grid; place-items: center; padding: 24px; color: var(--color-text-inverse); background: var(--color-bg); background-image: radial-gradient(circle at 20% 10%, rgba(255, 204, 0, .16), transparent 32%), radial-gradient(circle at 80% 90%, rgba(252, 238, 167, .1), transparent 34%); }
.auth-card { width: min(460px, 100%); padding: clamp(28px, 6vw, 48px); border: 1px solid rgba(255, 204, 0, .35); border-radius: 20px; background: var(--color-bg-raised); box-shadow: 0 26px 80px rgba(0, 0, 0, .45); } .auth-card { position: relative; width: min(500px, 100%); padding: clamp(28px, 6vw, 48px); overflow: hidden; border: 1px solid rgba(255, 204, 0, .35); border-radius: 20px; background: var(--color-bg-raised); box-shadow: 0 26px 80px rgba(0, 0, 0, .45); }
.auth-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, transparent, var(--color-brand), transparent); }
.auth-brand { display: flex; flex-direction: column; align-items: center; gap: 9px; width: 100%; margin: 0 auto 24px; color: var(--color-brand-light); text-decoration: none; }
.auth-brand img { display: block; width: min(340px, 92%); height: auto; object-fit: contain; }
.auth-brand span { font-size: .68rem; font-weight: 800; letter-spacing: .2em; text-align: center; }
.auth-card h1 { margin: 7px 0 10px; color: var(--color-text-inverse); text-align: center; } .auth-card h1 { margin: 7px 0 10px; color: var(--color-text-inverse); text-align: center; }
.auth-card > p { color: var(--color-brand-light); text-align: center; } .auth-card > p { color: var(--color-brand-light); text-align: center; }
.auth-card .eyebrow { color: var(--color-brand); } .auth-card .eyebrow { color: var(--color-brand); }
.auth-gem { color: var(--color-brand); font-size: 2.5rem; text-align: center; }
.auth-card form { display: flex; flex-direction: column; gap: 17px; margin-top: 28px; } .auth-card form { display: flex; flex-direction: column; gap: 17px; margin-top: 28px; }
.auth-card label { display: flex; flex-direction: column; gap: 7px; color: var(--color-text-inverse); font-size: .9rem; } .auth-card label { display: flex; flex-direction: column; gap: 7px; color: var(--color-text-inverse); font-size: .9rem; }
.auth-card input { color: var(--color-text-inverse); background: var(--color-bg); border-color: rgba(255, 204, 0, .36); } .auth-card input { color: var(--color-text-inverse); background: var(--color-bg); border-color: rgba(255, 204, 0, .36); }
@@ -128,6 +131,7 @@ tbody tr:hover { background: rgba(255, 204, 0, .06); }
@media (max-width: 760px) { @media (max-width: 760px) {
.admin-topbar { padding-inline: 16px; } .admin-topbar { padding-inline: 16px; }
.admin-brand small, .admin-topbar__actions span { display: none; } .admin-brand small, .admin-topbar__actions span { display: none; }
.admin-brand__logo { width: min(190px, 48vw); }
.admin-shell { display: block; } .admin-shell { display: block; }
.admin-sidebar { position: fixed; z-index: 30; inset: 68px auto 0 0; width: min(290px, 86vw); transform: translateX(-105%); transition: transform .2s ease; overflow-y: auto; } .admin-sidebar { position: fixed; z-index: 30; inset: 68px auto 0 0; width: min(290px, 86vw); transform: translateX(-105%); transition: transform .2s ease; overflow-y: auto; }
.admin-sidebar.is-open { transform: translateX(0); } .admin-sidebar.is-open { transform: translateX(0); }
admin/bootstrap.php
+4 -1
View File
@@ -206,7 +206,10 @@ function render_header(string $title, string $active = ''): void
</head> </head>
<body> <body>
<header class="admin-topbar"> <header class="admin-topbar">
<a class="admin-brand" href="index.php"><i class="bi bi-gem"></i><span>水晶男孩推廣部</span><small>Admin</small></a> <a class="admin-brand" href="index.php" aria-label="水晶男孩推廣部後台首頁">
<img class="admin-brand__logo" src="../assets/images/logov.svg" alt="SECHSKIES 水晶男孩推廣部">
<small>Admin</small>
</a>
<div class="admin-topbar__actions"><span><?= h($_SESSION['admin_name'] ?? '') ?></span><a href="../index.html" target="_blank" rel="noopener">查看前臺</a><a href="logout.php">登出</a></div> <div class="admin-topbar__actions"><span><?= h($_SESSION['admin_name'] ?? '') ?></span><a href="../index.html" target="_blank" rel="noopener">查看前臺</a><a href="logout.php">登出</a></div>
</header> </header>
<div class="admin-shell"> <div class="admin-shell">
admin/login.php
+1 -1
View File
@@ -24,5 +24,5 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
} }
?> ?>
<!doctype html><html lang="zh-Hant"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>管理登入｜水晶男孩推廣部</title><link rel="stylesheet" href="assets/admin.css"></head> <!doctype html><html lang="zh-Hant"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>管理登入｜水晶男孩推廣部</title><link rel="stylesheet" href="assets/admin.css"></head>
<body class="auth-page"><main class="auth-card"><div class="auth-gem">◆</div><p class="eyebrow">SECHSKIES ARCHIVE</p><h1>推廣部管理登入</h1><p>把散落的記憶，好好收進同一片黃色海洋。</p><?php if (isset($_GET['setup'])): ?><div class="notice notice--success">管理者建立完成，請登入。</div><?php endif; ?><?php if ($error): ?><div class="notice notice--error"><?= h($error) ?></div><?php endif; ?> <body class="auth-page"><main class="auth-card"><a class="auth-brand" href="../index.html" aria-label="返回水晶男孩推廣部前台"><img src="../assets/images/logov.svg" alt="SECHSKIES 水晶男孩推廣部"><span>CONTENT MANAGEMENT SYSTEM</span></a><p class="eyebrow">SECHSKIES ARCHIVE</p><h1>推廣部管理登入</h1><p>把散落的記憶，好好收進同一片黃色海洋。</p><?php if (isset($_GET['setup'])): ?><div class="notice notice--success">管理者建立完成，請登入。</div><?php endif; ?><?php if ($error): ?><div class="notice notice--error"><?= h($error) ?></div><?php endif; ?>
<form method="post"><input type="hidden" name="csrf" value="<?= h(csrf_token()) ?>"><label>管理者帳號<input name="username" required autocomplete="username" autofocus></label><label>密碼<input name="password" type="password" required autocomplete="current-password"></label><button class="button button--primary" type="submit">登入後臺</button><a class="text-link" href="setup.php">第一次使用？初始化系統</a></form></main></body></html> <form method="post"><input type="hidden" name="csrf" value="<?= h(csrf_token()) ?>"><label>管理者帳號<input name="username" required autocomplete="username" autofocus></label><label>密碼<input name="password" type="password" required autocomplete="current-password"></label><button class="button button--primary" type="submit">登入後臺</button><a class="text-link" href="setup.php">第一次使用？初始化系統</a></form></main></body></html>
admin/setup.php
+1 -1
View File
@@ -32,5 +32,5 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST' && $error === '') {
} }
?> ?>
<!doctype html><html lang="zh-Hant"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>初始化後臺</title><link rel="stylesheet" href="assets/admin.css"></head> <!doctype html><html lang="zh-Hant"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>初始化後臺</title><link rel="stylesheet" href="assets/admin.css"></head>
<body class="auth-page"><main class="auth-card"><p class="eyebrow">FIRST-TIME SETUP</p><h1>建立第一位管理者</h1><p>水晶男孩推廣部內容管理系統</p><?php if ($error): ?><div class="notice notice--error"><?= h($error) ?></div><?php endif; ?> <body class="auth-page"><main class="auth-card"><a class="auth-brand" href="../index.html" aria-label="返回水晶男孩推廣部前台"><img src="../assets/images/logov.svg" alt="SECHSKIES 水晶男孩推廣部"><span>CONTENT MANAGEMENT SYSTEM</span></a><p class="eyebrow">FIRST-TIME SETUP</p><h1>建立第一位管理者</h1><p>水晶男孩推廣部內容管理系統</p><?php if ($error): ?><div class="notice notice--error"><?= h($error) ?></div><?php endif; ?>
<form method="post"><input type="hidden" name="csrf" value="<?= h(csrf_token()) ?>"><label>登入帳號<input name="username" required autocomplete="username"></label><label>顯示名稱<input name="display_name" required></label><label>電子信箱<input name="email" type="email"></label><label>登入密碼<input name="password" type="password" required minlength="10" autocomplete="new-password"></label><button class="button button--primary" type="submit">建立管理者</button></form></main></body></html> <form method="post"><input type="hidden" name="csrf" value="<?= h(csrf_token()) ?>"><label>登入帳號<input name="username" required autocomplete="username"></label><label>顯示名稱<input name="display_name" required></label><label>電子信箱<input name="email" type="email"></label><label>登入密碼<input name="password" type="password" required minlength="10" autocomplete="new-password"></label><button class="button button--primary" type="submit">建立管理者</button></form></main></body></html>
assets/images/concert/captain-aura/hero-placeholder.svg
+3 -3
View File
@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" width="1920" height="1003" viewBox="0 0 1920 1003" role="img" aria-label="kEG…ÿÛ sli01.png "> <svg xmlns="http://www.w3.org/2000/svg" width="1920" height="1003" viewBox="0 0 1920 1003" role="img" aria-label="kEG��� sli01.png ">
<defs> <defs>
<linearGradient id="g" x1="0%" y1="0%" x2="100%" y2="100%"> <linearGradient id="g" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#1a1a1a"/> <stop offset="0%" stop-color="#1a1a1a"/>
@@ -8,6 +8,6 @@
</defs> </defs>
<rect width="1920" height="1003" fill="url(#g)"/> <rect width="1920" height="1003" fill="url(#g)"/>
<rect x="80" y="80" width="1760" height="843" fill="none" stroke="#ffcc00" stroke-width="4" stroke-dasharray="16 12" opacity="0.45"/> <rect x="80" y="80" width="1760" height="843" fill="none" stroke="#ffcc00" stroke-width="4" stroke-dasharray="16 12" opacity="0.45"/>
<text x="960" y="470" text-anchor="middle" fill="#ffcc00" font-family="sans-serif" font-size="42" font-weight="700">G1 private · 1theland in Taipei</text> <text x="960" y="470" text-anchor="middle" fill="#ffcc00" font-family="sans-serif" font-size="42" font-weight="700">G1 private � 1theland in Taipei</text>
<text x="960" y="540" text-anchor="middle" fill="#f4f4f4" font-family="sans-serif" font-size="28" opacity="0.85">kEG · ËÿÛ hero.jpgŸ sli01.png </text> <text x="960" y="540" text-anchor="middle" fill="#f4f4f4" font-family="sans-serif" font-size="28" opacity="0.85">kEG � ��� hero.jpg� sli01.png </text>
</svg> </svg>
extra/site-guide.html
+22
View File
@@ -208,6 +208,28 @@
</div> </div>
</section> </section>
<section class="site-guide-group site-guide-group--nav-hero" aria-labelledby="sg-git-notes">
<h2 class="section-title" id="sg-git-notes">Git 同步備忘</h2>
<div class="site-guide-nav-table-wrap">
<table class="site-guide-mini-table" aria-describedby="sg-git-notes">
<tbody>
<tr>
<th scope="row">2026-07-30 分岔</th>
<td>本機原有 4 個未 push commit（<code>variety/vedio-list.html</code> 深夜清單、<code>concert/captain-aura.html</code>、<code>yellow-note/practice-room.html</code> 等），同時遠端 origin/main 多了 1 個新 commit（<code>calendar2026.html</code> 2026 行事曆頁＋<code>admin/</code> 後台系統，改動 <code>assets/js/map.js</code>、<code>member/member.html</code>）</td>
</tr>
<tr>
<th scope="row">衝突檔案</th>
<td><code>AGENTS.md</code>（工作狀態記錄不同）、<code>.vscode/settings.json</code>（liveServer port 5501 vs 5503）；已採「AGENTS.md 用遠端較新版本」「port 改 5503」解決並完成合併 commit</td>
</tr>
<tr>
<th scope="row">目前狀態</th>
<td>本機領先 origin/main 5 個 commit（遠端 1 個＋本機原本 4 個＋合併 1 個），<strong>尚未 push 回 GitHub</strong>；<code>variety/NJTW/NJTW5.html</code> 另有 8 行未 commit 的修改，維持原樣待處理</td>
</tr>
</tbody>
</table>
</div>
</section>
</main> </main>
<footer> <footer>
variety/NJTW/NJTW5.html
+8
View File
@@ -432,6 +432,14 @@
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div> </div>
</div> </div>
<div class="video-container">
<h2 class="video-title">S5 EP01・180930（神叨字幕組）</h2>
<div class="video-wrapper">
<iframe class="video-embed" title="新西遊記5 EP01 神叨字幕組"
src="//player.bilibili.com/player.html?isOutside=true&bvid=BV12t411U7Ni&p=1" scrolling="no"
border="0" frameborder="no" framespacing="0" allowfullscreen="true"></iframe>
</div>
</div>
</body> </body>
</html> </html>