Normalize line endings
This commit is contained in:
@@ -1,26 +0,0 @@
|
|||||||
---
|
|
||||||
description: 當使用者完成程式碼修改、改檔任務後，必須強制執行的結尾規範。
|
|
||||||
globs: "*"
|
|
||||||
alwaysApply: true
|
|
||||||
---
|
|
||||||
|
|
||||||
# Git commit 訊息絕對規範
|
|
||||||
|
|
||||||
只要本次對話中**有任何改檔、寫 Code、生成程式碼、調整結構的任務完成**，你（AI）在回覆結尾**必須、強制、主動**附上 commit 指令，絕對不准等使用者開口要！
|
|
||||||
|
|
||||||
> ⚠️ **死線警告**：若本次對話完全沒有改動任何檔案、純屬聊天或觀念問答，則「不必」附上。
|
|
||||||
|
|
||||||
**禁止**為了附 commit 而跑 `git status`／`git diff`／`git log`；只貼指令，由站主在本機執行。
|
|
||||||
|
|
||||||
### 輸出格式（一字不差）：
|
|
||||||
|
|
||||||
```bash
|
|
||||||
git add .
|
|
||||||
git commit -m "type: 重點"
|
|
||||||
```
|
|
||||||
|
|
||||||
| 項目 | 約定 |
|
|
||||||
|------|------|
|
|
||||||
| type | `feat`｜`fix`｜`style` 三選一 |
|
|
||||||
| 重點 | **15 字以內**（標點計入） |
|
|
||||||
| add | **一律 `git add .`**，禁止只 add 單檔 |
|
|
||||||
+150
-150
@@ -1,150 +1,150 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="zh-TW">
|
<html lang="zh-TW">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>水晶男孩｜黃色留聲機</title>
|
<title>水晶男孩｜黃色留聲機</title>
|
||||||
<link rel="stylesheet" href="../assets/css/style.css">
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
<link rel="stylesheet" href="../assets/css/index.css">
|
<link rel="stylesheet" href="../assets/css/index.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.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">
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<header class="inner-page-header">
|
<header class="inner-page-header">
|
||||||
<div class="header-inner site-header-inner">
|
<div class="header-inner site-header-inner">
|
||||||
<h1 class="main-title">黃色留聲機</h1>
|
<h1 class="main-title">黃色留聲機</h1>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">YELLOW PHONOGRAPH</span>
|
<span class="sub-title">YELLOW PHONOGRAPH</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||||
|
|
||||||
<canvas id="particles"></canvas>
|
<canvas id="particles"></canvas>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<section class="archive-intro" aria-label="導語">
|
<section class="archive-intro" aria-label="導語">
|
||||||
<p class="intro-text archive-intro-lead">
|
<p class="intro-text archive-intro-lead">
|
||||||
音軌才是與這個名字最直白相遇的方式——以下先收精選年表與深水連結。
|
音軌才是與這個名字最直白相遇的方式——以下先收精選年表與深水連結。
|
||||||
</p>
|
</p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="new" class="archive-block">
|
<section id="new" class="archive-block">
|
||||||
<h2 class="section-title">啟動新篇章</h2>
|
<h2 class="section-title">啟動新篇章</h2>
|
||||||
<p>回歸後的數位單曲與專輯，是現在進行式的聲紋紀錄；耳機調大聲一格，就能把「新篇章」接住。</p>
|
<p>回歸後的數位單曲與專輯，是現在進行式的聲紋紀錄；耳機調大聲一格，就能把「新篇章」接住。</p>
|
||||||
<p><a href="../extra/lyrics.html">聽見歌詞細節（2016 代表曲目）</a></p>
|
<p><a href="../extra/lyrics.html">聽見歌詞細節（2016 代表曲目）</a></p>
|
||||||
<table class="archive-discography">
|
<table class="archive-discography">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col">封面</th>
|
<th scope="col">封面</th>
|
||||||
<th scope="col">年份</th>
|
<th scope="col">年份</th>
|
||||||
<th scope="col">專輯／作品</th>
|
<th scope="col">專輯／作品</th>
|
||||||
<th scope="col">主打歌</th>
|
<th scope="col">主打歌</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/1Dijv8G0wnCN8PzFZoC8bN"
|
data-spotify-url="https://open.spotify.com/album/1Dijv8G0wnCN8PzFZoC8bN"
|
||||||
aria-label="在 Spotify 開啟：THREE WORDS（2016 數位單曲）">
|
aria-label="在 Spotify 開啟：THREE WORDS（2016 數位單曲）">
|
||||||
<td class="album-cover-cell">
|
<td class="album-cover-cell">
|
||||||
<img src="../assets/images/albums/2016.jpg" width="76" height="76" alt="2016 數位單曲 封面">
|
<img src="../assets/images/albums/2016.jpg" width="76" height="76" alt="2016 數位單曲 封面">
|
||||||
</td>
|
</td>
|
||||||
<td>2016</td>
|
<td>2016</td>
|
||||||
<td><a href="../extra/lyrics.html">數位單曲</a></td>
|
<td><a href="../extra/lyrics.html">數位單曲</a></td>
|
||||||
<td><a href="../extra/lyrics.html">Three Words (三個詞)</a></td>
|
<td><a href="../extra/lyrics.html">Three Words (三個詞)</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/5f2LzIFxljQF4FH7w3rXcQ"
|
data-spotify-url="https://open.spotify.com/album/5f2LzIFxljQF4FH7w3rXcQ"
|
||||||
aria-label="在 Spotify 開啟：ANOTHER LIGHT">
|
aria-label="在 Spotify 開啟：ANOTHER LIGHT">
|
||||||
<td class="album-cover-cell">
|
<td class="album-cover-cell">
|
||||||
<img src="../assets/images/albums/2017.jpg" width="76" height="76" alt="2017 ANOTHER LIGHT 封面">
|
<img src="../assets/images/albums/2017.jpg" width="76" height="76" alt="2017 ANOTHER LIGHT 封面">
|
||||||
</td>
|
</td>
|
||||||
<td>2017</td>
|
<td>2017</td>
|
||||||
<td><a href="../concert/concert.html#stage-now">ANOTHER LIGHT</a></td>
|
<td><a href="../concert/concert.html#stage-now">ANOTHER LIGHT</a></td>
|
||||||
<td><a href="../concert/concert.html#stage-now">Something Special / Smile</a></td>
|
<td><a href="../concert/concert.html#stage-now">Something Special / Smile</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/7vqIRL00YfTtuO0sSAK3Uv"
|
data-spotify-url="https://open.spotify.com/album/7vqIRL00YfTtuO0sSAK3Uv"
|
||||||
aria-label="在 Spotify 開啟：ALL FOR YOU">
|
aria-label="在 Spotify 開啟：ALL FOR YOU">
|
||||||
<td class="album-cover-cell">
|
<td class="album-cover-cell">
|
||||||
<img src="../assets/images/albums/2020.jpg" width="76" height="76" alt="2020 ALL FOR YOU 封面">
|
<img src="../assets/images/albums/2020.jpg" width="76" height="76" alt="2020 ALL FOR YOU 封面">
|
||||||
</td>
|
</td>
|
||||||
<td>2020</td>
|
<td>2020</td>
|
||||||
<td><a href="../concert/concert.html#stage-now">ALL FOR YOU</a></td>
|
<td><a href="../concert/concert.html#stage-now">ALL FOR YOU</a></td>
|
||||||
<td><a href="../concert/concert.html#stage-now">ALL FOR YOU</a></td>
|
<td><a href="../concert/concert.html#stage-now">ALL FOR YOU</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="classic" class="archive-block">
|
<section id="classic" class="archive-block">
|
||||||
<h2 class="section-title">輝煌全盛期</h2>
|
<h2 class="section-title">輝煌全盛期</h2>
|
||||||
<p>主打的記憶點、b-side 的伏筆、舞步與應援口號——想一次收進收藏庫，往這張整理頁走。</p>
|
<p>主打的記憶點、b-side 的伏筆、舞步與應援口號——想一次收進收藏庫，往這張整理頁走。</p>
|
||||||
<p><a href="#classic">於此區瀏覽輝煌全盛期年表</a></p>
|
<p><a href="#classic">於此區瀏覽輝煌全盛期年表</a></p>
|
||||||
<table class="archive-discography">
|
<table class="archive-discography">
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col">年份</th>
|
<th scope="col">年份</th>
|
||||||
<th scope="col">專輯／作品</th>
|
<th scope="col">專輯／作品</th>
|
||||||
<th scope="col">主打歌</th>
|
<th scope="col">主打歌</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/18P1aqSLQA9WdNljjEhv9q"
|
data-spotify-url="https://open.spotify.com/album/18P1aqSLQA9WdNljjEhv9q"
|
||||||
aria-label="在 Spotify 開啟：School Byeolgok（學園別曲）">
|
aria-label="在 Spotify 開啟：School Byeolgok（學園別曲）">
|
||||||
<td>1997</td>
|
<td>1997</td>
|
||||||
<td><a href="#classic">學園別曲</a></td>
|
<td><a href="#classic">學園別曲</a></td>
|
||||||
<td><a href="#classic">學園別曲 / 男兒之路 (Pom Saeng Pom Sa)</a></td>
|
<td><a href="#classic">學園別曲 / 男兒之路 (Pom Saeng Pom Sa)</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/08TW1bmGzSg172Db8C2Bde"
|
data-spotify-url="https://open.spotify.com/album/08TW1bmGzSg172Db8C2Bde"
|
||||||
aria-label="在 Spotify 開啟：Road Fighter">
|
aria-label="在 Spotify 開啟：Road Fighter">
|
||||||
<td>1998</td>
|
<td>1998</td>
|
||||||
<td><a href="#classic">Road Fighter</a></td>
|
<td><a href="#classic">Road Fighter</a></td>
|
||||||
<td><a href="#classic">Road Fighter / Couple</a></td>
|
<td><a href="#classic">Road Fighter / Couple</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr class="archive-row-spotify" tabindex="0"
|
<tr class="archive-row-spotify" tabindex="0"
|
||||||
data-spotify-url="https://open.spotify.com/album/3XWtqLXDZycu7Q0BGofhiq"
|
data-spotify-url="https://open.spotify.com/album/3XWtqLXDZycu7Q0BGofhiq"
|
||||||
aria-label="在 Spotify 開啟：Com' Back">
|
aria-label="在 Spotify 開啟：Com' Back">
|
||||||
<td>1999</td>
|
<td>1999</td>
|
||||||
<td><a href="#classic">Com'Back</a></td>
|
<td><a href="#classic">Com'Back</a></td>
|
||||||
<td><a href="#classic">Com'Back</a></td>
|
<td><a href="#classic">Com'Back</a></td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||||
</a>
|
</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="../assets/js/particles.js"></script>
|
<script src="../assets/js/particles.js"></script>
|
||||||
<script src="../assets/js/portal-nav.js"></script>
|
<script src="../assets/js/portal-nav.js"></script>
|
||||||
<script>
|
<script>
|
||||||
(function () {
|
(function () {
|
||||||
document.querySelectorAll('tr.archive-row-spotify[data-spotify-url]').forEach(function (row) {
|
document.querySelectorAll('tr.archive-row-spotify[data-spotify-url]').forEach(function (row) {
|
||||||
var url = row.getAttribute('data-spotify-url');
|
var url = row.getAttribute('data-spotify-url');
|
||||||
row.addEventListener('click', function (e) {
|
row.addEventListener('click', function (e) {
|
||||||
if (e.target.closest('a')) return;
|
if (e.target.closest('a')) return;
|
||||||
window.open(url, '_blank', 'noopener,noreferrer');
|
window.open(url, '_blank', 'noopener,noreferrer');
|
||||||
});
|
});
|
||||||
row.addEventListener('keydown', function (e) {
|
row.addEventListener('keydown', function (e) {
|
||||||
if (e.key !== 'Enter' && e.key !== ' ') return;
|
if (e.key !== 'Enter' && e.key !== ' ') return;
|
||||||
if (e.target.closest('a')) return;
|
if (e.target.closest('a')) return;
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
window.open(url, '_blank', 'noopener,noreferrer');
|
window.open(url, '_blank', 'noopener,noreferrer');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
})();
|
})();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -1,47 +1,47 @@
|
|||||||
<?xml version="1.0" encoding="iso-8859-1"?>
|
<?xml version="1.0" encoding="iso-8859-1"?>
|
||||||
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||||
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
|
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
|
||||||
<g>
|
<g>
|
||||||
<g>
|
<g>
|
||||||
<path d="M389.12,133.12C389.12,59.72,329.4,0,256,0S122.88,59.72,122.88,133.12c0,75.08,64.532,151.122,112.763,169.718
|
<path d="M389.12,133.12C389.12,59.72,329.4,0,256,0S122.88,59.72,122.88,133.12c0,75.08,64.532,151.122,112.763,169.718
|
||||||
l-7.373,7.352c-2.908,2.929-3.789,7.352-2.212,11.162c1.577,3.83,5.325,6.328,9.462,6.328h13.66
|
l-7.373,7.352c-2.908,2.929-3.789,7.352-2.212,11.162c1.577,3.83,5.325,6.328,9.462,6.328h13.66
|
||||||
c30.577,72.95,14.438,89.743-7.885,112.538c-13.701,14.008-29.225,29.86-36.209,59.167c-1.331,5.489,2.068,11.018,7.578,12.329
|
c30.577,72.95,14.438,89.743-7.885,112.538c-13.701,14.008-29.225,29.86-36.209,59.167c-1.331,5.489,2.068,11.018,7.578,12.329
|
||||||
c0.799,0.205,1.597,0.287,2.376,0.287c4.649,0,8.847-3.154,9.953-7.864c5.693-23.777,18.534-36.905,30.945-49.582
|
c0.799,0.205,1.597,0.287,2.376,0.287c4.649,0,8.847-3.154,9.953-7.864c5.693-23.777,18.534-36.905,30.945-49.582
|
||||||
c27.955-28.57,44.38-53.494,15.401-126.874h5.141c4.137,0,7.885-2.499,9.462-6.328c1.577-3.809,0.696-8.233-2.212-11.162
|
c27.955-28.57,44.38-53.494,15.401-126.874h5.141c4.137,0,7.885-2.499,9.462-6.328c1.577-3.809,0.696-8.233-2.212-11.162
|
||||||
l-7.373-7.352C324.588,284.242,389.12,208.2,389.12,133.12z M256,61.44c-39.526,0-71.68,32.154-71.68,71.68
|
l-7.373-7.352C324.588,284.242,389.12,208.2,389.12,133.12z M256,61.44c-39.526,0-71.68,32.154-71.68,71.68
|
||||||
c0,5.652-4.588,10.24-10.24,10.24c-5.653,0-10.24-4.588-10.24-10.24c0-50.811,41.349-92.16,92.16-92.16
|
c0,5.652-4.588,10.24-10.24,10.24c-5.653,0-10.24-4.588-10.24-10.24c0-50.811,41.349-92.16,92.16-92.16
|
||||||
c5.652,0,10.24,4.588,10.24,10.24S261.652,61.44,256,61.44z"/>
|
c5.652,0,10.24,4.588,10.24,10.24S261.652,61.44,256,61.44z"/>
|
||||||
</g>
|
</g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
<g>
|
<g>
|
||||||
</g>
|
</g>
|
||||||
</svg>
|
</svg>
|
||||||
|
|||||||
|
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.3 KiB |
@@ -19,21 +19,6 @@ alwaysApply: true
|
|||||||
|
|
||||||
- 內頁：**`header.inner-page-header`**。首頁 Hero：**`header#origin`**。樣式以站主在電子書頁調過的為準；要套他頁須站主說執行。
|
- 內頁：**`header.inner-page-header`**。首頁 Hero：**`header#origin`**。樣式以站主在電子書頁調過的為準；要套他頁須站主說執行。
|
||||||
|
|
||||||
## Git：改完末尾附 commit
|
|
||||||
|
|
||||||
見 **`git-commit-required.mdc`**（格式、死線、禁止為 commit 跑終端機檢查）。
|
|
||||||
|
|
||||||
## Git：禁止擅自 push
|
|
||||||
|
|
||||||
- **禁止 `git push`**，除非站主原句「幫我 push」等。只貼 push 錯誤 ≠ 同意 push。
|
|
||||||
- 修 push 失敗：只動本機（壓圖、`.gitignore`、`amend`／filter-branch **先問**），末尾只給站主：
|
|
||||||
|
|
||||||
```bash
|
|
||||||
git push origin main
|
|
||||||
```
|
|
||||||
|
|
||||||
- GitHub 單檔 **> 100 MB** 拒 push。`*.png.bak` 已在根 `.gitignore`，勿 `git add .` 送進備份檔。
|
|
||||||
|
|
||||||
## 回覆
|
## 回覆
|
||||||
|
|
||||||
- 站主要短句時：先答做沒做、為什麼壞，勿長篇道歉後又擅自改一輪。
|
- 站主要短句時：先答做沒做、為什麼壞，勿長篇道歉後又擅自改一輪。
|
||||||
+1
-1
@@ -43,5 +43,5 @@ alwaysApply: true
|
|||||||
## 文件與規則檔
|
## 文件與規則檔
|
||||||
|
|
||||||
- **不要**主動新增或長篇修改 `README`、`docs/*.md`，除非站主明講。
|
- **不要**主動新增或長篇修改 `README`、`docs/*.md`，除非站主明講。
|
||||||
- **約定只寫在** `.cursor/rules/*.mdc`（**合併進既有檔**，勿再新增散落 `*-notes.md`／目錄索引）。禁止放在 `docs/` 或站主日常會開的目錄。
|
- **約定只寫在** `developer-rules/rules/*.mdc`（**合併進既有檔**，勿再新增散落 `*-notes.md`／目錄索引）。禁止放在 `docs/` 或站主日常會開的目錄。
|
||||||
- 動導覽／籌備中／`site-guide`：**只讀** `portal-nav-rules.mdc`。
|
- 動導覽／籌備中／`site-guide`：**只讀** `portal-nav-rules.mdc`。
|
||||||
@@ -0,0 +1,39 @@
|
|||||||
|
---
|
||||||
|
description: 改檔後的 commit 規範、push 禁令與本機修復流程。
|
||||||
|
globs: "*"
|
||||||
|
alwaysApply: true
|
||||||
|
---
|
||||||
|
|
||||||
|
# Git 規範（commit・push）
|
||||||
|
|
||||||
|
## Commit：改完必附
|
||||||
|
|
||||||
|
只要本次對話中**有任何改檔、寫 Code、生成程式碼、調整結構的任務完成**，在回覆結尾**必須、強制、主動**附上 commit 指令，絕對不准等使用者開口要！
|
||||||
|
|
||||||
|
> ⚠️ **死線警告**：若本次對話完全沒有改動任何檔案、純屬聊天或觀念問答，則「不必」附上。
|
||||||
|
|
||||||
|
**禁止**為了附 commit 而跑 `git status`／`git diff`／`git log`；只貼指令，由站主在本機執行。
|
||||||
|
|
||||||
|
### 輸出格式（一字不差）：
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git add .
|
||||||
|
git commit -m "type: 重點"
|
||||||
|
```
|
||||||
|
|
||||||
|
| 項目 | 約定 |
|
||||||
|
|------|------|
|
||||||
|
| type | `feat`｜`fix`｜`style` 三選一 |
|
||||||
|
| 重點 | **15 字以內**（標點計入） |
|
||||||
|
| add | **一律 `git add .`**，禁止只 add 單檔 |
|
||||||
|
|
||||||
|
## Push：禁止擅自執行
|
||||||
|
|
||||||
|
- **禁止 `git push`**，除非站主原句說「幫我 push」等。只貼 push 錯誤 ≠ 同意 push。
|
||||||
|
- 修 push 失敗：只動本機（壓圖、`.gitignore`、`amend`／filter-branch **先問**），末尾只給站主：
|
||||||
|
|
||||||
|
```bash
|
||||||
|
git push origin main
|
||||||
|
```
|
||||||
|
|
||||||
|
- GitHub 單檔 **> 100 MB** 拒 push。`*.png.bak` 已在根 `.gitignore` 保護，`git add .` 不會送進備份檔。
|
||||||
+189
-189
@@ -1,190 +1,190 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="zh-TW">
|
<html lang="zh-TW">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>水晶男孩 SECHSKIES | 永恆的六顆水晶</title>
|
<title>水晶男孩 SECHSKIES | 永恆的六顆水晶</title>
|
||||||
|
|
||||||
<link rel="stylesheet" href="../assets/css/style.css">
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.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">
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<!-- 英雄區 -->
|
<!-- 英雄區 -->
|
||||||
<header>
|
<header>
|
||||||
<canvas id="particles"></canvas>
|
<canvas id="particles"></canvas>
|
||||||
<div class="hero">
|
<div class="hero">
|
||||||
<h1>SECHSKIES<br>水晶男孩</h1>
|
<h1>SECHSKIES<br>水晶男孩</h1>
|
||||||
<p>六顆永恆的水晶 · 左右命運的傳奇</p>
|
<p>六顆永恆的水晶 · 左右命運的傳奇</p>
|
||||||
<a href="#story" class="btn">探索他們的故事</a>
|
<a href="#story" class="btn">探索他們的故事</a>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<!-- 故事背景 -->
|
<!-- 故事背景 -->
|
||||||
<section id="story">
|
<section id="story">
|
||||||
<h2>故事背景</h2>
|
<h2>故事背景</h2>
|
||||||
<div class="story-grid">
|
<div class="story-grid">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h3>出道與巔峰（1997-2000）</h3>
|
<h3>出道與巔峰（1997-2000）</h3>
|
||||||
<p>1997年4月15日，水晶男孩以《學園別曲》正式出道，是韓國第一代偶像團體，與H.O.T.並稱為90年代後期兩大山脈。團名源自德語「六顆水晶」，象徵六位成員能左右命運。</p>
|
<p>1997年4月15日，水晶男孩以《學園別曲》正式出道，是韓國第一代偶像團體，與H.O.T.並稱為90年代後期兩大山脈。團名源自德語「六顆水晶」，象徵六位成員能左右命運。</p>
|
||||||
<p>分為「黑水晶」（殷志源、李宰鎮、金在德 — Rap與舞蹈）和「白水晶」（姜成勳、高志溶、張水院 — 主唱）。</p>
|
<p>分為「黑水晶」（殷志源、李宰鎮、金在德 — Rap與舞蹈）和「白水晶」（姜成勳、高志溶、張水院 — 主唱）。</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h3>解散與重逢（2000-2016）</h3>
|
<h3>解散與重逢（2000-2016）</h3>
|
||||||
<p>2000年5月20日正式解散，成員各自發展。2016年4月14日，時隔16年在《無限挑戰》「六六歌」特輯驚喜合體，引起巨大迴響。</p>
|
<p>2000年5月20日正式解散，成員各自發展。2016年4月14日，時隔16年在《無限挑戰》「六六歌」特輯驚喜合體，引起巨大迴響。</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h3>YG時期與現在</h3>
|
<h3>YG時期與現在</h3>
|
||||||
<p>2016年5月，除高志溶外五人與YG娛樂簽約重啟活動。2019年起調整為四人組合（殷志源、李宰鎮、金在德、張水院），繼續以經典魅力感動粉絲。</p>
|
<p>2016年5月，除高志溶外五人與YG娛樂簽約重啟活動。2019年起調整為四人組合（殷志源、李宰鎮、金在德、張水院），繼續以經典魅力感動粉絲。</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- 成員介紹 -->
|
<!-- 成員介紹 -->
|
||||||
<section id="members">
|
<section id="members">
|
||||||
<h2>六位永恆成員</h2>
|
<h2>六位永恆成員</h2>
|
||||||
<div class="members-grid">
|
<div class="members-grid">
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="../assets/images/Eun Ji Won.jpeg" alt="殷志源">
|
<img src="../assets/images/Eun Ji Won.jpeg" alt="殷志源">
|
||||||
<h3>殷志源 (Eun Ji Won)</h3>
|
<h3>殷志源 (Eun Ji Won)</h3>
|
||||||
<p>Leader • Rap • Black Kies</p>
|
<p>Leader • Rap • Black Kies</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=李宰鎮" alt="李宰鎮">
|
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=李宰鎮" alt="李宰鎮">
|
||||||
<h3>李宰鎮 (Lee Jae Jin)</h3>
|
<h3>李宰鎮 (Lee Jae Jin)</h3>
|
||||||
<p>Rap • Dance • Black Kies</p>
|
<p>Rap • Dance • Black Kies</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=金在德" alt="金在德">
|
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=金在德" alt="金在德">
|
||||||
<h3>金在德 (Kim Jae Duc)</h3>
|
<h3>金在德 (Kim Jae Duc)</h3>
|
||||||
<p>Rap • Dance • Black Kies</p>
|
<p>Rap • Dance • Black Kies</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=姜成勳" alt="姜成勳">
|
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=姜成勳" alt="姜成勳">
|
||||||
<h3>姜成勳 (Kang Sung Hoon)</h3>
|
<h3>姜成勳 (Kang Sung Hoon)</h3>
|
||||||
<p>Main Vocal • White Kies</p>
|
<p>Main Vocal • White Kies</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=高志溶" alt="高志溶">
|
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=高志溶" alt="高志溶">
|
||||||
<h3>高志溶 (Ko Ji Yong)</h3>
|
<h3>高志溶 (Ko Ji Yong)</h3>
|
||||||
<p>Vocal • White Kies</p>
|
<p>Vocal • White Kies</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="member">
|
<div class="member">
|
||||||
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=張水院" alt="張水院">
|
<img src="https://via.placeholder.com/300x400/FFDD00/000?text=張水院" alt="張水院">
|
||||||
<h3>張水院 (Jang Su Won)</h3>
|
<h3>張水院 (Jang Su Won)</h3>
|
||||||
<p>Vocal • White Kies</p>
|
<p>Vocal • White Kies</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- 歷年作品（與首頁跨時空軌跡相同：merged-storyline） -->
|
<!-- 歷年作品（與首頁跨時空軌跡相同：merged-storyline） -->
|
||||||
<section id="discography" class="story-archive">
|
<section id="discography" class="story-archive">
|
||||||
<h2 class="section-title">歷年主要作品</h2>
|
<h2 class="section-title">歷年主要作品</h2>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">MAIN RELEASES</span>
|
<span class="sub-title">MAIN RELEASES</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="merged-storyline">
|
<div class="merged-storyline">
|
||||||
<article class="story-node" data-era="1997">
|
<article class="story-node" data-era="1997">
|
||||||
<h3>《學園別曲》出道</h3>
|
<h3>《學園別曲》出道</h3>
|
||||||
<p>出道專輯，主打〈學園別曲〉、〈사랑하는 너에게〉</p>
|
<p>出道專輯，主打〈學園別曲〉、〈사랑하는 너에게〉</p>
|
||||||
<h3>《Welcome To The Sechskies Land》</h3>
|
<h3>《Welcome To The Sechskies Land》</h3>
|
||||||
<p>第二張專輯，拿下多個一位</p>
|
<p>第二張專輯，拿下多個一位</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="1998">
|
<article class="story-node" data-era="1998">
|
||||||
<h3>《Road Fighter》</h3>
|
<h3>《Road Fighter》</h3>
|
||||||
<p>第三張專輯，經典舞曲代表作</p>
|
<p>第三張專輯，經典舞曲代表作</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="1999">
|
<article class="story-node" data-era="1999">
|
||||||
<h3>《Com' Back》</h3>
|
<h3>《Com' Back》</h3>
|
||||||
<p>第四張專輯，主打〈Com' Back〉</p>
|
<p>第四張專輯，主打〈Com' Back〉</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2016">
|
<article class="story-node" data-era="2016">
|
||||||
<h3>《2016 Re-ALBUM》與《THREE WORDS》</h3>
|
<h3>《2016 Re-ALBUM》與《THREE WORDS》</h3>
|
||||||
<p>重啟後首支單曲與重製專輯</p>
|
<p>重啟後首支單曲與重製專輯</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2017">
|
<article class="story-node" data-era="2017">
|
||||||
<h3>《ANOTHER LIGHT》</h3>
|
<h3>《ANOTHER LIGHT》</h3>
|
||||||
<p>第五張正規專輯</p>
|
<p>第五張正規專輯</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2021">
|
<article class="story-node" data-era="2021">
|
||||||
<h3>《DON'T LOOK BACK》</h3>
|
<h3>《DON'T LOOK BACK》</h3>
|
||||||
<p>近期重要專輯</p>
|
<p>近期重要專輯</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<!-- 現在的故事線 -->
|
<!-- 現在的故事線 -->
|
||||||
<section id="now">
|
<section id="now">
|
||||||
<h2>現在的故事線</h2>
|
<h2>現在的故事線</h2>
|
||||||
<div class="now-content">
|
<div class="now-content">
|
||||||
<p>2019年後，水晶男孩以四人組合（殷志源、李宰鎮、金在德、張水院）繼續活動。雖然回歸頻率不高，但每一次舞台與演唱會依然充滿90年代的經典魅力與深厚情感。</p>
|
<p>2019年後，水晶男孩以四人組合（殷志源、李宰鎮、金在德、張水院）繼續活動。雖然回歸頻率不高，但每一次舞台與演唱會依然充滿90年代的經典魅力與深厚情感。</p>
|
||||||
<p>官方應援色 <span class="mark_b">黃色</span> 與粉絲名 <span class="mark_b">YELLOWKIES</span> 依然是他們最堅強的後盾。</p>
|
<p>官方應援色 <span class="mark_b">黃色</span> 與粉絲名 <span class="mark_b">YELLOWKIES</span> 依然是他們最堅強的後盾。</p>
|
||||||
<p>無論時間過去多久，這六顆水晶永遠閃耀在韓流歷史的天空。</p>
|
<p>無論時間過去多久，這六顆水晶永遠閃耀在韓流歷史的天空。</p>
|
||||||
<br>
|
<br>
|
||||||
<p style="font-size:1.4rem; color:var(--yellow);">「謝謝你們一直陪伴，我們還在這裡。」</p>
|
<p style="font-size:1.4rem; color:var(--yellow);">「謝謝你們一直陪伴，我們還在這裡。」</p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<p>© 2026 水晶男孩 SECHSKIES 粉絲致敬網頁 | 應援色：黃色 • YELLOWKIES Forever</p>
|
<p>© 2026 水晶男孩 SECHSKIES 粉絲致敬網頁 | 應援色：黃色 • YELLOWKIES Forever</p>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<!-- 簡單粒子效果（黃色水晶粒子） -->
|
<!-- 簡單粒子效果（黃色水晶粒子） -->
|
||||||
<script>
|
<script>
|
||||||
const canvas = document.getElementById('particles');
|
const canvas = document.getElementById('particles');
|
||||||
const ctx = canvas.getContext('2d');
|
const ctx = canvas.getContext('2d');
|
||||||
canvas.width = window.innerWidth;
|
canvas.width = window.innerWidth;
|
||||||
canvas.height = window.innerHeight;
|
canvas.height = window.innerHeight;
|
||||||
|
|
||||||
let particles = [];
|
let particles = [];
|
||||||
class Particle {
|
class Particle {
|
||||||
constructor() {
|
constructor() {
|
||||||
this.x = Math.random() * canvas.width;
|
this.x = Math.random() * canvas.width;
|
||||||
this.y = Math.random() * canvas.height;
|
this.y = Math.random() * canvas.height;
|
||||||
this.size = Math.random() * 4 + 1;
|
this.size = Math.random() * 4 + 1;
|
||||||
this.speedX = Math.random() * 0.5 - 0.25;
|
this.speedX = Math.random() * 0.5 - 0.25;
|
||||||
this.speedY = Math.random() * 0.5 + 0.2;
|
this.speedY = Math.random() * 0.5 + 0.2;
|
||||||
}
|
}
|
||||||
update() {
|
update() {
|
||||||
this.x += this.speedX;
|
this.x += this.speedX;
|
||||||
this.y += this.speedY;
|
this.y += this.speedY;
|
||||||
if (this.y > canvas.height) this.y = 0;
|
if (this.y > canvas.height) this.y = 0;
|
||||||
}
|
}
|
||||||
draw() {
|
draw() {
|
||||||
ctx.fillStyle = '#FFDD00';
|
ctx.fillStyle = '#FFDD00';
|
||||||
ctx.globalAlpha = 0.6;
|
ctx.globalAlpha = 0.6;
|
||||||
ctx.beginPath();
|
ctx.beginPath();
|
||||||
ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
|
ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
|
||||||
ctx.fill();
|
ctx.fill();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function init() {
|
function init() {
|
||||||
particles = [];
|
particles = [];
|
||||||
for (let i = 0; i < 80; i++) {
|
for (let i = 0; i < 80; i++) {
|
||||||
particles.push(new Particle());
|
particles.push(new Particle());
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function animate() {
|
function animate() {
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
||||||
for (let p of particles) {
|
for (let p of particles) {
|
||||||
p.update();
|
p.update();
|
||||||
p.draw();
|
p.draw();
|
||||||
}
|
}
|
||||||
requestAnimationFrame(animate);
|
requestAnimationFrame(animate);
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('resize', () => {
|
window.addEventListener('resize', () => {
|
||||||
canvas.width = window.innerWidth;
|
canvas.width = window.innerWidth;
|
||||||
canvas.height = window.innerHeight;
|
canvas.height = window.innerHeight;
|
||||||
init();
|
init();
|
||||||
});
|
});
|
||||||
|
|
||||||
init();
|
init();
|
||||||
animate();
|
animate();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
+242
-242
@@ -1,243 +1,243 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="zh-TW">
|
<html lang="zh-TW">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>水晶男孩推廣部｜視覺進化論：認真魔人的進化之路</title>
|
<title>水晶男孩推廣部｜視覺進化論：認真魔人的進化之路</title>
|
||||||
<link rel="stylesheet" href="../assets/css/style.css">
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
<link rel="stylesheet" href="../assets/css/index.css">
|
<link rel="stylesheet" href="../assets/css/index.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.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">
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="home-page minister-page">
|
<body class="home-page minister-page">
|
||||||
<header class="inner-page-header">
|
<header class="inner-page-header">
|
||||||
<div class="header-inner site-header-inner">
|
<div class="header-inner site-header-inner">
|
||||||
<h1 class="main-title">視覺進化論</h1>
|
<h1 class="main-title">視覺進化論</h1>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">FROM CURIOSITY TO FULL-STACK</span>
|
<span class="sub-title">FROM CURIOSITY TO FULL-STACK</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||||
|
|
||||||
<canvas id="particles"></canvas>
|
<canvas id="particles"></canvas>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="landing-intro">
|
<div class="landing-intro">
|
||||||
<p>關於我：<span class="mark_b">把水晶置入生活，將熱愛驅動為進化的燃料</span></p>
|
<p>關於我：<span class="mark_b">把水晶置入生活，將熱愛驅動為進化的燃料</span></p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<section id="intro">
|
<section id="intro">
|
||||||
<h2 class="section-title">跨越時空的開端</h2>
|
<h2 class="section-title">跨越時空的開端</h2>
|
||||||
<div class="intro-tags" role="list">
|
<div class="intro-tags" role="list">
|
||||||
<span class="hashtag-chip" role="listitem">#水晶傳教士</span>
|
<span class="hashtag-chip" role="listitem">#水晶傳教士</span>
|
||||||
<span class="hashtag-chip" role="listitem">#認真魔人</span>
|
<span class="hashtag-chip" role="listitem">#認真魔人</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="intro-text">
|
<div class="intro-text">
|
||||||
<p class="intro-text">
|
<p class="intro-text">
|
||||||
這段旅程始於 2016 年 4 月，透過國民綜藝《無限挑戰》六六歌 2 的回歸企劃，讓原本不認識這組傳奇元祖偶像的我，因一時好奇點開節目。當我回頭回溯那段歷史，才發現他們在 2000
|
這段旅程始於 2016 年 4 月，透過國民綜藝《無限挑戰》六六歌 2 的回歸企劃，讓原本不認識這組傳奇元祖偶像的我，因一時好奇點開節目。當我回頭回溯那段歷史，才發現他們在 2000
|
||||||
年巔峰解散時，我還未曾參與過那個屬於他們的世紀末。即便如此，隨著節目的鋪陳，我依然被那份熱血、真誠且專業的魅力所震撼，那些搞笑又感動的內容結束了我原本的低潮期，從此深陷其中。
|
年巔峰解散時，我還未曾參與過那個屬於他們的世紀末。即便如此，隨著節目的鋪陳，我依然被那份熱血、真誠且專業的魅力所震撼，那些搞笑又感動的內容結束了我原本的低潮期，從此深陷其中。
|
||||||
</p>
|
</p>
|
||||||
<div class="slogan-quote slogan-quote--awakening">
|
<div class="slogan-quote slogan-quote--awakening">
|
||||||
<span class="slogan-quote__inner">這不只是追星的開始，更成為我自我覺醒的起點。</span>
|
<span class="slogan-quote__inner">這不只是追星的開始，更成為我自我覺醒的起點。</span>
|
||||||
</div>
|
</div>
|
||||||
<p class="core-description">
|
<p class="core-description">
|
||||||
當年的節目剛播出，無數新粉集體淪陷，紛紛加入了「水晶廢人」的行列。
|
當年的節目剛播出，無數新粉集體淪陷，紛紛加入了「水晶廢人」的行列。
|
||||||
在那段瘋狂的歲月裡，我們像是一群共振的靈魂，我也在這股浪潮中開啟了屬於我的進化之路：
|
在那段瘋狂的歲月裡，我們像是一群共振的靈魂，我也在這股浪潮中開啟了屬於我的進化之路：
|
||||||
身為一名<span
|
身為一名<span
|
||||||
class="mark_b">「水晶傳教士」</span>，我秉持著「飯隨偶像，所以要讓自己變得和他們一樣優秀」的信念，將這份狂熱轉化為跨領域的創作動力。身為熱愛學習新事物的「認真魔人」，我的生活分為旺季與淡季：旺季時為愛進化，挑戰各種專業技能；淡季時則在《動森》認真耍廢半年，甚至組建了「水晶森友會」來獲得另類的成就感。
|
class="mark_b">「水晶傳教士」</span>，我秉持著「飯隨偶像，所以要讓自己變得和他們一樣優秀」的信念，將這份狂熱轉化為跨領域的創作動力。身為熱愛學習新事物的「認真魔人」，我的生活分為旺季與淡季：旺季時為愛進化，挑戰各種專業技能；淡季時則在《動森》認真耍廢半年，甚至組建了「水晶森友會」來獲得另類的成就感。
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="identity">
|
<section id="identity">
|
||||||
<h2 class="section-title">#Identity：為了熱愛而進化的斜槓精神</h2>
|
<h2 class="section-title">#Identity：為了熱愛而進化的斜槓精神</h2>
|
||||||
<div class="intro-text">
|
<div class="intro-text">
|
||||||
<p class="intro-text">這份熱愛，讓我橫跨領域，長成了現在的模樣：</p>
|
<p class="intro-text">這份熱愛，讓我橫跨領域，長成了現在的模樣：</p>
|
||||||
<p class="core-description">
|
<p class="core-description">
|
||||||
<span class="hashtag-chip">#水晶推廣部：視覺即是正義</span>
|
<span class="hashtag-chip">#水晶推廣部：視覺即是正義</span>
|
||||||
身為專業品牌設計師，我堅持「不看醜東西」的職業傲骨。我親自操刀所有視覺輸出，將對偶像的滿腔熱血轉化為專業的品牌策劃，這是對這份熱愛最基本的尊重。
|
身為專業品牌設計師，我堅持「不看醜東西」的職業傲骨。我親自操刀所有視覺輸出，將對偶像的滿腔熱血轉化為專業的品牌策劃，這是對這份熱愛最基本的尊重。
|
||||||
</p>
|
</p>
|
||||||
<p class="core-description">
|
<p class="core-description">
|
||||||
<span class="hashtag-chip">#水晶訓練營：自我提升的最高級</span>
|
<span class="hashtag-chip">#水晶訓練營：自我提升的最高級</span>
|
||||||
為了聽懂歐巴說的每一句話，我開始挑戰韓檢、投身健身、鑽研舞蹈。我用<span class="mark_b">聽力 93 分</span>與<span class="mark_b">增肌減脂
|
為了聽懂歐巴說的每一句話，我開始挑戰韓檢、投身健身、鑽研舞蹈。我用<span class="mark_b">聽力 93 分</span>與<span class="mark_b">增肌減脂
|
||||||
20%</span>
|
20%</span>
|
||||||
的數據證明：追星是推動自我實現最強大的燃料。
|
的數據證明：追星是推動自我實現最強大的燃料。
|
||||||
</p>
|
</p>
|
||||||
<p class="core-description">
|
<p class="core-description">
|
||||||
<span class="hashtag-chip">#全端開發者：技術與藝術的終極交織</span>
|
<span class="hashtag-chip">#全端開發者：技術與藝術的終極交織</span>
|
||||||
我正將多年的設計積累與程式技術縫合，運用數位開發邏輯，搭建一個專屬於這份熱愛的數位平台。這是我為這段十年長跑獻上的最高致敬。
|
我正將多年的設計積累與程式技術縫合，運用數位開發邏輯，搭建一個專屬於這份熱愛的數位平台。這是我為這段十年長跑獻上的最高致敬。
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="evolution" class="story-archive">
|
<section id="evolution" class="story-archive">
|
||||||
<h2 class="section-title">熱愛驅動的職涯轉型</h2>
|
<h2 class="section-title">熱愛驅動的職涯轉型</h2>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">GROWTH TIMELINE</span>
|
<span class="sub-title">GROWTH TIMELINE</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="merged-storyline">
|
<div class="merged-storyline">
|
||||||
<article class="story-node" data-era="語言">
|
<article class="story-node" data-era="語言">
|
||||||
<h3>語言與紀律：打破隔閡</h3>
|
<h3>語言與紀律：打破隔閡</h3>
|
||||||
<p>為了聽懂歐巴的每一句話，佛系自學後配合師大進修部三個月，順利通過韓檢 TOPIK 2 級。</p>
|
<p>為了聽懂歐巴的每一句話，佛系自學後配合師大進修部三個月，順利通過韓檢 TOPIK 2 級。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="設計">
|
<article class="story-node" data-era="設計">
|
||||||
<h3>設計覺醒：從美編到品牌設計</h3>
|
<h3>設計覺醒：從美編到品牌設計</h3>
|
||||||
<p>學習多媒體設計兩個月即入職美編，半年後升任平面設計，現為專業品牌視覺設計師。</p>
|
<p>學習多媒體設計兩個月即入職美編，半年後升任平面設計，現為專業品牌視覺設計師。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="價值">
|
<article class="story-node" data-era="價值">
|
||||||
<h3>價值提升：3.5 年薪資 +10K</h3>
|
<h3>價值提升：3.5 年薪資 +10K</h3>
|
||||||
<p>為了賺錢買周邊與去韓國看演唱會，努力提升技能，在 3 年半內成功提升薪資 10K。證明追星也可以很勵志！</p>
|
<p>為了賺錢買周邊與去韓國看演唱會，努力提升技能，在 3 年半內成功提升薪資 10K。證明追星也可以很勵志！</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section id="journey" class="story-archive">
|
<section id="journey" class="story-archive">
|
||||||
<h2 class="section-title">Journey：推廣部進化史</h2>
|
<h2 class="section-title">Journey：推廣部進化史</h2>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">GROWTH TIMELINE (2016 - 2020)</span>
|
<span class="sub-title">GROWTH TIMELINE (2016 - 2020)</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="merged-storyline">
|
<div class="merged-storyline">
|
||||||
<article class="story-node" data-era="2016">
|
<article class="story-node" data-era="2016">
|
||||||
<h3 class="journey-year-sr">2016</h3>
|
<h3 class="journey-year-sr">2016</h3>
|
||||||
<p class="journey-sublabel">命定緣分與視覺震撼</p>
|
<p class="journey-sublabel">命定緣分與視覺震撼</p>
|
||||||
<h4 class="journey-month">04 月</h4>
|
<h4 class="journey-month">04 月</h4>
|
||||||
<p>因《無限挑戰》開啟與水晶男孩的命定緣分。</p>
|
<p>因《無限挑戰》開啟與水晶男孩的命定緣分。</p>
|
||||||
<h4 class="journey-month">09 月</h4>
|
<h4 class="journey-month">09 月</h4>
|
||||||
<p>飛往首爾參加首場演唱會，受「人生導師」的手幅視覺震撼，確立了以「專業設計」為導向的推廣路徑。</p>
|
<p>飛往首爾參加首場演唱會，受「人生導師」的手幅視覺震撼，確立了以「專業設計」為導向的推廣路徑。</p>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="story-node" data-era="2017">
|
<article class="story-node" data-era="2017">
|
||||||
<h3 class="journey-year-sr">2017</h3>
|
<h3 class="journey-year-sr">2017</h3>
|
||||||
<p class="journey-sublabel">意志與熱舞</p>
|
<p class="journey-sublabel">意志與熱舞</p>
|
||||||
<h4 class="journey-month">02 月</h4>
|
<h4 class="journey-month">02 月</h4>
|
||||||
<p>擔任應援組熱舞小組長，成功減重 10 公斤，用身體實踐為愛而戰的意志力。</p>
|
<p>擔任應援組熱舞小組長，成功減重 10 公斤，用身體實踐為愛而戰的意志力。</p>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="story-node" data-era="2018">
|
<article class="story-node" data-era="2018">
|
||||||
<h3 class="journey-year-sr">2018</h3>
|
<h3 class="journey-year-sr">2018</h3>
|
||||||
<p class="journey-sublabel">數位推廣與影像覺醒</p>
|
<p class="journey-sublabel">數位推廣與影像覺醒</p>
|
||||||
<h4 class="journey-month">06.01</h4>
|
<h4 class="journey-month">06.01</h4>
|
||||||
<p>進入行銷設計班，在 Premiere 課程首日即以高志溶為素材完成作業，獲得好評並正式開啟數位策展元年。</p>
|
<p>進入行銷設計班，在 Premiere 課程首日即以高志溶為素材完成作業，獲得好評並正式開啟數位策展元年。</p>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="story-node" data-era="2019">
|
<article class="story-node" data-era="2019">
|
||||||
<h3 class="journey-year-sr">2019</h3>
|
<h3 class="journey-year-sr">2019</h3>
|
||||||
<p class="journey-sublabel">價值提升與自律生活</p>
|
<p class="journey-sublabel">價值提升與自律生活</p>
|
||||||
<h4 class="journey-month">05 月</h4>
|
<h4 class="journey-month">05 月</h4>
|
||||||
<p>憑藉<span class="mark_b">聽力 93 分</span>高分通過 TOPIK 2 級，同年職涯從美編晉升平面設計師。</p>
|
<p>憑藉<span class="mark_b">聽力 93 分</span>高分通過 TOPIK 2 級，同年職涯從美編晉升平面設計師。</p>
|
||||||
<h4 class="journey-month">06 - 08 月</h4>
|
<h4 class="journey-month">06 - 08 月</h4>
|
||||||
<p>發動全方位打歌：橫跨健身房、單車巡迴與好友飲料店；達成<span class="mark_b">增肌減脂 20%</span>，開啟與偶像同步的自律生活。</p>
|
<p>發動全方位打歌：橫跨健身房、單車巡迴與好友飲料店；達成<span class="mark_b">增肌減脂 20%</span>，開啟與偶像同步的自律生活。</p>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article class="story-node" data-era="2020">
|
<article class="story-node" data-era="2020">
|
||||||
<h3 class="journey-year-sr">2020</h3>
|
<h3 class="journey-year-sr">2020</h3>
|
||||||
<p class="journey-sublabel">從羨慕者進化為應援創作者</p>
|
<p class="journey-sublabel">從羨慕者進化為應援創作者</p>
|
||||||
<h4 class="journey-month">06 月</h4>
|
<h4 class="journey-month">06 月</h4>
|
||||||
<p>在《動森》完成巨型 젝키 Logo 地景；再次運用 Premiere 實力為殷志源製作慶生影片。</p>
|
<p>在《動森》完成巨型 젝키 Logo 地景；再次運用 Premiere 實力為殷志源製作慶生影片。</p>
|
||||||
<h4 class="journey-month">07.15</h4>
|
<h4 class="journey-month">07.15</h4>
|
||||||
<p>受邀製作首份張水院實體應援小卡，正式從仰望者進化為實體應援的創作者。</p>
|
<p>受邀製作首份張水院實體應援小卡，正式從仰望者進化為實體應援的創作者。</p>
|
||||||
<h4 class="journey-month">08 月</h4>
|
<h4 class="journey-month">08 月</h4>
|
||||||
<p>在公司桌曆巧妙致敬《新西遊記 5》，手繪「無臉男」與「陰間使者」，實現職涯美學與熱愛的完美融合。</p>
|
<p>在公司桌曆巧妙致敬《新西遊記 5》，手繪「無臉男」與「陰間使者」，實現職涯美學與熱愛的完美融合。</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
<section id="journey" class="story-archive">
|
<section id="journey" class="story-archive">
|
||||||
<h2 class="section-title">Journey：推廣部進化史</h2>
|
<h2 class="section-title">Journey：推廣部進化史</h2>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">GROWTH TIMELINE (2016 - 2020)</span>
|
<span class="sub-title">GROWTH TIMELINE (2016 - 2020)</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="merged-storyline">
|
<div class="merged-storyline">
|
||||||
<article class="story-node" data-era="2016">
|
<article class="story-node" data-era="2016">
|
||||||
<h3 class="journey-year-sr">2016</h3>
|
<h3 class="journey-year-sr">2016</h3>
|
||||||
<p class="journey-sublabel">命定緣分與實踐</p>
|
<p class="journey-sublabel">命定緣分與實踐</p>
|
||||||
<h4 class="journey-month">04 月</h4>
|
<h4 class="journey-month">04 月</h4>
|
||||||
<p>點開影片，開啟與水晶男孩的命定緣分。</p>
|
<p>點開影片，開啟與水晶男孩的命定緣分。</p>
|
||||||
<h4 class="journey-month">09 月</h4>
|
<h4 class="journey-month">09 月</h4>
|
||||||
<p>飛往首爾參加首場演唱會，受「人生導師」的手幅視覺震撼，確立推廣方向。</p>
|
<p>飛往首爾參加首場演唱會，受「人生導師」的手幅視覺震撼，確立推廣方向。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2017">
|
<article class="story-node" data-era="2017">
|
||||||
<h3 class="journey-year-sr">2017</h3>
|
<h3 class="journey-year-sr">2017</h3>
|
||||||
<p class="journey-sublabel">意志與熱舞</p>
|
<p class="journey-sublabel">意志與熱舞</p>
|
||||||
<h4 class="journey-month">02 月</h4>
|
<h4 class="journey-month">02 月</h4>
|
||||||
<p>擔任熱舞小組長，成功減重 10 公斤，展現為愛而戰的意志。</p>
|
<p>擔任熱舞小組長，成功減重 10 公斤，展現為愛而戰的意志。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2018">
|
<article class="story-node" data-era="2018">
|
||||||
<h3 class="journey-year-sr">2018</h3>
|
<h3 class="journey-year-sr">2018</h3>
|
||||||
<p class="journey-sublabel">數位推廣元年</p>
|
<p class="journey-sublabel">數位推廣元年</p>
|
||||||
<h4 class="journey-month">06 月</h4>
|
<h4 class="journey-month">06 月</h4>
|
||||||
<p>踏進行銷設計的第一天，在剪輯老師突然出的作業後，立刻接收到與高志溶來台拍攝的消息；
|
<p>踏進行銷設計的第一天，在剪輯老師突然出的作業後，立刻接收到與高志溶來台拍攝的消息；
|
||||||
這份突如其來的驚喜，讓我有機會直接以偶像為素材完成首支好評作業，就此驚艷開啟數位策展元年。</p>
|
這份突如其來的驚喜，讓我有機會直接以偶像為素材完成首支好評作業，就此驚艷開啟數位策展元年。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2019">
|
<article class="story-node" data-era="2019">
|
||||||
<h3 class="journey-year-sr">2019</h3>
|
<h3 class="journey-year-sr">2019</h3>
|
||||||
<p class="journey-sublabel">價值提升與自律</p>
|
<p class="journey-sublabel">價值提升與自律</p>
|
||||||
<h4 class="journey-month">05 月</h4>
|
<h4 class="journey-month">05 月</h4>
|
||||||
<p>憑藉<span class="mark_b">聽力 93 分</span>通過 TOPIK 2 級合格，同年職涯從美編晉升平面設計師。</p>
|
<p>憑藉<span class="mark_b">聽力 93 分</span>通過 TOPIK 2 級合格，同年職涯從美編晉升平面設計師。</p>
|
||||||
<h4 class="journey-month">06－08 月</h4>
|
<h4 class="journey-month">06－08 月</h4>
|
||||||
<p>發動全方位打歌行動；達成<span class="mark_b">增肌減脂 20%</span> 目標，開啟與偶像同步的自律生活。</p>
|
<p>發動全方位打歌行動；達成<span class="mark_b">增肌減脂 20%</span> 目標，開啟與偶像同步的自律生活。</p>
|
||||||
<h4 class="journey-milestone">成果</h4>
|
<h4 class="journey-milestone">成果</h4>
|
||||||
<p>3.5 年內成功提升薪資 10K，證明熱愛能驅動實質的自我實現。</p>
|
<p>3.5 年內成功提升薪資 10K，證明熱愛能驅動實質的自我實現。</p>
|
||||||
</article>
|
</article>
|
||||||
<article class="story-node" data-era="2020">
|
<article class="story-node" data-era="2020">
|
||||||
<h3 class="journey-year-sr">2020</h3>
|
<h3 class="journey-year-sr">2020</h3>
|
||||||
<p class="journey-sublabel">從參與到創作</p>
|
<p class="journey-sublabel">從參與到創作</p>
|
||||||
<h4 class="journey-month">06 月</h4>
|
<h4 class="journey-month">06 月</h4>
|
||||||
<p>在《動森》完成巨型 젝키 Logo 地景，並再次為殷志源製作慶生影片。</p>
|
<p>在《動森》完成巨型 젝키 Logo 地景，並再次為殷志源製作慶生影片。</p>
|
||||||
<h4 class="journey-month">07－08 月</h4>
|
<h4 class="journey-month">07－08 月</h4>
|
||||||
<p>正式受邀製作張水院應援小卡，並在職場桌曆中巧妙致敬《新西遊記 5》，實現職涯與熱愛的完美融合。</p>
|
<p>正式受邀製作張水院應援小卡，並在職場桌曆中巧妙致敬《新西遊記 5》，實現職涯與熱愛的完美融合。</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="training">
|
<section id="training">
|
||||||
<h2 class="section-title">#水晶訓練營：意志力的磨練</h2>
|
<h2 class="section-title">#水晶訓練營：意志力的磨練</h2>
|
||||||
<div class="intro-text">
|
<div class="intro-text">
|
||||||
<p class="intro-text">為了擁有更好的體態跟上歐巴，我將少女心跳成專業舞步，並透過多元運動鍛鍊出強大的紀律：</p>
|
<p class="intro-text">為了擁有更好的體態跟上歐巴，我將少女心跳成專業舞步，並透過多元運動鍛鍊出強大的紀律：</p>
|
||||||
<ul>
|
<ul>
|
||||||
<li><span class="hashtag-chip">#律動</span>熱舞（用身體記憶跨世紀的節奏）。</li>
|
<li><span class="hashtag-chip">#律動</span>熱舞（用身體記憶跨世紀的節奏）。</li>
|
||||||
<li><span class="hashtag-chip">#核心</span>重訓、空中瑜珈。</li>
|
<li><span class="hashtag-chip">#核心</span>重訓、空中瑜珈。</li>
|
||||||
<li><span class="hashtag-chip">#耐力</span>單車、游泳、爬山。</li>
|
<li><span class="hashtag-chip">#耐力</span>單車、游泳、爬山。</li>
|
||||||
<li><span class="hashtag-chip">#敏捷</span>桌球。</li>
|
<li><span class="hashtag-chip">#敏捷</span>桌球。</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="tech-stack">
|
<section id="tech-stack">
|
||||||
<h2 class="section-title">全端開發與數位推廣</h2>
|
<h2 class="section-title">全端開發與數位推廣</h2>
|
||||||
<div class="intro-text">
|
<div class="intro-text">
|
||||||
<p class="intro-text">
|
<p class="intro-text">
|
||||||
這十年，我從台下的仰望者進化成了手握技術的守護者。當前最重要的挑戰：朝著前端設計師努力，結合包裝設計的審美與 PHP／MySQL／JS 技術，親手搭建這個數位平台。這份熱愛，就是我最強大的軍功章。
|
這十年，我從台下的仰望者進化成了手握技術的守護者。當前最重要的挑戰：朝著前端設計師努力，結合包裝設計的審美與 PHP／MySQL／JS 技術，親手搭建這個數位平台。這份熱愛，就是我最強大的軍功章。
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="story-grid">
|
<div class="story-grid">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h3>Visual & Branding</h3>
|
<h3>Visual & Branding</h3>
|
||||||
<p>品牌包裝設計、視覺藝術策劃；11 種設計軟體掌握（含影像剪輯）。</p>
|
<p>品牌包裝設計、視覺藝術策劃；11 種設計軟體掌握（含影像剪輯）。</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<h3>Full-stack Dev</h3>
|
<h3>Full-stack Dev</h3>
|
||||||
<p>HTML, CSS, JS, PHP, MySQL, Cursor AI</p>
|
<p>HTML, CSS, JS, PHP, MySQL, Cursor AI</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<div class="landing-actions">
|
<div class="landing-actions">
|
||||||
<a href="../index.html#mission" class="btn">回到首頁 · 成立的初衷</a>
|
<a href="../index.html#mission" class="btn">回到首頁 · 成立的初衷</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||||
</a>
|
</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="../assets/js/particles.js"></script>
|
<script src="../assets/js/particles.js"></script>
|
||||||
<script src="../assets/js/portal-nav.js"></script>
|
<script src="../assets/js/portal-nav.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
+51
-51
@@ -1,51 +1,51 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="zh-TW">
|
<html lang="zh-TW">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>水晶男孩｜消失的真相</title>
|
<title>水晶男孩｜消失的真相</title>
|
||||||
<link rel="stylesheet" href="../assets/css/style.css">
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.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">
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="chronicle-page">
|
<body class="chronicle-page">
|
||||||
<header class="inner-page-header">
|
<header class="inner-page-header">
|
||||||
<div class="header-inner site-header-inner">
|
<div class="header-inner site-header-inner">
|
||||||
<h1 class="main-title">消失的真相</h1>
|
<h1 class="main-title">消失的真相</h1>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">VOICE · RAIN · NARRATIVE</span>
|
<span class="sub-title">VOICE · RAIN · NARRATIVE</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||||
|
|
||||||
<canvas id="particles"></canvas>
|
<canvas id="particles"></canvas>
|
||||||
|
|
||||||
<main class="content-container variety-page-main chronicle-reader">
|
<main class="content-container variety-page-main chronicle-reader">
|
||||||
<section id="truth" class="variety-block">
|
<section id="truth" class="variety-block">
|
||||||
<h2 class="section-title">還原那場雨</h2>
|
<h2 class="section-title">還原那場雨</h2>
|
||||||
<p class="intro-text">流言與標題往往跑在當事人之前；這裡不急著下判決，而是把時間軸、公開說法與作品留痕擺在同一視線高度，讓讀的人自己拼出輪廓。</p>
|
<p class="intro-text">流言與標題往往跑在當事人之前；這裡不急著下判決，而是把時間軸、公開說法與作品留痕擺在同一視線高度，讓讀的人自己拼出輪廓。</p>
|
||||||
<p class="intro-text">此區預留給你之後補上的整理與引用來源；先立欄位，避免情緒性的單句蓋過事實層次。</p>
|
<p class="intro-text">此區預留給你之後補上的整理與引用來源；先立欄位，避免情緒性的單句蓋過事實層次。</p>
|
||||||
</section>
|
</section>
|
||||||
<section id="voice" class="variety-block">
|
<section id="voice" class="variety-block">
|
||||||
<h2 class="section-title">被掩蓋的主唱</h2>
|
<h2 class="section-title">被掩蓋的主唱</h2>
|
||||||
<p class="intro-text">White Kies 的高音與哭腔，曾在無數主打裡替團名撐住「好聽」這兩個字；當鏡頭轉向別處，那些聲線與和聲仍留在音檔裡，等耳朵重新打開。</p>
|
<p class="intro-text">White Kies 的高音與哭腔，曾在無數主打裡替團名撐住「好聽」這兩個字；當鏡頭轉向別處，那些聲線與和聲仍留在音檔裡，等耳朵重新打開。</p>
|
||||||
<p class="intro-text">之後可在此收錄現場、翻唱、與合作曲目，讓「主唱」不被標籤蓋過，而被聽見。</p>
|
<p class="intro-text">之後可在此收錄現場、翻唱、與合作曲目，讓「主唱」不被標籤蓋過，而被聽見。</p>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||||
</a>
|
</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="../assets/js/portal-nav.js"></script>
|
<script src="../assets/js/portal-nav.js"></script>
|
||||||
<script src="../assets/js/particles.js"></script>
|
<script src="../assets/js/particles.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
+997
-997
File diff suppressed because it is too large
Load Diff
+828
-828
File diff suppressed because it is too large
Load Diff
+601
-601
File diff suppressed because it is too large
Load Diff
+527
-527
File diff suppressed because it is too large
Load Diff
+131
-131
@@ -1,131 +1,131 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="zh-TW">
|
<html lang="zh-TW">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>水晶男孩推廣部｜視覺進化論</title>
|
<title>水晶男孩推廣部｜視覺進化論</title>
|
||||||
<link rel="stylesheet" href="../assets/css/style.css">
|
<link rel="stylesheet" href="../assets/css/style.css">
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.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">
|
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="chronicle-page minister-page">
|
<body class="chronicle-page minister-page">
|
||||||
<header class="inner-page-header">
|
<header class="inner-page-header">
|
||||||
<div class="header-inner site-header-inner">
|
<div class="header-inner site-header-inner">
|
||||||
<h1 class="main-title">視覺進化論</h1>
|
<h1 class="main-title">視覺進化論</h1>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">FROM CURIOSITY TO FULL-STACK</span>
|
<span class="sub-title">FROM CURIOSITY TO FULL-STACK</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||||
|
|
||||||
<canvas id="particles"></canvas>
|
<canvas id="particles"></canvas>
|
||||||
|
|
||||||
<main class="content-container variety-page-main chronicle-reader minister-main">
|
<main class="content-container variety-page-main chronicle-reader minister-main">
|
||||||
<p class="minister-hero-lead">
|
<p class="minister-hero-lead">
|
||||||
關於我：<span class="mark_b">從「好奇」到「全端」的進化之路</span>
|
關於我：<span class="mark_b">從「好奇」到「全端」的進化之路</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
<section id="intro" class="variety-block">
|
<section id="intro" class="variety-block">
|
||||||
<h2 class="section-title">跨越時空的開端</h2>
|
<h2 class="section-title">跨越時空的開端</h2>
|
||||||
<p class="intro-text">
|
<p class="intro-text">
|
||||||
這段旅程始於 2016 年 4 月，透過《無限挑戰》的回歸企劃，讓原本不認識這組傳奇團體的我，因一時好奇點開節目。即便錯過了 2000 年巔峰解散的時代，我依然被那份真誠且專業的魅力所震撼。</p>
|
這段旅程始於 2016 年 4 月，透過《無限挑戰》的回歸企劃，讓原本不認識這組傳奇團體的我，因一時好奇點開節目。即便錯過了 2000 年巔峰解散的時代，我依然被那份真誠且專業的魅力所震撼。</p>
|
||||||
<p class="slogan-quote slogan-quote--awakening"><span class="slogan-quote__inner">對我而言，這不只是追星的開始，更是自我覺醒的起點。</span></p>
|
<p class="slogan-quote slogan-quote--awakening"><span class="slogan-quote__inner">對我而言，這不只是追星的開始，更是自我覺醒的起點。</span></p>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="slant" class="variety-block">
|
<section id="slant" class="variety-block">
|
||||||
<h2 class="section-title">為了熱愛而進化的斜槓精神</h2>
|
<h2 class="section-title">為了熱愛而進化的斜槓精神</h2>
|
||||||
<p class="intro-text">
|
<p class="intro-text">
|
||||||
我始於「水晶廢人」的自嘲，卻在熱愛中長成了各個領域的策劃者：
|
我始於「水晶廢人」的自嘲，卻在熱愛中長成了各個領域的策劃者：
|
||||||
</p>
|
</p>
|
||||||
<ul class="minister-skill-list">
|
<ul class="minister-skill-list">
|
||||||
<li><span class="minister-hashtag">#水晶推廣部</span>身為品牌設計師，我堅持「不看醜東西」的原則，親自操刀所有視覺，將這份能量轉化為專業策劃。</li>
|
<li><span class="minister-hashtag">#水晶推廣部</span>身為品牌設計師，我堅持「不看醜東西」的原則，親自操刀所有視覺，將這份能量轉化為專業策劃。</li>
|
||||||
<li><span class="minister-hashtag">#水晶訓練營</span>為了聽懂歐巴的每一句話，我開始學韓文、考韓檢、健身、跳舞，證明追星是自我提升最強大的動力。</li>
|
<li><span class="minister-hashtag">#水晶訓練營</span>為了聽懂歐巴的每一句話，我開始學韓文、考韓檢、健身、跳舞，證明追星是自我提升最強大的動力。</li>
|
||||||
<li><span class="minister-hashtag">#全端開發者</span>這是我當下最重要的挑戰，將設計專業與程式技術結合，搭建一個專屬於這份熱愛的數位平台。</li>
|
<li><span class="minister-hashtag">#全端開發者</span>這是我當下最重要的挑戰，將設計專業與程式技術結合，搭建一個專屬於這份熱愛的數位平台。</li>
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section id="journey" class="minister-journey story-archive" aria-labelledby="journey-title">
|
<section id="journey" class="minister-journey story-archive" aria-labelledby="journey-title">
|
||||||
<h2 class="section-title" id="journey-title">Journey：成長時間軸</h2>
|
<h2 class="section-title" id="journey-title">Journey：成長時間軸</h2>
|
||||||
<div class="subtitle-wrap">
|
<div class="subtitle-wrap">
|
||||||
<span class="sub-title">GROWTH TIMELINE</span>
|
<span class="sub-title">GROWTH TIMELINE</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="merged-storyline">
|
<div class="merged-storyline">
|
||||||
<article id="journey-2016" class="story-node" data-era="2016">
|
<article id="journey-2016" class="story-node" data-era="2016">
|
||||||
<h3>從「欣賞」到「實踐」的元年</h3>
|
<h3>從「欣賞」到「實踐」的元年</h3>
|
||||||
<p class="minister-month">07 月｜手作初試</p>
|
<p class="minister-month">07 月｜手作初試</p>
|
||||||
<p>開始學習勾針，為金在德製作第一個鴨鴨置物籃，這是從旁觀者轉為實踐者的第一步。</p>
|
<p>開始學習勾針，為金在德製作第一個鴨鴨置物籃，這是從旁觀者轉為實踐者的第一步。</p>
|
||||||
<figure class="minister-photo">
|
<figure class="minister-photo">
|
||||||
<img src="../assets/images/minister/image_3c1739.jpg" alt="手作鴨鴨置物籃" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3c1739.jpg" alt="手作鴨鴨置物籃" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p class="minister-month">08 月｜螢幕後的參與</p>
|
<p class="minister-month">08 月｜螢幕後的參與</p>
|
||||||
<p>以「水晶廢人字幕組」粉絲身分，用手繪應援板與勾針作品參與應援影片籌備。</p>
|
<p>以「水晶廢人字幕組」粉絲身分，用手繪應援板與勾針作品參與應援影片籌備。</p>
|
||||||
<figure class="minister-photo">
|
<figure class="minister-photo">
|
||||||
<img src="../assets/images/minister/image_3c13d7.jpg" alt="手繪應援板與勾針作品" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3c13d7.jpg" alt="手繪應援板與勾針作品" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p class="minister-month">09 月｜孤注一擲的現場</p>
|
<p class="minister-month">09 月｜孤注一擲的現場</p>
|
||||||
<p>在經濟窘迫、甚至需要借錢籌措旅費的情況下，飛往首爾參加首場演唱會。在那裡，我握著導師設計的台灣小黃手幅，第一次感受到設計與才華帶來的震撼。</p>
|
<p>在經濟窘迫、甚至需要借錢籌措旅費的情況下，飛往首爾參加首場演唱會。在那裡，我握著導師設計的台灣小黃手幅，第一次感受到設計與才華帶來的震撼。</p>
|
||||||
<figure class="minister-photo">
|
<figure class="minister-photo">
|
||||||
<img src="../assets/images/minister/image_3bb254.jpg" alt="台灣小黃手幅" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3bb254.jpg" alt="台灣小黃手幅" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p class="minister-month">12 月｜溫暖的饋贈</p>
|
<p class="minister-month">12 月｜溫暖的饋贈</p>
|
||||||
<p>在「#水晶文具社」聚會中，收到了同好精緻的手繪聖誕卡片。看著別人的創作，我更加確信自己也想成為能用作品傳遞能量的人。</p>
|
<p>在「#水晶文具社」聚會中，收到了同好精緻的手繪聖誕卡片。看著別人的創作，我更加確信自己也想成為能用作品傳遞能量的人。</p>
|
||||||
<figure class="minister-photo">
|
<figure class="minister-photo">
|
||||||
<img src="../assets/images/minister/image_3bab17.jpg" alt="手繪聖誕卡片" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3bab17.jpg" alt="手繪聖誕卡片" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article id="journey-2017" class="story-node" data-era="2017">
|
<article id="journey-2017" class="story-node" data-era="2017">
|
||||||
<h3>從「身體」到「文字」的深化</h3>
|
<h3>從「身體」到「文字」的深化</h3>
|
||||||
<p class="minister-month">01 月｜職人精神的啟發</p>
|
<p class="minister-month">01 月｜職人精神的啟發</p>
|
||||||
<p>參與資管組 D 大的新年紅包活動。其書法與刻印結合的質感，深深影響了我對美感的標準。</p>
|
<p>參與資管組 D 大的新年紅包活動。其書法與刻印結合的質感，深深影響了我對美感的標準。</p>
|
||||||
<figure class="minister-photo">
|
<figure class="minister-photo">
|
||||||
<img src="../assets/images/minister/image_3ba74f.jpg" alt="新年紅包活動" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3ba74f.jpg" alt="新年紅包活動" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<p class="minister-month">02 月｜身體記憶的熱血</p>
|
<p class="minister-month">02 月｜身體記憶的熱血</p>
|
||||||
<p>擔任應援組熱舞企劃小組長，在板橋與中山地下街教舞兩個月，為此減重 10 公斤，用身體記憶跨越世紀的節奏。</p>
|
<p>擔任應援組熱舞企劃小組長，在板橋與中山地下街教舞兩個月，為此減重 10 公斤，用身體記憶跨越世紀的節奏。</p>
|
||||||
|
|
||||||
<p class="minister-month">04 月｜筆尖的沈澱</p>
|
<p class="minister-month">04 月｜筆尖的沈澱</p>
|
||||||
<p>跟著文具社走遍全台咖啡廳，在鋼筆墨水與玻璃杯的陪伴下，用手寫記錄初心。</p>
|
<p>跟著文具社走遍全台咖啡廳，在鋼筆墨水與玻璃杯的陪伴下，用手寫記錄初心。</p>
|
||||||
<figure class="minister-photo minister-photo--dual">
|
<figure class="minister-photo minister-photo--dual">
|
||||||
<img src="../assets/images/minister/image_3baed1.jpg" alt="鋼筆墨水與玻璃杯" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3baed1.jpg" alt="鋼筆墨水與玻璃杯" width="1040" height="780" loading="lazy">
|
||||||
<img src="../assets/images/minister/image_3c2299.jpg" alt="手寫記錄初心" width="1040" height="780" loading="lazy">
|
<img src="../assets/images/minister/image_3c2299.jpg" alt="手寫記錄初心" width="1040" height="780" loading="lazy">
|
||||||
</figure>
|
</figure>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
<article id="journey-now" class="story-node" data-era="NOW">
|
<article id="journey-now" class="story-node" data-era="NOW">
|
||||||
<h3>以熱愛為名的設計進化</h3>
|
<h3>以熱愛為名的設計進化</h3>
|
||||||
<p class="minister-month">2018 年｜設計靈魂覺醒</p>
|
<p class="minister-month">2018 年｜設計靈魂覺醒</p>
|
||||||
<p>正式踏入設計領域。因為想為水晶男孩創作的執念，所有的練習都以他們為主題，這種動力讓我的設計實力產生質變。</p>
|
<p>正式踏入設計領域。因為想為水晶男孩創作的執念，所有的練習都以他們為主題，這種動力讓我的設計實力產生質變。</p>
|
||||||
|
|
||||||
<p class="minister-month">現在｜全端開發與推廣</p>
|
<p class="minister-month">現在｜全端開發與推廣</p>
|
||||||
<p>不再只是感嘆導師與他人的才華。我正運用包裝設計與全端開發的積累，親手搭建這個數位平台，證明追星是讓我「變厲害」的軍功章。</p>
|
<p>不再只是感嘆導師與他人的才華。我正運用包裝設計與全端開發的積累，親手搭建這個數位平台，證明追星是讓我「變厲害」的軍功章。</p>
|
||||||
</article>
|
</article>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<p class="minister-back">
|
<p class="minister-back">
|
||||||
<a href="../index.html#mission" class="btn">回到首頁 · 成立的初衷</a>
|
<a href="../index.html#mission" class="btn">回到首頁 · 成立的初衷</a>
|
||||||
</p>
|
</p>
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||||
</a>
|
</a>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
<script src="../assets/js/particles.js"></script>
|
<script src="../assets/js/particles.js"></script>
|
||||||
<script src="../assets/js/portal-nav.js"></script>
|
<script src="../assets/js/portal-nav.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
+6
-6
@@ -1,6 +1,6 @@
|
|||||||
# 明天打開專案先看這裡
|
# 明天打開專案先看這裡
|
||||||
|
|
||||||
1. **[內頁 header 差異整理 → `inner-page-header-audit.md`](./inner-page-header-audit.md)**
|
1. **[內頁 header 差異整理 → `inner-page-header-audit.md`](./inner-page-header-audit.md)**
|
||||||
（`header-inner` 各頁哪裡不同、演唱會／NJTW 例外、要決定怎麼統一）
|
（`header-inner` 各頁哪裡不同、演唱會／NJTW 例外、要決定怎麼統一）
|
||||||
|
|
||||||
改檔前記得：先跟你確認再 **執行**（見 `rules/agent-must-ask.mdc`）。
|
改檔前記得：先跟你確認再 **執行**（見 `rules/agent-must-ask.mdc`）。
|
||||||
|
|||||||
@@ -1,3 +1,3 @@
|
|||||||
備份時間：2026-05-16 15:56
|
備份時間：2026-05-16 15:56
|
||||||
基準 commit：fa8b04d（style 統一header）
|
基準 commit：fa8b04d（style 統一header）
|
||||||
內容：相對 fa8b04d 未提交的修改與未追蹤新檔（還原前工作區快照）
|
內容：相對 fa8b04d 未提交的修改與未追蹤新檔（還原前工作區快照）
|
||||||
|
|||||||
Reference in New Issue
Block a user