新增小黃文章典藏頁，收錄第一篇 PTT 轉錄文章
This commit is contained in:
@@ -0,0 +1,51 @@
|
|||||||
|
/* yellow-note/fan-articles.html：小黃文章典藏頁面專屬版型 */
|
||||||
|
|
||||||
|
.fan-articles-intro {
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-articles-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 1.5rem;
|
||||||
|
max-width: 42rem;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card__meta {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 0.82rem;
|
||||||
|
color: #9a9a9a;
|
||||||
|
letter-spacing: 0.5px;
|
||||||
|
margin-bottom: 0.6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card__board {
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--color-brand-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card__title {
|
||||||
|
margin: 0 0 0.3rem;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
color: #2e2e2e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card__author {
|
||||||
|
margin: 0 0 0.8rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
color: #7e7e7e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card p:not(.fan-article-card__author) {
|
||||||
|
color: #4a4a4a;
|
||||||
|
line-height: 1.75;
|
||||||
|
margin: 0 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fan-article-card p:last-of-type {
|
||||||
|
margin-bottom: 1.2rem;
|
||||||
|
}
|
||||||
@@ -286,6 +286,7 @@
|
|||||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/minister.html"><span class="portal-nav__label">視覺進化論</span></a></li>
|
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/minister.html"><span class="portal-nav__label">視覺進化論</span></a></li>
|
||||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/map.html"><span class="portal-nav__label">聖地巡禮</span></a></li>
|
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/map.html"><span class="portal-nav__label">聖地巡禮</span></a></li>
|
||||||
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/practice-room.html"><span class="portal-nav__label">小黃練習室</span></a></li>
|
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/practice-room.html"><span class="portal-nav__label">小黃練習室</span></a></li>
|
||||||
|
<li><a target="_blank" rel="noopener noreferrer" href="${rp}yellow-note/fan-articles.html"><span class="portal-nav__label">小黃文章典藏</span></a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@@ -144,6 +144,9 @@
|
|||||||
<li data-site-guide-depth="2">
|
<li data-site-guide-depth="2">
|
||||||
<span class="sg-node"><a href="../yellow-note/practice-room.html">小黃練習室</a></span>
|
<span class="sg-node"><a href="../yellow-note/practice-room.html">小黃練習室</a></span>
|
||||||
</li>
|
</li>
|
||||||
|
<li data-site-guide-depth="2">
|
||||||
|
<span class="sg-node"><a href="../yellow-note/fan-articles.html">小黃文章典藏</a></span>
|
||||||
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
<li data-site-guide-depth="1">
|
<li data-site-guide-depth="1">
|
||||||
|
|||||||
@@ -0,0 +1,66 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="zh-TW">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>SECHSKIES｜小黃文章典藏</title>
|
||||||
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
|
<link rel="stylesheet" href="../assets/css/fan-articles.css">
|
||||||
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||||
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="fan-articles-page">
|
||||||
|
<header class="inner-page-header">
|
||||||
|
<div class="header-inner site-header-inner">
|
||||||
|
<h1 class="main-title">小黃文章典藏</h1>
|
||||||
|
<div class="subtitle-wrap">
|
||||||
|
<span class="sub-title">FAN WRITING ARCHIVE</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||||
|
|
||||||
|
<canvas id="particles"></canvas>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
|
||||||
|
<p class="section-copy fan-articles-intro">
|
||||||
|
散落在各個論壇與社群裡的小黃手記，是站主陸續挖出來的珍貴紀錄。這裡收錄摘要與原文連結，向每一位曾經認真寫下這些文字的小黃致意。
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div class="fan-articles-list">
|
||||||
|
<article class="card fan-article-card">
|
||||||
|
<div class="fan-article-card__meta">
|
||||||
|
<span class="fan-article-card__board">PTT KoreaStar</span>
|
||||||
|
<span class="fan-article-card__date">2016.05.09</span>
|
||||||
|
</div>
|
||||||
|
<h2 class="fan-article-card__title">讓人變廢人的水晶男孩</h2>
|
||||||
|
<p class="fan-article-card__author">l711470（nao）</p>
|
||||||
|
<p>
|
||||||
|
回歸浪潮剛掀起時的深度長文：從 DSP 娛樂當年「專輯只賣 50 萬張」的解散說法談起，逐一點評六人各自的魅力——隊長殷志源的領導力、張水院的獨特氣質、李宰鎮的四次元思維、隱藏成員高志溶的溫暖、主唱姜成勳的顏值歌聲、金在德的忠誠，並向《無限挑戰》讓水晶男孩重回舞台致謝。
|
||||||
|
</p>
|
||||||
|
<a href="https://www.ptt.cc/bbs/KoreaStar/M.1462808417.A.424.html" class="story-external-inline"
|
||||||
|
target="_blank" rel="noopener noreferrer">
|
||||||
|
<span class="story-external-inline__label">閱讀原文</span>
|
||||||
|
<i class="fa-solid fa-arrow-up-right-from-square" aria-hidden="true"></i>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||||
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||||
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||||
|
</a>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script src="../assets/js/particles.js"></script>
|
||||||
|
<script src="../assets/js/portal-nav.js"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
Reference in New Issue
Block a user