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

fix 綜藝表年份展開欄位錯位

Browse Source
This commit is contained in:
jekkinoopy
2026-05-17 15:13:40 +08:00
parent f4da5bac6d
commit 124c2af1b9
2 changed files with 85 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
extra/site-guide.html
+3 -1
View File
@@ -151,6 +151,7 @@
<td class="site-guide-nav-desc">—</td> <td class="site-guide-nav-desc">—</td>
<td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td> <td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td>
</tr> </tr>
https://zh.wikipedia.org/wiki/%E6%B0%B4%E6%99%B6%E7%94%B7%E5%AD%A9%E5%BD%B1%E8%A6%96%E4%BD%9C%E5%93%81%E5%88%97%E8%A1%A8
<tr data-site-guide-depth="3"> <tr data-site-guide-depth="3">
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a <td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
href="../variety/variety.html#variety">隊長帶弟弟</a></span></td> href="../variety/variety.html#variety">隊長帶弟弟</a></span></td>
@@ -447,7 +448,8 @@
<h2 class="section-title" id="sg-nav-extra">extra/ 其餘</h2> <h2 class="section-title" id="sg-nav-extra">extra/ 其餘</h2>
<p class="site-guide-folder-hint">未列頂欄主模板之草稿／實驗頁。主選單對應頁面已移至 <p class="site-guide-folder-hint">未列頂欄主模板之草稿／實驗頁。主選單對應頁面已移至
<code>fallen/</code>、<code>member/</code>、<code>yellow-note/</code>、<code>variety/</code> 等資料夾；六六歌2 <code>fallen/</code>、<code>member/</code>、<code>yellow-note/</code>、<code>variety/</code> 等資料夾；六六歌2
四入口之複本仍在本目錄。</p> 四入口之複本仍在本目錄。
</p>
<div class="site-guide-nav-table-wrap"> <div class="site-guide-nav-table-wrap">
<table class="site-guide-mini-table"> <table class="site-guide-mini-table">
<thead> <thead>
variety/variety-shows.html
+76 -28
View File
@@ -76,11 +76,32 @@
min-width: 640px; min-width: 640px;
margin: 0; margin: 0;
border-collapse: collapse; border-collapse: collapse;
table-layout: fixed;
font-size: 0.9rem; font-size: 0.9rem;
line-height: 1.5; line-height: 1.5;
background: transparent; background: transparent;
} }
body.variety-shows-page .variety-table__col-air {
width: 22%;
}
body.variety-shows-page .variety-table__col-channel {
width: 10%;
}
body.variety-shows-page .variety-table__col-program {
width: 28%;
}
body.variety-shows-page .variety-table__col-member {
width: 22%;
}
body.variety-shows-page .variety-table__col-eps {
width: 18%;
}
body.variety-shows-page .variety-table thead th { body.variety-shows-page .variety-table thead th {
padding: 12px 10px; padding: 12px 10px;
border: none; border: none;
@@ -115,7 +136,7 @@
body.variety-shows-page .variety-table__year-toggle { body.variety-shows-page .variety-table__year-toggle {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: flex-start;
gap: 12px; gap: 12px;
width: 100%; width: 100%;
min-height: 48px; min-height: 48px;
@@ -131,13 +152,16 @@
box-sizing: border-box; box-sizing: border-box;
} }
body.variety-shows-page .variety-table__year-row:not(.is-open)>td:has(.variety-table__year-toggle:hover), body.variety-shows-page .variety-table__year-tail {
body.variety-shows-page .variety-table__year-row:not(.is-open)>td:has(.variety-table__year-toggle:focus-visible) { padding: 12px 16px;
background: #f5f5f5; text-align: right;
vertical-align: middle;
white-space: nowrap;
cursor: pointer;
} }
body.variety-shows-page .variety-table__year-row.is-open .variety-table__year-toggle:hover, body.variety-shows-page .variety-table__year-row:not(.is-open):hover>td,
body.variety-shows-page .variety-table__year-row.is-open .variety-table__year-toggle:focus-visible { body.variety-shows-page .variety-table__year-row.is-open:hover>td {
background: #f5f5f5; background: #f5f5f5;
} }
@@ -152,7 +176,7 @@
} }
body.variety-shows-page .variety-table__year-meta { body.variety-shows-page .variety-table__year-meta {
margin-left: auto; margin-right: 8px;
font-size: 0.85rem; font-size: 0.85rem;
font-weight: 600; font-weight: 600;
color: #777; color: #777;
@@ -168,11 +192,15 @@
transform: rotate(180deg); transform: rotate(180deg);
} }
body.variety-shows-page .variety-table__show-row {
display: table-row;
}
body.variety-shows-page .variety-table__show-row[hidden] { body.variety-shows-page .variety-table__show-row[hidden] {
display: none; display: none;
} }
body.variety-shows-page .variety-table__year-list>tr.variety-table__show-row:nth-child(even) td { body.variety-shows-page .variety-table__show-row:nth-child(even of .variety-table__show-row) td {
background: #fcfcfc; background: #fcfcfc;
} }
@@ -282,16 +310,24 @@
<th scope="col">集數</th> <th scope="col">集數</th>
</tr> </tr>
</thead> </thead>
<colgroup>
<col class="variety-table__col-air">
<col class="variety-table__col-channel">
<col class="variety-table__col-program">
<col class="variety-table__col-member">
<col class="variety-table__col-eps">
</colgroup>
<tbody class="variety-table__year-list"> <tbody class="variety-table__year-list">
<tr class="variety-table__year-row" data-year="2016"> <tr class="variety-table__year-row" data-year="2016">
<td colspan="5"> <td colspan="4" class="variety-table__year-head">
<button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2016-btn"> <button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2016-btn">
<span class="variety-table__year-label">2016</span> <span class="variety-table__year-label">2016</span>
<span class="variety-table__year-meta">6 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron"
aria-hidden="true"></i>
</button> </button>
</td> </td>
<td class="variety-table__year-tail">
<span class="variety-table__year-meta">6 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron" aria-hidden="true"></i>
</td>
</tr> </tr>
<tr class="variety-table__show-row" data-year="2016" hidden> <tr class="variety-table__show-row" data-year="2016" hidden>
<td class="variety-table__air-date" data-air-start="2016-04-22" <td class="variety-table__air-date" data-air-start="2016-04-22"
@@ -378,14 +414,15 @@
aria-hidden="true"></i>&nbsp;02</td> aria-hidden="true"></i>&nbsp;02</td>
</tr> </tr>
<tr class="variety-table__year-row" data-year="2017"> <tr class="variety-table__year-row" data-year="2017">
<td colspan="5"> <td colspan="4" class="variety-table__year-head">
<button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2017-btn"> <button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2017-btn">
<span class="variety-table__year-label">2017</span> <span class="variety-table__year-label">2017</span>
<span class="variety-table__year-meta">4 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron"
aria-hidden="true"></i>
</button> </button>
</td> </td>
<td class="variety-table__year-tail">
<span class="variety-table__year-meta">4 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron" aria-hidden="true"></i>
</td>
</tr> </tr>
<tr class="variety-table__show-row" data-year="2017" hidden> <tr class="variety-table__show-row" data-year="2017" hidden>
<td class="variety-table__air-date" data-air-start="2017-01-01" <td class="variety-table__air-date" data-air-start="2017-01-01"
@@ -444,14 +481,15 @@
aria-hidden="true"></i>&nbsp;05＋導演版</td> aria-hidden="true"></i>&nbsp;05＋導演版</td>
</tr> </tr>
<tr class="variety-table__year-row" data-year="2018"> <tr class="variety-table__year-row" data-year="2018">
<td colspan="5"> <td colspan="4" class="variety-table__year-head">
<button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2018-btn"> <button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2018-btn">
<span class="variety-table__year-label">2018</span> <span class="variety-table__year-label">2018</span>
<span class="variety-table__year-meta">3 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron"
aria-hidden="true"></i>
</button> </button>
</td> </td>
<td class="variety-table__year-tail">
<span class="variety-table__year-meta">3 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron" aria-hidden="true"></i>
</td>
</tr> </tr>
<tr class="variety-table__show-row" data-year="2018" hidden> <tr class="variety-table__show-row" data-year="2018" hidden>
<td class="variety-table__air-date" data-air-start="2018-05-05" <td class="variety-table__air-date" data-air-start="2018-05-05"
@@ -498,14 +536,15 @@
aria-hidden="true"></i>&nbsp;05＋導演版</td> aria-hidden="true"></i>&nbsp;05＋導演版</td>
</tr> </tr>
<tr class="variety-table__year-row" data-year="2019"> <tr class="variety-table__year-row" data-year="2019">
<td colspan="5"> <td colspan="4" class="variety-table__year-head">
<button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2019-btn"> <button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2019-btn">
<span class="variety-table__year-label">2019</span> <span class="variety-table__year-label">2019</span>
<span class="variety-table__year-meta">5 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron"
aria-hidden="true"></i>
</button> </button>
</td> </td>
<td class="variety-table__year-tail">
<span class="variety-table__year-meta">5 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron" aria-hidden="true"></i>
</td>
</tr> </tr>
<tr class="variety-table__show-row" data-year="2019" hidden> <tr class="variety-table__show-row" data-year="2019" hidden>
<td class="variety-table__air-date" data-air-start="2019-05-31" <td class="variety-table__air-date" data-air-start="2019-05-31"
@@ -578,14 +617,15 @@
aria-hidden="true"></i>&nbsp;11</td> aria-hidden="true"></i>&nbsp;11</td>
</tr> </tr>
<tr class="variety-table__year-row" data-year="2020"> <tr class="variety-table__year-row" data-year="2020">
<td colspan="5"> <td colspan="4" class="variety-table__year-head">
<button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2020-btn"> <button type="button" class="variety-table__year-toggle" aria-expanded="false" id="captain-year-2020-btn">
<span class="variety-table__year-label">2020</span> <span class="variety-table__year-label">2020</span>
<span class="variety-table__year-meta">2 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron"
aria-hidden="true"></i>
</button> </button>
</td> </td>
<td class="variety-table__year-tail">
<span class="variety-table__year-meta">2 檔</span>
<i class="fa-solid fa-chevron-down variety-table__year-chevron" aria-hidden="true"></i>
</td>
</tr> </tr>
<tr class="variety-table__show-row" data-year="2020" hidden> <tr class="variety-table__show-row" data-year="2020" hidden>
<td class="variety-table__air-date" data-air-start="2020-01-10" <td class="variety-table__air-date" data-air-start="2020-01-10"
@@ -734,6 +774,14 @@
}); });
}); });
document.querySelectorAll(".variety-table__year-tail").forEach((tail) => {
tail.addEventListener("click", () => {
tail.closest(".variety-table__year-row")
?.querySelector(".variety-table__year-toggle")
?.click();
});
});
function showTab(tab) { function showTab(tab) {
tabBtns.forEach((btn) => { tabBtns.forEach((btn) => {
const on = btn.dataset.tab === tab; const on = btn.dataset.tab === tab;