feat 修改內容
@@ -186,6 +186,31 @@ section.archive-block p:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* 入坑歷程:手繪感雙線波浪黃底線(SVG 拼貼,略不規則) */
|
||||
.home-page #start .fan-journey-wave {
|
||||
display: inline;
|
||||
padding: 0 0.04em 0.42em;
|
||||
background-image: url("../images/fan-journey-wave-underline.svg");
|
||||
background-repeat: repeat-x;
|
||||
background-position: left 0 bottom 3px;
|
||||
background-size: 280px 0.62em;
|
||||
box-decoration-break: clone;
|
||||
-webkit-box-decoration-break: clone;
|
||||
}
|
||||
|
||||
.home-page #start .fan-journey-wave i {
|
||||
margin: 0 0.18em;
|
||||
color: rgba(180, 140, 0, 0.72);
|
||||
font-size: 0.78em;
|
||||
vertical-align: 0.08em;
|
||||
}
|
||||
|
||||
@media (max-width: 520px) {
|
||||
.home-page #start .fan-journey-wave {
|
||||
background-size: min(220px, 100%) 0.58em;
|
||||
}
|
||||
}
|
||||
|
||||
/* 與首頁同欄寬:區塊內列表(minister_ge 等) */
|
||||
.home-page .container>section .intro-text ul {
|
||||
margin: 0.5rem 0 0;
|
||||
|
||||
@@ -133,6 +133,11 @@ nav a:hover {
|
||||
flex: 1 1 200px;
|
||||
}
|
||||
|
||||
.portal-nav>ul>li:hover,
|
||||
.portal-nav>ul>li:focus-within {
|
||||
z-index: 70;
|
||||
}
|
||||
|
||||
.portal-nav>ul>li>a {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
@@ -208,15 +213,205 @@ nav a:hover {
|
||||
color: #3a300a;
|
||||
}
|
||||
|
||||
.portal-nav a.nav-current {
|
||||
/* 淪陷瞬間 · 全員發瘋:僅第一層選單向下;第二層起向右飛出(≥1025px),小螢幕改直向堆疊 */
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
margin-top: 4px;
|
||||
padding-top: 6px;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup:hover {
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup-head {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
padding: 6px 26px 8px 10px;
|
||||
position: relative;
|
||||
color: #4a4a4a;
|
||||
font-size: 0.84rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup-head::after {
|
||||
content: "\203A";
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
opacity: 0.35;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup-head .portal-nav__sub {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.portal-nav .portal-nav__subgroup>.portal-submenu-nested {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 8px 10px;
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
position: absolute;
|
||||
left: calc(100% + 3px);
|
||||
top: 0;
|
||||
min-width: 216px;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14);
|
||||
border: 1px solid rgba(0, 0, 0, 0.06);
|
||||
z-index: 96;
|
||||
}
|
||||
|
||||
.portal-nav .portal-nav__subgroup:hover>.portal-submenu-nested,
|
||||
.portal-nav .portal-nav__subgroup:focus-within>.portal-submenu-nested {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu-nested li {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup--nested {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup--nested:hover {
|
||||
z-index: 5;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup-head--nested {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 2px;
|
||||
padding: 8px 24px 8px 10px;
|
||||
position: relative;
|
||||
font-size: 0.82rem;
|
||||
color: #4a4a4a;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.portal-nav .portal-nav__subgroup-head--nested::after {
|
||||
content: "\203A";
|
||||
position: absolute;
|
||||
right: 8px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 0.95rem;
|
||||
font-weight: 700;
|
||||
opacity: 0.35;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu-nested--tier3 {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 8px 10px;
|
||||
display: none;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
position: absolute;
|
||||
left: calc(100% + 3px);
|
||||
top: 0;
|
||||
min-width: 200px;
|
||||
background: #fff;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 14px 36px rgba(0, 0, 0, 0.16);
|
||||
border: 1px solid rgba(0, 0, 0, 0.07);
|
||||
z-index: 102;
|
||||
}
|
||||
|
||||
.portal-nav .portal-nav__subgroup--nested:hover>.portal-submenu-nested--tier3,
|
||||
.portal-nav .portal-nav__subgroup--nested:focus-within>.portal-submenu-nested--tier3 {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
.portal-nav .portal-submenu .portal-nav__subgroup-head::after,
|
||||
.portal-nav .portal-nav__subgroup-head--nested::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.portal-nav .portal-nav__subgroup>.portal-submenu-nested,
|
||||
.portal-nav .portal-nav__subgroup:hover>.portal-submenu-nested,
|
||||
.portal-nav .portal-nav__subgroup:focus-within>.portal-submenu-nested {
|
||||
position: static;
|
||||
display: flex !important;
|
||||
width: 100%;
|
||||
min-width: 0;
|
||||
margin: 8px 0 0;
|
||||
padding: 8px 0 8px 12px;
|
||||
border: 0;
|
||||
border-left: 2px solid rgba(255, 204, 0, 0.45);
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu-nested--tier3,
|
||||
.portal-nav .portal-nav__subgroup--nested:hover>.portal-submenu-nested--tier3,
|
||||
.portal-nav .portal-nav__subgroup--nested:focus-within>.portal-submenu-nested--tier3 {
|
||||
position: static;
|
||||
display: flex !important;
|
||||
margin: 8px 0 0 10px;
|
||||
padding: 6px 0 6px 12px;
|
||||
border: 0;
|
||||
border-left: 2px solid rgba(255, 180, 0, 0.38);
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
min-width: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu>li+li>a[data-coming-soon="true"] {
|
||||
margin-top: 4px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.07);
|
||||
}
|
||||
|
||||
/* 目前頁:僅頂層主欄用白字(深色頂欄);子選單白底上若用白字會看不見 */
|
||||
.portal-nav>ul>li>a.nav-current {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.portal-nav a.nav-current .portal-nav__sub {
|
||||
.portal-nav>ul>li>a.nav-current .portal-nav__sub {
|
||||
color: rgba(255, 255, 255, 0.82);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu a.nav-current,
|
||||
.portal-nav .portal-submenu-nested a.nav-current {
|
||||
color: #3a300a;
|
||||
background: rgba(255, 204, 0, 0.22);
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu a.nav-current .portal-nav__sub,
|
||||
.portal-nav .portal-submenu-nested a.nav-current .portal-nav__sub {
|
||||
color: #5a4810;
|
||||
opacity: 0.92;
|
||||
}
|
||||
|
||||
.portal-nav .portal-submenu a.nav-current:hover,
|
||||
.portal-nav .portal-submenu-nested a.nav-current:hover {
|
||||
background: rgba(255, 204, 0, 0.32);
|
||||
color: #2a2206;
|
||||
}
|
||||
|
||||
.portal-nav>ul>li.coming-soon>a {
|
||||
cursor: default;
|
||||
opacity: 0.82;
|
||||
@@ -481,10 +676,10 @@ section {
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.mission-section .mission-row + .mission-row {
|
||||
.mission-section .mission-row+.mission-row {
|
||||
margin-top: 2.75rem;
|
||||
padding-top: 2.75rem;
|
||||
border-top: 1px solid rgba(255, 204, 0, 0.45);
|
||||
/* border-top: 1px solid rgba(255, 204, 0, 0.45); */
|
||||
}
|
||||
|
||||
.mission-section .mission-row__visual {
|
||||
@@ -500,7 +695,7 @@ section {
|
||||
}
|
||||
|
||||
.mission-section .mission-lead,
|
||||
.mission-section .mission-row__body > p {
|
||||
.mission-section .mission-row__body>p {
|
||||
color: #4a4a4a;
|
||||
font-size: 1rem;
|
||||
line-height: 1.65;
|
||||
@@ -538,9 +733,10 @@ section {
|
||||
border-bottom: 2px solid rgba(255, 204, 0, 0.5);
|
||||
}
|
||||
|
||||
.mission-section .mission-row--concept .mission-row__body > p {
|
||||
/*
|
||||
.mission-section .mission-row--concept .mission-row__body>p {
|
||||
text-align: center;
|
||||
}
|
||||
} */
|
||||
|
||||
.mission-section .mission-row--intro .logo-wrapper {
|
||||
position: sticky;
|
||||
@@ -975,6 +1171,33 @@ a {
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
/* 時間軸內文:外站連結(例:Disney+ 劇集) */
|
||||
.merged-storyline .story-external-inline {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.35em;
|
||||
font-weight: 700;
|
||||
color: var(--dark-yellow);
|
||||
text-decoration: underline;
|
||||
text-decoration-color: currentColor;
|
||||
text-underline-offset: 0.22em;
|
||||
text-decoration-thickness: 2px;
|
||||
text-underline-position: from-font;
|
||||
}
|
||||
|
||||
.merged-storyline .story-external-inline:hover,
|
||||
.merged-storyline .story-external-inline:focus-visible {
|
||||
color: var(--primary);
|
||||
text-decoration-thickness: 2px;
|
||||
}
|
||||
|
||||
.merged-storyline .story-external-inline i {
|
||||
font-size: 0.78em;
|
||||
opacity: 0.88;
|
||||
line-height: 1;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 900px) {
|
||||
|
||||
/* 備註:手機版主軸維持在左側,避免鑽石與內容互相遮擋 */
|
||||
@@ -1074,6 +1297,11 @@ footer a .mark_b {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.map-page .portal-nav>ul>li:hover,
|
||||
.map-page .portal-nav>ul>li:focus-within {
|
||||
z-index: 35;
|
||||
}
|
||||
|
||||
.map-page .portal-nav>ul>li>a {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
@@ -1133,6 +1361,76 @@ footer a .mark_b {
|
||||
color: #3a300a;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu a.nav-current,
|
||||
.map-page .portal-nav .portal-submenu-nested a.nav-current {
|
||||
color: #3a300a;
|
||||
background: rgba(255, 204, 0, 0.22);
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu a.nav-current .portal-nav__sub,
|
||||
.map-page .portal-nav .portal-submenu-nested a.nav-current .portal-nav__sub {
|
||||
color: #5a4810;
|
||||
opacity: 0.92;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu .portal-nav__subgroup-head {
|
||||
align-items: flex-end;
|
||||
text-align: right;
|
||||
padding-left: 26px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu .portal-nav__subgroup-head::after {
|
||||
right: auto;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-nav__subgroup>.portal-submenu-nested {
|
||||
left: auto;
|
||||
right: calc(100% + 3px);
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu-nested a {
|
||||
align-items: flex-end;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-nav__subgroup-head--nested {
|
||||
align-items: flex-end;
|
||||
text-align: right;
|
||||
padding-left: 24px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-nav__subgroup-head--nested::after {
|
||||
right: auto;
|
||||
left: 8px;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu-nested--tier3 {
|
||||
left: auto;
|
||||
right: calc(100% + 3px);
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
.map-page .portal-nav .portal-nav__subgroup>.portal-submenu-nested,
|
||||
.map-page .portal-nav .portal-nav__subgroup:hover>.portal-submenu-nested,
|
||||
.map-page .portal-nav .portal-nav__subgroup:focus-within>.portal-submenu-nested {
|
||||
border-left: none;
|
||||
border-right: 2px solid rgba(255, 204, 0, 0.45);
|
||||
padding: 8px 12px 8px 0;
|
||||
}
|
||||
|
||||
.map-page .portal-nav .portal-submenu-nested--tier3,
|
||||
.map-page .portal-nav .portal-nav__subgroup--nested:hover>.portal-submenu-nested--tier3,
|
||||
.map-page .portal-nav .portal-nav__subgroup--nested:focus-within>.portal-submenu-nested--tier3 {
|
||||
border-left: none;
|
||||
border-right: 2px solid rgba(255, 180, 0, 0.38);
|
||||
padding: 6px 12px 6px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.map-page .portal-nav>ul>li>a[data-coming-soon="true"]:hover,
|
||||
.map-page .portal-nav>ul>li>a[data-coming-soon="true"]:focus-visible {
|
||||
color: rgba(212, 196, 150, 0.95);
|
||||
@@ -1848,9 +2146,9 @@ body.totoga2-page .totoga2-reader-hub {
|
||||
}
|
||||
|
||||
/* 紀實長文 hub:上方 plot 為 section(全站 section 設 z-index:10),與下方控制列重疊時會蓋住點擊 */
|
||||
body.totoga2-page .totoga2-reader-hub > .chronicle-controls,
|
||||
body.totoga2-page .totoga2-reader-hub > #totoga2-reader,
|
||||
body.totoga2-page .totoga2-reader-hub > #totoga2-pager {
|
||||
body.totoga2-page .totoga2-reader-hub>.chronicle-controls,
|
||||
body.totoga2-page .totoga2-reader-hub>#totoga2-reader,
|
||||
body.totoga2-page .totoga2-reader-hub>#totoga2-pager {
|
||||
position: relative;
|
||||
z-index: 12;
|
||||
}
|
||||
@@ -1886,6 +2184,26 @@ body.totoga2-page .ebook-back-link {
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
/* extra/totoga2 copy.html — 複本改為三獨立頁後的總覽;子頁共用 .totoga2-split-crossnav */
|
||||
body.totoga2-page .totoga2-split-crossnav {
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
body.totoga2-page .totoga2-copy-hub-main {
|
||||
max-width: 960px;
|
||||
margin: 0 auto 2rem;
|
||||
padding: 0 14px;
|
||||
}
|
||||
|
||||
body.totoga2-page .totoga2-copy-hub-nav {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
body.totoga2-page .totoga2-copy-hub-anchor-hint {
|
||||
text-align: center;
|
||||
font-size: 0.95rem;
|
||||
}
|
||||
|
||||
/* extra/member.html — 黑白水晶交錯格(2×4)與懸賞令海報 */
|
||||
body.member-crystal-page .member-crystal-main {
|
||||
padding: 1.75rem 14px 3rem;
|
||||
@@ -2160,6 +2478,185 @@ body.site-guide-page .site-guide-lead {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-lead--short {
|
||||
max-width: 52rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 1.25rem;
|
||||
font-size: 0.95rem;
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-group--nav-hero {
|
||||
margin-bottom: 2.25rem;
|
||||
padding: clamp(14px, 2.5vw, 22px);
|
||||
border-radius: 16px;
|
||||
border: 1px solid rgba(255, 204, 0, 0.28);
|
||||
background: linear-gradient(165deg, rgba(255, 252, 240, 0.95) 0%, #fff 55%);
|
||||
box-shadow: 0 10px 28px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-group--nav-hero > .section-title {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-legend {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 1.25rem;
|
||||
margin: 0 0 1rem;
|
||||
font-size: 0.86rem;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-legend__on {
|
||||
color: #5c4810;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-legend__off {
|
||||
color: #9a9a9a;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table-wrap {
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table,
|
||||
body.site-guide-page .site-guide-mini-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.45;
|
||||
background: #fff;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table caption.site-guide-nav-caption {
|
||||
caption-side: top;
|
||||
text-align: center;
|
||||
padding: 0 0.5rem 0.65rem;
|
||||
font-size: 0.8rem;
|
||||
color: #777;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table th,
|
||||
body.site-guide-page .site-guide-nav-table td,
|
||||
body.site-guide-page .site-guide-mini-table th,
|
||||
body.site-guide-page .site-guide-mini-table td {
|
||||
border: 1px solid rgba(0, 0, 0, 0.08);
|
||||
padding: 0.55rem 0.65rem;
|
||||
vertical-align: top;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table thead th,
|
||||
body.site-guide-page .site-guide-mini-table thead th {
|
||||
background: rgba(255, 220, 140, 0.35);
|
||||
font-size: 0.72rem;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: #4a3a10;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tbody tr:nth-child(even),
|
||||
body.site-guide-page .site-guide-mini-table tbody tr:nth-child(even) {
|
||||
background: rgba(255, 250, 235, 0.45);
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table td.site-guide-nav-desc {
|
||||
font-size: 0.86rem;
|
||||
line-height: 1.55;
|
||||
color: #444;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table td.site-guide-nav-link-cell {
|
||||
font-size: 0.78rem;
|
||||
line-height: 1.45;
|
||||
vertical-align: top;
|
||||
word-break: break-word;
|
||||
min-width: 7.5rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table td.site-guide-nav-link-cell code {
|
||||
font-size: 0.92em;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table a {
|
||||
color: #5c4010;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table a:hover,
|
||||
body.site-guide-page .site-guide-mini-table a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-mini-table a {
|
||||
color: #5c4010;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-nolink {
|
||||
color: #959595;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-mini-table th[scope="row"] {
|
||||
width: 7rem;
|
||||
background: rgba(0, 0, 0, 0.03);
|
||||
font-weight: 700;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-subh {
|
||||
margin: 1.5rem 0 0.65rem;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
color: #6a5a30;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-grid--compact {
|
||||
margin-top: 1rem;
|
||||
grid-template-columns: minmax(0, min(100%, 40rem));
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-inline-links {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5rem 1rem;
|
||||
margin: 0 0 0.75rem;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
font-size: 0.92rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-inline-links a {
|
||||
font-weight: 700;
|
||||
color: #5c4810;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-fine-print--center {
|
||||
text-align: center;
|
||||
margin-top: 0.25rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-group {
|
||||
margin-bottom: 2.75rem;
|
||||
}
|
||||
@@ -2288,7 +2785,7 @@ body.site-guide-page .site-guide-totoga2-panel {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-totoga2-panel + .site-guide-totoga2-panel {
|
||||
body.site-guide-page .site-guide-totoga2-panel+.site-guide-totoga2-panel {
|
||||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
@@ -2386,7 +2883,7 @@ body.minister-page .variety-block .intro-text {
|
||||
margin: 0 0 10px;
|
||||
}
|
||||
|
||||
body.minister-page .variety-block .slogan-quote--awakening + .intro-text {
|
||||
body.minister-page .variety-block .slogan-quote--awakening+.intro-text {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
@@ -2443,7 +2940,7 @@ body.minister-page .minister-journey {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
body.minister-page .minister-journey > .section-title {
|
||||
body.minister-page .minister-journey>.section-title {
|
||||
margin-bottom: 0.35rem;
|
||||
}
|
||||
|
||||
@@ -2463,7 +2960,7 @@ body.minister-page .merged-storyline .story-node p.minister-month {
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
body.minister-page .merged-storyline .story-node h3 + p.minister-month {
|
||||
body.minister-page .merged-storyline .story-node h3+p.minister-month {
|
||||
margin-top: 0.35rem;
|
||||
}
|
||||
|
||||
@@ -2505,4 +3002,4 @@ body.minister-page .minister-back {
|
||||
body.minister-page .minister-photo--dual {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 20" width="320" height="20" preserveAspectRatio="none" aria-hidden="true">
|
||||
<path fill="none" stroke="#c9a000" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M2 13c11-9 23 8 36-1s28-7 42 5 30-12 46-2 34 9 50-1 26-6 40 4 22-8 36 2 28 5 42-3"/>
|
||||
<path fill="none" stroke="#f5d24a" stroke-width="1.5" stroke-linecap="round" opacity="0.92"
|
||||
d="M0 14c16-10 30 9 48-2s34-5 52 6 38-11 56-1 30 7 48-2 36-4 52 5 28-7 40 3"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 517 B |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 312 KiB |
|
After Width: | Height: | Size: 122 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 74 KiB |
|
After Width: | Height: | Size: 156 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 505 KiB |
|
After Width: | Height: | Size: 328 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 319 KiB |
|
After Width: | Height: | Size: 174 KiB |
|
After Width: | Height: | Size: 366 KiB |
|
After Width: | Height: | Size: 322 KiB |
|
After Width: | Height: | Size: 168 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 151 KiB |
|
After Width: | Height: | Size: 9.2 MiB |
|
After Width: | Height: | Size: 10 MiB |
|
After Width: | Height: | Size: 9.9 MiB |
|
After Width: | Height: | Size: 5.2 MiB |
|
After Width: | Height: | Size: 6.1 MiB |
|
After Width: | Height: | Size: 4.4 MiB |
|
After Width: | Height: | Size: 4.2 MiB |
|
After Width: | Height: | Size: 3.8 MiB |
|
After Width: | Height: | Size: 8.3 MiB |
|
After Width: | Height: | Size: 4.3 MiB |
|
After Width: | Height: | Size: 7.6 MiB |
|
After Width: | Height: | Size: 7.2 MiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 66 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 595 KiB |
|
After Width: | Height: | Size: 723 KiB |
|
After Width: | Height: | Size: 562 KiB |
|
After Width: | Height: | Size: 634 KiB |
|
After Width: | Height: | Size: 377 KiB |
|
After Width: | Height: | Size: 177 KiB |
|
After Width: | Height: | Size: 220 KiB |
|
After Width: | Height: | Size: 262 KiB |
|
After Width: | Height: | Size: 336 KiB |
|
After Width: | Height: | Size: 195 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 212 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 732 KiB |
|
After Width: | Height: | Size: 36 KiB |
|
After Width: | Height: | Size: 148 KiB |
|
After Width: | Height: | Size: 79 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 161 KiB |
|
After Width: | Height: | Size: 95 KiB |
|
After Width: | Height: | Size: 71 KiB |
|
After Width: | Height: | Size: 122 KiB |
|
After Width: | Height: | Size: 132 KiB |
|
After Width: | Height: | Size: 83 KiB |
|
After Width: | Height: | Size: 73 KiB |
|
After Width: | Height: | Size: 159 KiB |
|
After Width: | Height: | Size: 77 KiB |
|
After Width: | Height: | Size: 85 KiB |
|
After Width: | Height: | Size: 75 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 75 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 86 KiB |
|
After Width: | Height: | Size: 69 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 10 MiB |
|
After Width: | Height: | Size: 447 KiB |
@@ -1,7 +1,7 @@
|
||||
(() => {
|
||||
/**
|
||||
* ── 導覽「尚未開放」連結 ─────────────────────────────────────────
|
||||
* ① 頂欄 `buildPortalNavInnerHTML`:僅列站主同意掛在頂欄的分類(**不含**未同意的頁,例如 `member`「六顆水晶」)。
|
||||
* ① 頂欄 `buildPortalNavInnerHTML`:僅列站主同意掛在頂欄的分類(**不含**未同意的頁)。
|
||||
* ② `COMING_SOON_PAGES`/`INDEX_NAV_OPEN_HASHES`:在 Set/白名單外=籌備中(`href` 改 `#`)。
|
||||
* ③ **唯一例外**:`extra/site-guide.html` 的 `<nav data-portal-nav data-portal-nav-all-open>` **不套用**籌備中(索引頁預覽用,頂欄連結全可點);**其他任何頁**不得加 `data-portal-nav-all-open`。
|
||||
* ④ 文案 NAV_SOON_PHRASES:滑過/聚焦時隨機一句;無障礙固定「尚無開放」。
|
||||
@@ -19,6 +19,9 @@
|
||||
"夢想航行中", // 未來規劃中,期待水晶男孩的下一個十年
|
||||
];
|
||||
|
||||
/** 主選單欄 `mouseleave` 後延遲關閉(ms),方便移入子選單或右側飛出層,避免略偏就關閉 */
|
||||
const SUBMENU_CLOSE_DELAY_MS = 480;
|
||||
|
||||
function pickSoonPhrase() {
|
||||
return NAV_SOON_PHRASES[Math.floor(Math.random() * NAV_SOON_PHRASES.length)];
|
||||
}
|
||||
@@ -31,17 +34,17 @@
|
||||
}
|
||||
|
||||
const COMING_SOON_PAGES = new Set([
|
||||
"variety.html",
|
||||
"njtw5.html",
|
||||
"concert.html",
|
||||
"albums.html",
|
||||
"map.html",
|
||||
"minister.html",
|
||||
"minister_ge.html",
|
||||
]);
|
||||
|
||||
/** 首頁僅下列錨點可點;其餘(如 #story)維持籌備中,須站主同意後才可加入 */
|
||||
const INDEX_NAV_OPEN_HASHES = new Set(["#origin", "#start", "#mission", "#timeline"]);
|
||||
/**
|
||||
* 首頁僅下列錨點可點;其餘(如 #story)維持籌備中,須站主同意後才可加入。
|
||||
* 空字串:連到 index.html 且無 # 片段時視為可點(淪陷瞬間 · 初心與軌跡)。
|
||||
*/
|
||||
const INDEX_NAV_OPEN_HASHES = new Set(["", "#origin", "#start", "#mission", "#timeline"]);
|
||||
|
||||
function normalizePageKey(href) {
|
||||
if (!href || href === "#") return "";
|
||||
@@ -83,6 +86,7 @@
|
||||
}
|
||||
|
||||
link.setAttribute("href", "#");
|
||||
link.dataset.portalNavSoonRoll = "1";
|
||||
}
|
||||
|
||||
function linkShouldBeComingSoon(href, pageKey, pageKeysSoon) {
|
||||
@@ -153,30 +157,35 @@
|
||||
}
|
||||
}
|
||||
|
||||
/** 全站導覽 HTML — `rp` 為站根相對前綴;僅修改此模板即可同步所有頁面 */
|
||||
/** 全站導覽 HTML — `rp` 為站根相對前綴;僅修改此模板即可同步所有頁面
|
||||
* 五主項:淪陷瞬間(全員發瘋巢狀)、完整的六顆(member)、現場的震撼、黃色留聲機、Yellow Note(minister、map);variety 僅經淪陷子選單進入。 */
|
||||
function buildPortalNavInnerHTML(rp) {
|
||||
return `
|
||||
<a class="logo" target="_blank" rel="noopener noreferrer" href="${rp}index.html"><img src="${rp}assets/images/logov.svg" alt="SECHSKIES Logo"></a>
|
||||
<ul>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html#origin"><span class="portal-nav__label">淪陷瞬間</span><span class="portal-nav__sub">六顆永恆的水晶 · 左右命運的傳奇</span></a>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html"><span class="portal-nav__label">淪陷瞬間</span><span class="portal-nav__sub">六顆永恆的水晶 · 左右命運的傳奇</span></a>
|
||||
<ul class="portal-submenu">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html#start"><span class="portal-nav__label">好奇的開端</span><span class="portal-nav__sub">從好奇觀看到淪陷的起點</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html#mission"><span class="portal-nav__label">成立的初衷</span><span class="portal-nav__sub">推廣部與黃色奇蹟</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html#timeline"><span class="portal-nav__label">跨時空軌跡</span><span class="portal-nav__sub">年表與作品節點</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html#story"><span class="portal-nav__label">傳奇的轉折</span><span class="portal-nav__sub">重逢與敘事主線</span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/variety.html"><span class="portal-nav__label">瘋子與天才</span><span class="portal-nav__sub">EUN JI-WON × VARIETY GRAVITY</span></a>
|
||||
<ul class="portal-submenu">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/variety.html#variety"><span class="portal-nav__label">瘋狂出演中</span><span class="portal-nav__sub">綜藝鏡頭與名場面</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/variety.html#stage"><span class="portal-nav__label">隊長的氣場</span><span class="portal-nav__sub">控場與隊內互動</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/NJTW/NJTW5.html"><span class="portal-nav__label">新西遊記</span><span class="portal-nav__sub">成員介紹 · MEMBER GUIDE</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}index.html"><span class="portal-nav__label">初心與軌跡</span><span class="portal-nav__sub">我們現在:從好奇觀看到淪陷的起點</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}extra/totoga2.html"><span class="portal-nav__label">傳奇的轉折</span><span class="portal-nav__sub">六六歌2 紀實與重逢敘事主線</span></a></li>
|
||||
<li class="portal-nav__subgroup">
|
||||
<span class="portal-nav__subgroup-head"><span class="portal-nav__label">全員發瘋</span><span class="portal-nav__sub">原來我是個正常人啊!團綜與失控現場</span></span>
|
||||
<ul class="portal-submenu-nested" aria-label="全員發瘋">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/variety.html#stage"><span class="portal-nav__label">隊長帶弟弟</span><span class="portal-nav__sub">控場與隊內互動</span></a></li>
|
||||
<li class="portal-nav__subgroup portal-nav__subgroup--nested">
|
||||
<span class="portal-nav__subgroup-head portal-nav__subgroup-head--nested"><span class="portal-nav__label">各自暴走</span><span class="portal-nav__sub">獨立內頁籌備中</span></span>
|
||||
<ul class="portal-submenu-nested portal-submenu-nested--tier3" aria-label="各自暴走">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}variety/NJTW/NJTW5.html"><span class="portal-nav__label">新西遊記</span><span class="portal-nav__sub">成員介紹 · MEMBER GUIDE</span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}extra/member.html"><span class="portal-nav__label">完整的六顆</span><span class="portal-nav__sub">六顆水晶 · 黑白分流</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}concert/concert.html"><span class="portal-nav__label">現場的震撼</span><span class="portal-nav__sub">SECHSKIES CONCERT ARCHIVE</span></a>
|
||||
<ul class="portal-submenu">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}concert/concert.html#stage-now"><span class="portal-nav__label">永恆的重逢</span><span class="portal-nav__sub">近年與重聚舞台</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}concert/concert.html#stage-past"><span class="portal-nav__label">燦爛的最初</span><span class="portal-nav__sub">全盛期經典場次</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}concert/concert.html"><span class="portal-nav__label">集結水晶</span><span class="portal-nav__sub">團體演唱會</span></a></li>
|
||||
<li><a href="#" data-coming-soon="true" aria-disabled="true" aria-label="隊長的氣場,尚無開放"><span class="portal-nav__label">隊長的氣場</span><span class="portal-nav__sub">個人見面會與演唱會</span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}albums/albums.html"><span class="portal-nav__label">黃色留聲機</span><span class="portal-nav__sub">YELLOW PHONOGRAPH</span></a>
|
||||
@@ -185,10 +194,10 @@
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}albums/albums.html#classic"><span class="portal-nav__label">輝煌全盛期</span><span class="portal-nav__sub">1997–1999 年表</span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}map/map.html"><span class="portal-nav__label">聖地巡禮</span><span class="portal-nav__sub">SECHSKIES TAIWAN ARCHIVE</span></a>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}map/map.html"><span class="portal-nav__label">Yellow Note</span><span class="portal-nav__sub">視覺進化論 · 聖地巡禮</span></a>
|
||||
<ul class="portal-submenu">
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}map/map.html#taipei"><span class="portal-nav__label">台北聖地</span><span class="portal-nav__sub">行程與地點整理</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}map/map.html#global"><span class="portal-nav__label">海外遠征</span><span class="portal-nav__sub">跨國足跡</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}extra/minister.html"><span class="portal-nav__label">視覺進化論</span><span class="portal-nav__sub">FROM CURIOSITY TO FULL-STACK</span></a></li>
|
||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}map/map.html"><span class="portal-nav__label">聖地巡禮</span><span class="portal-nav__sub">SECHSKIES TAIWAN ARCHIVE</span></a></li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -209,7 +218,8 @@
|
||||
const currentPage = window.location.pathname.split("/").pop() || "index.html";
|
||||
|
||||
navs.forEach((nav) => {
|
||||
const items = Array.from(nav.querySelectorAll("li"));
|
||||
/* 僅頂層主欄;子選單內巢狀 li 不綁 open,否則會關閉整欄下拉 */
|
||||
const items = Array.from(nav.querySelectorAll(":scope > ul > li"));
|
||||
const soonLinks = Array.from(nav.querySelectorAll('a[data-coming-soon="true"]'));
|
||||
|
||||
const blockNavigation = (event) => {
|
||||
@@ -219,6 +229,13 @@
|
||||
soonLinks.forEach((link) => {
|
||||
link.addEventListener("click", blockNavigation);
|
||||
link.addEventListener("auxclick", blockNavigation);
|
||||
if (!link.dataset.portalNavSoonRoll) {
|
||||
link.dataset.portalNavSoonRoll = "1";
|
||||
const onSoonInteract = () => rollSoonLabel(link);
|
||||
link.addEventListener("pointerenter", onSoonInteract);
|
||||
link.addEventListener("focus", onSoonInteract);
|
||||
link.addEventListener("touchstart", onSoonInteract, { passive: true });
|
||||
}
|
||||
});
|
||||
|
||||
items.forEach((item) => {
|
||||
@@ -237,7 +254,7 @@
|
||||
};
|
||||
|
||||
const scheduleClose = () => {
|
||||
closeTimer = window.setTimeout(() => item.classList.remove("open"), 180);
|
||||
closeTimer = window.setTimeout(() => item.classList.remove("open"), SUBMENU_CLOSE_DELAY_MS);
|
||||
};
|
||||
|
||||
item.addEventListener("mouseenter", openItem);
|
||||
@@ -267,8 +284,8 @@
|
||||
}
|
||||
});
|
||||
|
||||
const topLevelLinks = Array.from(nav.querySelectorAll(":scope > ul > li > a[href]"));
|
||||
topLevelLinks.forEach((link) => {
|
||||
const navLinks = Array.from(nav.querySelectorAll("a[href]")).filter((link) => !link.classList.contains("logo"));
|
||||
navLinks.forEach((link) => {
|
||||
const fallback = link.getAttribute("href");
|
||||
const source = link.dataset.originalHref || fallback;
|
||||
if (!source || source === "#") return;
|
||||
|
||||