From 782cf3637e80e13132a4a580f4f0ee8daaa5022c Mon Sep 17 00:00:00 2001 From: jekkinoopy Date: Thu, 27 Aug 2026 16:25:02 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A6=96=E8=A6=BA=E9=80=B2=E5=8C=96=E8=AB=96?= =?UTF-8?q?=E5=85=A7=E5=AE=B9=E6=BD=A4=E9=A3=BE=E3=80=81=E5=B0=8F=E9=BB=83?= =?UTF-8?q?=E6=96=87=E7=AB=A0=E5=85=B8=E8=97=8F=E6=94=B9=E9=80=A3=E7=AB=99?= =?UTF-8?q?=E5=85=A7=E5=85=A8=E6=96=87=E3=80=81=E5=85=A8=E7=AB=99=E8=A3=9C?= =?UTF-8?q?=E4=B8=8A=20section-copy=20=E6=8E=92=E7=89=88=E9=A1=9E=E5=88=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Sonnet 5 --- assets/css/fan-articles.css | 22 ++++--- assets/css/index.css | 5 +- assets/css/style.css | 80 +++++++++++++++++-------- yellow-note/fan-articles.html | 3 +- yellow-note/minister.html | 110 ++++++++++++++++++---------------- 5 files changed, 132 insertions(+), 88 deletions(-) diff --git a/assets/css/fan-articles.css b/assets/css/fan-articles.css index fdc313f..7d01ae3 100644 --- a/assets/css/fan-articles.css +++ b/assets/css/fan-articles.css @@ -12,14 +12,20 @@ margin: 0 auto; } +.fan-article-card { + border-left: 4px solid var(--color-brand); +} + .fan-article-card__meta { display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; - color: #9a9a9a; + color: var(--color-text-muted); letter-spacing: 0.5px; margin-bottom: 0.6rem; + padding-bottom: 0.6rem; + border-bottom: 1px solid rgba(255, 204, 0, 0.25); } .fan-article-card__board { @@ -29,19 +35,21 @@ } .fan-article-card__title { - margin: 0 0 0.3rem; - font-size: 1.2rem; - color: #2e2e2e; + margin: 0 0 0.5rem; + font-size: 1.35rem; + font-weight: 700; + color: var(--color-text-dark); } .fan-article-card__author { - margin: 0 0 0.8rem; + margin: 0 0 0.9rem; font-size: 0.9rem; - color: #7e7e7e; + font-style: italic; + color: var(--color-text-muted); } .fan-article-card p:not(.fan-article-card__author) { - color: #4a4a4a; + color: var(--color-text); line-height: 1.75; margin: 0 0 1rem; } diff --git a/assets/css/index.css b/assets/css/index.css index ff8e2fa..f0b9c40 100644 --- a/assets/css/index.css +++ b/assets/css/index.css @@ -92,9 +92,10 @@ /* albums/albums.html：.archive-block 已改為
，沿用 style.css 的 section 卡片版型 */ section.archive-block p { + font-size: 1.0625rem; color: #4a4a4a; - line-height: 1.7; - margin: 0 0 0.75rem; + line-height: 1.75; + margin: 0 0 1.125rem; } section.archive-block p:last-child { diff --git a/assets/css/style.css b/assets/css/style.css index d76af05..516ae50 100644 --- a/assets/css/style.css +++ b/assets/css/style.css @@ -269,7 +269,7 @@ nav a { } /* 子選單第一項（如淪陷瞬間／傳奇的轉折）上方不畫分隔線 */ -.portal-nav .portal-submenu > li.portal-nav__subgroup:first-child { +.portal-nav .portal-submenu>li.portal-nav__subgroup:first-child { margin-top: 0; padding-top: 0; border-top: none; @@ -1027,6 +1027,51 @@ footer { margin: 15px auto 0; } +/* 全站共用：跟首頁 #start 對齊的正文間距（h2.section-title 後接的敘述段落／列表）。 + 可套在包住多個

的容器上，也可直接加在單一

上。 */ +.section-copy { + max-width: 42rem; + margin-inline: auto; +} + +.section-copy p, +p.section-copy { + font-size: 1.0625rem; + line-height: 1.75; + color: #4a4a4a; + /* margin: 0 0 1.125rem; */ +} + +.section-copy p:last-child, +p.section-copy:last-child { + margin-bottom: 0; +} + +.section-copy ul { + margin: 0.5rem 0 0; + padding-left: 1.2rem; + color: #4a4a4a; + line-height: 1.75; + font-size: 1.0625rem; +} + +.section-copy ul li { + margin-bottom: 0.75rem; +} + +.section-copy ul li:last-child { + margin-bottom: 0; +} + +@media (max-width: 640px) { + + .section-copy p, + p.section-copy, + .section-copy ul { + font-size: 1rem; + } +} + .subtitle-wrap { margin: 4px auto 28px; display: flex; @@ -1741,19 +1786,19 @@ a { top: 0; } - /* 上邊：左上 → 右上 */ + /* 上邊：左上 → 右上 */ 36% { left: calc(100% - 1.15em); top: 0; } - /* 右邊：右上 → 右下 */ + /* 右邊：右上 → 右下 */ 46% { left: calc(100% - 1.15em); top: calc(100% - 1.15em); } - /* 下邊：右下 → 左下 */ + /* 下邊：右下 → 左下 */ 86% { left: 0; top: calc(100% - 1.15em); @@ -2821,7 +2866,7 @@ body.ebook-ssg2-page .ebook-intro.section p.ebook-intro-note { line-height: 1.5; } -body.ebook-ssg2-page .ebook-intro.section p.ebook-intro-lead + p.ebook-intro-note { +body.ebook-ssg2-page .ebook-intro.section p.ebook-intro-lead+p.ebook-intro-note { margin-top: -0.5rem; } @@ -3788,28 +3833,28 @@ body.site-guide-page .sg-node--extra.sg-node--nolink { font-style: italic; } -body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="1"] > .sg-node { +body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="1"]>.sg-node { font-weight: 800; font-size: 0.98rem; background: rgba(255, 220, 150, 0.55); border-color: rgba(255, 204, 0, 0.6); } -body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="2"] > .sg-node { +body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="2"]>.sg-node { background: rgba(255, 238, 200, 0.55); } -body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="3"] > .sg-node { +body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="3"]>.sg-node { background: #fffaf2; } -body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="4"] > .sg-node { +body.site-guide-page .site-guide-mindmap li[data-site-guide-depth="4"]>.sg-node { background: #f5f8ff; font-size: 0.82rem; } /* 延伸內容維持灰色虛線，不隨深度套用金黃底色（放在深度規則之後以蓋過同層底色） */ -body.site-guide-page .site-guide-mindmap li[data-site-guide-depth] > .sg-node--extra { +body.site-guide-page .site-guide-mindmap li[data-site-guide-depth]>.sg-node--extra { background: rgba(0, 0, 0, 0.02); border-color: rgba(0, 0, 0, 0.22); } @@ -4082,25 +4127,12 @@ body.minister-page .minister-hero-lead .mark_b { color: var(--color-brand-light); } -body.minister-page .variety-block .intro-text { - color: #333; - line-height: 1.9; - margin: 0 0 10px; -} - body.minister-page .variety-block .slogan-quote--awakening+.intro-text { margin-top: 1rem; } body.minister-page .minister-skill-list { - margin: 0.75rem 0 0; - padding-left: 1.2rem; - color: #333; - line-height: 1.75; -} - -body.minister-page .minister-skill-list li { - margin-bottom: 0.85rem; + list-style: none; } /* hashtag 膠囊：minister.html 與 home-page（minister_ge .hashtag-chip）共用 */ diff --git a/yellow-note/fan-articles.html b/yellow-note/fan-articles.html index 2b0b7f6..83a126e 100644 --- a/yellow-note/fan-articles.html +++ b/yellow-note/fan-articles.html @@ -42,8 +42,7 @@

回歸浪潮剛掀起時的深度長文：從 DSP 娛樂當年「專輯只賣 50 萬張」的解散說法談起，逐一點評六人各自的魅力——隊長殷志源的領導力、張水院的獨特氣質、李宰鎮的四次元思維、隱藏成員高志溶的溫暖、主唱姜成勳的顏值歌聲、金在德的忠誠，並向《無限挑戰》讓水晶男孩重回舞台致謝。

- + 閱讀原文 diff --git a/yellow-note/minister.html b/yellow-note/minister.html index aef51dc..8c1552e 100644 --- a/yellow-note/minister.html +++ b/yellow-note/minister.html @@ -25,24 +25,23 @@
-

- 關於我：從「好奇」到「全端」的進化之路 -

+

跨越時空的開端

-

+

這段旅程始於 2016 年 4 月，透過《無限挑戰》的回歸企劃，讓原本不認識這組傳奇團體的我，因一時好奇點開節目。即便錯過了 2000 年巔峰解散的時代，我依然被那份真誠且專業的魅力所震撼。

-

對我而言，這不只是追星的開始，更是自我覺醒的起點。

+

對我而言，這不只是追星的開始，更是自我覺醒的起點。

為了熱愛而進化的斜槓精神

-

- 我始於「水晶廢人」的自嘲，卻在熱愛中長成了各個領域的策劃者： +

+ 始於「水晶廢人字幕組」出現的名詞「水晶廢人」，在熱愛中長成了各個領域的策劃者：

-
    -
  • #水晶推廣部身為品牌設計師，我堅持「不看醜東西」的原則，親自操刀所有視覺，將這份能量轉化為專業策劃。
    • +
      +
    • #水晶推廣部身為設計總監，我堅持「美感」，親自操刀所有視覺，將這份能量轉化為專業策劃。
    • #水晶訓練營為了聽懂歐巴的每一句話，我開始學韓文、考韓檢、健身、跳舞，證明追星是自我提升最強大的動力。
    • #全端開發者這是我當下最重要的挑戰，將設計專業與程式技術結合，搭建一個專屬於這份熱愛的數位平台。
    @@ -55,58 +54,63 @@
    -
    -

    手作初試

    -

    開始學習勾針，為金在德製作第一個鴨鴨置物籃，這是從旁觀者轉為實踐者的第一步。

    -
    +
    +

    手作初試

    +

    開始學習勾針，為金在德製作第一個鴨鴨置物籃，這是從旁觀者轉為實踐者的第一步。

    +
    -
    -

    螢幕後的參與

    -

    以「水晶廢人字幕組」粉絲身分，用手繪應援板與勾針作品參與應援影片籌備。

    -
    +
    +

    螢幕後的參與

    +

    以「水晶廢人字幕組」粉絲身分，用手繪應援板與勾針作品參與應援影片籌備。

    +
    -
    -

    孤注一擲的現場

    -

    在經濟窘迫、甚至需要借錢籌措旅費的情況下，飛往首爾參加首場演唱會。在那裡，我握著導師設計的台灣小黃手幅，第一次感受到設計與才華帶來的震撼。

    -
    +
    +

    孤注一擲的現場

    +

    在經濟窘迫、甚至需要借錢籌措旅費的情況下，飛往首爾參加首場演唱會。在那裡，我握著導師設計的台灣小黃手幅，第一次感受到設計與才華帶來的震撼。

    +
    -
    -

    溫暖的饋贈

    -

    在「#水晶文具社」聚會中，收到了同好精緻的手繪聖誕卡片。看著別人的創作，我更加確信自己也想成為能用作品傳遞能量的人。

    -
    +
    +

    溫暖的饋贈

    +

    在「#水晶文具社」聚會中，收到了同好精緻的手繪聖誕卡片。看著別人的創作，我更加確信自己也想成為能用作品傳遞能量的人。

    +
    -
    -

    職人精神的啟發

    -

    參與資管組 D 大的新年紅包活動。其書法與刻印結合的質感，深深影響了我對美感的標準。

    -
    +
    +

    職人精神的啟發

    +

    參與資管組 D 大的新年紅包活動。其書法與刻印結合的質感，深深影響了我對美感的標準。

    +
    -
    -

    身體記憶的熱血

    -

    擔任應援組熱舞企劃小組長，在板橋與中山地下街教舞兩個月，為此減重 10 公斤，用身體記憶跨越世紀的節奏。

    -
    +
    +

    身體記憶的熱血

    +

    擔任應援組熱舞企劃小組長，在板橋與中山地下街教舞兩個月，為此減重 10 公斤，用身體記憶跨越世紀的節奏。

    +
    -
    -

    筆尖的沈澱

    -

    跟著文具社走遍全台咖啡廳，在鋼筆墨水與玻璃杯的陪伴下，用手寫記錄初心。

    -
    +
    +

    筆尖的沈澱

    +

    跟著文具社走遍全台咖啡廳，在鋼筆墨水與玻璃杯的陪伴下，用手寫記錄初心。

    +
    -
    -

    設計靈魂覺醒

    -

    正式踏入設計領域。因為想為水晶男孩創作的執念，所有的練習都以他們為主題，這種動力讓我的設計實力產生質變。

    -
    +
    +

    設計靈魂覺醒

    +

    正式踏入設計領域。因為想為水晶男孩創作的執念，所有的練習都以他們為主題，這種動力讓我的設計實力產生質變。

    +
    -
    -

    415 天健身挑戰

    -

    7/13 李宰鎮生日這天，自發性展開為期 415 天的每日健身計畫。也因為知道李宰鎮、張水院都有重訓健身的習慣，這條「水晶健身重訓」的自我要求就更沒有鬆懈的理由。

    -
    - 健身重訓行事曆 -
    -
    +
    +

    415 天健身挑戰

    +

    7/13 李宰鎮生日這天，自發性展開為期 415 天的每日健身計畫。也因為知道李宰鎮、張水院都有重訓健身的習慣，這條「水晶健身重訓」的自我要求就更沒有鬆懈的理由。

    +
    + 健身重訓行事曆 +
    +
    -
    -

    全端開發與推廣

    -

    不再只是感嘆導師與他人的才華。我正運用包裝設計與全端開發的積累，親手搭建這個數位平台，證明追星是讓我「變厲害」的軍功章。

    -
    +
    +

    全端開發與推廣

    +

    不再只是感嘆導師與他人的才華。我正運用包裝設計與全端開發的積累，親手搭建這個數位平台，證明追星是讓我「變厲害」的軍功章。

    +
@@ -126,4 +130,4 @@ - + \ No newline at end of file