新增 webp 轉換工具，刪除原始圖檔

Mr-Smilin · Feb 3, 2025 · 3596c98 · 3596c98
1 parent 29d370d
commit 3596c98
Show file tree

Hide file tree

Showing 1,077 changed files with 2,815 additions and 2,222 deletions.
diff --git a/docs/develop/1-start.md b/docs/develop/1-start.md
@@ -71,17 +71,17 @@ tags:
 
 透過文檔下方的 `在 Github 上編輯此頁面` 進行調整
 
-![](/images/develop/1-start/01.jpg)
+![](/images/develop/1-start/01.webp)
 
-![操作示意圖](/images/develop/1-start/02.jpg)
+![操作示意圖](/images/develop/1-start/02.webp)
 
 可以點擊圖片放大
 
 使用 Github 原生的文檔編輯器進行調整，  
 左上是模式切換，預設`Edit`編輯模式，  
 `Preview` 可以在存檔前，預先檢視修改後的結果。
 
-![操作示意圖2](/images/develop/1-start/03.jpg)
+![操作示意圖2](/images/develop/1-start/03.webp)
 
 都完成後點擊右上角的`Commit changes`，  
 彈出的視窗也點擊`Commit changes`，完成單文檔的編輯。
@@ -101,7 +101,7 @@ tags:
 
 點擊本站右上的圖標，跳轉至專案首頁
 
-![](/images/develop/1-start/04.jpg)
+![](/images/develop/1-start/04.webp)
 
 ::: danger 💡 注意
 此處務必將左側的該段文字保存記下，  
@@ -113,13 +113,13 @@ tags:
 將本 wiki 整包下載至電腦內，  
 找個方便開發的地方整理好，進行解壓縮。
 
-![](/images/develop/1-start/05.jpg)
+![](/images/develop/1-start/05.webp)
 
 進入專案的 `docs` 資料夾，所有的 `wiki` 編輯都在此處增改
 
 -   目錄下的 `.md` 檔對應 wiki 條例，可從網站網址尋找對應名稱  
     ::: details 網址示意圖
-    ![](/images/develop/1-start/06.jpg)
+    ![](/images/develop/1-start/06.webp)
     :::
 -   `en` 資料夾內存放英文版本的同名 wiki 檔案，維護時可協助新增修改
 -   `public` 存放靜態資源，例如需要上傳圖檔，請將圖檔按照 `public/images/{md檔案分類}/{md檔名}/{圖檔}.{副檔名}`的形式擺放
@@ -137,14 +137,14 @@ tags:
 例如編輯文本，那就是點進`docs`資料夾
 
 ::: details 示意圖
-![](/images/develop/1-start/07.jpg)
-![](/images/develop/1-start/08.jpg)
+![](/images/develop/1-start/07.webp)
+![](/images/develop/1-start/08.webp)
 :::
 
 目錄相同後，點擊右上角的 `Add file`  
 選擇 `Upload files`，將修改的文檔拖入畫面
 
-![](/images/develop/1-start/08.jpg)
+![](/images/develop/1-start/08.webp)
 
 在 `Add files via upload` 的框簡單打一下修改了甚麼，  
 之後 `Commit changes`。

diff --git a/docs/develop/2-vitepress.md b/docs/develop/2-vitepress.md
@@ -22,14 +22,14 @@ tags:
 這邊主要講解 `.vitepress` 資料夾內，  
 一些較常需要編輯的內容要點。
 
-![](/images/develop/2-vitepress/01.jpg)
+![](/images/develop/2-vitepress/01.webp)
 
 -   `config.mjs` 主要會需要調整的設定檔，影響左側目錄，以及站點的主要設定
 -   `theme` 本站的自定義樣式 / 工具，請在具備一定基礎知識的情況下操作
 
 ## 目錄調整
 
-![](/images/develop/2-vitepress/02.jpg)
+![](/images/develop/2-vitepress/02.webp)
 
 請在 `config.mjs` 的 `themeConfig.sidebar` 修改
 

diff --git a/docs/develop/3-run-local.md b/docs/develop/3-run-local.md
@@ -47,14 +47,14 @@ npm run dev
 ### <菜雞版說明>
 
 (1)點擊右上角圖案進入 github 頁面  
-![](/images/develop/3-run-local/菜雞預覽教學01.jpg)  
+![](/images/develop/3-run-local/菜雞預覽教學01.webp)  
 (2)把 source code 下載到電腦中隨便找個地方解壓縮  
-![](/images/develop/3-run-local/菜雞預覽教學02.jpg)  
+![](/images/develop/3-run-local/菜雞預覽教學02.webp)  
 (3)下載並安裝[NPM](https://nodejs.org/dist/v18.18.1/node-v18.18.1-x64.msi)與[GIT](https://git-scm.com/downloads)  
 (4)於 source code 資料夾路徑輸入 CMD，會跳出該路徑的命令提示字元  
-![](/images/develop/3-run-local/菜雞預覽教學03.jpg)  
+![](/images/develop/3-run-local/菜雞預覽教學03.webp)  
 (5)依序輸入 npm install 與 npm run dev  
-![](/images/develop/3-run-local/菜雞預覽教學04.jpg)  
+![](/images/develop/3-run-local/菜雞預覽教學04.webp)  
 (6)在瀏覽器網址輸入 `localhost:5173/LoM-wiki/`
-![](/images/develop/3-run-local/菜雞預覽教學05.jpg)  
+![](/images/develop/3-run-local/菜雞預覽教學05.webp)  
 (7)完成以上步驟後即可即時預覽儲存後的所有修改結果
diff --git a/docs/develop/4-1-template.md b/docs/develop/4-1-template.md
@@ -41,7 +41,7 @@ tags:
 請依您的需求放入對應的資料夾(若不清楚請參考 `/readme.md` 資料夾結構說明)  
 除了 `/docs/event` 底下可能有部分事件用英文取名稍嫌困難，  
 可以用 `中文名稱.md` 的格式命名外,  
-其餘檔名務必是純英文、半形數字跟 `-` 組成,   
+其餘檔名務必是純英文、半形數字跟 `-` 組成,  
 例如
 
 ```
@@ -230,15 +230,15 @@ hello `行內純文字塊`test
 <br>
 
 ![趙活的圖片,完整路徑](https://i.imgur.com/WlPuE8U.png)
-![龍湘大頭貼, 相對路徑](/images/characters/girl_8/icon_girl8.png)
+![龍湘大頭貼, 相對路徑](/images/characters/girl_8/icon_girl8.webp)
 
 <br>
 
 ::: details 原始碼
 
 ```markdown
 ![趙活的圖片,完整路徑](https://i.imgur.com/WlPuE8U.png)
-![龍湘大頭貼, 相對路徑](/images/characters/girl_8/icon_girl8.png)
+![龍湘大頭貼, 相對路徑](/images/characters/girl_8/icon_girl8.webp)
 ```
 
 :::

diff --git a/docs/develop/4-2-wiki-template.md b/docs/develop/4-2-wiki-template.md
@@ -67,8 +67,7 @@ tags:
 
 `<BadendIcon>`連結預設會跳入生死簿, 可用 :no 指定跳入編號。  
 目前部分會跳到生死簿的詳細頁面, 隨著釋出的頁面越多,  
-BadendIcon將會自動導入越來越多的詳細頁面。
-
+BadendIcon 將會自動導入越來越多的詳細頁面。
 
 <br>
 
@@ -122,12 +121,12 @@ medium(中型) 圖案 76 px _ 88 px。
 
 ### 人物 Icon 懶人組件使用示例
 
-|                           語法                           | 效果                                                    |              說明               |
-| :------------------------------------------------------: | :------------------------------------------------------ |:-----------------------------:|
-| `` <BadendIcon :size="`medium`">我是文字</BadendIcon> `` | <BadendIcon :size="`medium`">我是文字</BadendIcon>      |           顯示中型 Icon           |
-| `` <BadendIcon :size="`small`">我是文字</BadendIcon> ``  | <BadendIcon :size="`small`">我是文字</BadendIcon>       |           顯示小型 Icon           |
-|           `<BadendIcon>我是文字</BadendIcon>`            | <BadendIcon>我是文字</BadendIcon>                       |    採用預設大小, 預設為"\`small\`"     |
-|               `<BadendIcon></BadendIcon>`                | <BadendIcon></BadendIcon>                               | 不寫任何文字，採用預設大小, 預設為"\`small\`" |
+|                           語法                           | 效果                                                    |                         說明                          |
+| :------------------------------------------------------: | :------------------------------------------------------ | :---------------------------------------------------: |
+| `` <BadendIcon :size="`medium`">我是文字</BadendIcon> `` | <BadendIcon :size="`medium`">我是文字</BadendIcon>      |                     顯示中型 Icon                     |
+| `` <BadendIcon :size="`small`">我是文字</BadendIcon> ``  | <BadendIcon :size="`small`">我是文字</BadendIcon>       |                     顯示小型 Icon                     |
+|           `<BadendIcon>我是文字</BadendIcon>`            | <BadendIcon>我是文字</BadendIcon>                       |            採用預設大小, 預設為"\`small\`"            |
+|               `<BadendIcon></BadendIcon>`                | <BadendIcon></BadendIcon>                               |     不寫任何文字，採用預設大小, 預設為"\`small\`"     |
 | `<BadendIcon :no="30">生死簿30『清理門戶』</BadendIcon>` | <BadendIcon :no="30">生死簿 30『清理門戶』</BadendIcon> | no 用來連結生死簿的編號, 不使用則會跳到生死簿最上面。 |
 
 ### 可用屬性寫法
@@ -208,14 +207,14 @@ medium 為中型(200 px _ 200 px);
 ### 對應擺放路徑格式
 
 ```
-docs/public/images/items/${type}s/item_${type}_${no}.png
+docs/public/images/items/${type}s/item_${type}_${no}.webp
 ```
 
 其中 `${type}` 為物品類型，如 `book`、`food`、`special`、`tea`、`wine`；  
 `${no}` 為物品編號。
 
-舉例而言 武學書籍(book) 編號為 6001, 圖片路徑為 `docs/public/images/items/books/item_book_6001.png`,  
-特殊道具(special) 編號為 2003, 圖片路徑為 `docs/public/images/items/specials/item_special_2003.png`
+舉例而言 武學書籍(book) 編號為 6001, 圖片路徑為 `docs/public/images/items/books/item_book_6001.webp`,  
+特殊道具(special) 編號為 2003, 圖片路徑為 `docs/public/images/items/specials/item_special_2003.webp`
 
 ::: warning
 使用前請先確認是否該圖檔案存在，若不存在，請一並上傳至指定路徑。  

diff --git a/docs/develop/4-3-character-template.md b/docs/develop/4-3-character-template.md
@@ -21,7 +21,7 @@ tags:
 <br><br>
 
 <div style="text-align: center;">
-  <img src="/images/characters/girl_8/icon_drumstick.png" style="display: block; margin: 0 auto;" />
+  <img src="/images/characters/girl_8/icon_drumstick.webp" style="display: block; margin: 0 auto;" />
   <p>感謝龍湘擔任本頁展示用模特</p>
 </div>
 
@@ -100,12 +100,12 @@ tags:
 <ChTabs>
     <ChTab title="我是第一頁">
         <Ch
-        src='/images/characters/girl_8/normal.png'
+        src='/images/characters/girl_8/normal.webp'
         position='right'/>
     </ChTab>
     <ChTab title="切換我的圖片有動畫載入">
         <Ch
-        src='/images/characters/girl_8/girl8_drumstick.png'
+        src='/images/characters/girl_8/girl8_drumstick.webp'
         position='center'
         :animation=true />
     </ChTab>
@@ -117,12 +117,12 @@ tags:
 <ChTabs>
     <ChTab title="我是第一頁">
         <Ch
-        src='/images/characters/girl_8/normal.png'
+        src='/images/characters/girl_8/normal.webp'
         position='right'/>
     </ChTab>
     <ChTab title="切換我的圖片有動畫載入">
         <Ch
-        src='/images/characters/girl_8/girl8_drumstick.png'
+        src='/images/characters/girl_8/girl8_drumstick.webp'
         position='center'
         :animation=true />
     </ChTab>
@@ -274,7 +274,7 @@ tags:
         nameEn='Long Xiang'
         position='right'/>
         <Ch
-        src='/images/characters/girl_8/normal.png'
+        src='/images/characters/girl_8/normal.webp'
         position='right'/>
         <ChTable
         :table="[
@@ -294,7 +294,7 @@ tags:
     </ChTab>
     <ChTab title="吃雞腿">
         <Ch
-        src='/images/characters/girl_8/girl8_drumstick.png'
+        src='/images/characters/girl_8/girl8_drumstick.webp'
         position='center'
         :animation=true />
     </ChTab>
@@ -310,7 +310,7 @@ tags:
         nameEn='Long Xiang'
         position='right'/>
         <Ch
-        src='/images/characters/girl_8/normal.png'
+        src='/images/characters/girl_8/normal.webp'
         position='right'/>
         <ChTable
         :table="[
@@ -330,7 +330,7 @@ tags:
     </ChTab>
     <ChTab title="吃雞腿">
         <Ch
-        src='/images/characters/girl_8/girl8_drumstick.png'
+        src='/images/characters/girl_8/girl8_drumstick.webp'
         position='center'
         :animation=true />
     </ChTab>
@@ -627,15 +627,15 @@ tags:
 <ChTabs position="bottom">
 	<ChTab title="龍湘">
         <ChMeet 
-			src='/images/characters/girl_8/normal.png' 
+			src='/images/characters/girl_8/normal.webp' 
 			nameMain='龍湘'
 			desc='師承錦香宮，劍法精絕的清麗佳人。<br>踏著父親從前的足跡踽踽前行，嚮往能夠承其父志，行俠四方。'
 			:animation=true
 		/>
     </ChTab>
 	<ChTab title="無動畫版">
         <ChMeet 
-			src='/images/characters/girl_0/normal.png' 
+			src='/images/characters/girl_0/normal.webp' 
 			nameTitle='小師妹'
 			nameMain='唐默鈴'
 			desc='芳名默鈴，唐門掌門獨生愛女，宛如森林小動物般的少女，性情淡漠，身繫七串從來不響的鈴噹。<br>興趣是摺紙。'
@@ -651,15 +651,15 @@ tags:
 <ChTabs position="bottom">
 	<ChTab title="龍湘">
         <ChMeet
-			src='/images/characters/girl_8/normal.png'
+			src='/images/characters/girl_8/normal.webp'
 			nameMain='龍湘'
 			desc='師承錦香宮，劍法精絕的清麗佳人。<br>踏著父親從前的足跡踽踽前行，嚮往能夠承其父志，行俠四方。'
 			:animation=true
 		/>
     </ChTab>
 	<ChTab title="無動畫版">
         <ChMeet
-			src='/images/characters/girl_0/normal.png'
+			src='/images/characters/girl_0/normal.webp'
 			nameTitle='小師妹'
 			nameMain='唐默鈴'
 			desc='芳名默鈴，唐門掌門獨生愛女，宛如森林小動物般的少女，性情淡漠，身繫七串從來不響的鈴噹。<br>興趣是摺紙。'

diff --git a/docs/en/index.md b/docs/en/index.md
@@ -3,25 +3,25 @@
 layout: home
 
 hero:
-  name: "LoM-wiki"
-  text: "活俠傳wiki"
-  tagline: My great project tagline
-  image:
-    src: /images/logo.png
-    alt: LoM-wiki
-  actions:
-    - theme: brand
-      text: Markdown Examples
-      link: /markdown-examples
-    - theme: alt
-      text: API Examples
-      link: /api-examples
+    name: "LoM-wiki"
+    text: "活俠傳wiki"
+    tagline: My great project tagline
+    image:
+        src: /images/logo.webp
+        alt: LoM-wiki
+    actions:
+        - theme: brand
+          text: Markdown Examples
+          link: /markdown-examples
+        - theme: alt
+          text: API Examples
+          link: /api-examples
 
 features:
-  - title: Feature A
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature B
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
-  - title: Feature C
-    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+    - title: Feature A
+      details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+    - title: Feature B
+      details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+    - title: Feature C
+      details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
 ---
diff --git a/docs/event/achievements/index.md b/docs/event/achievements/index.md
@@ -18,7 +18,7 @@ tags:
 :::
 
 防劇透唐嬌嬌鎮樓：
-<img height="300" width="300" src="/images/characters/big_trainee_girl_1/jojo.png">
+<img height="300" width="300" src="/images/characters/big_trainee_girl_1/jojo.webp">
 
 <BTable>
     <tr>

diff --git a/docs/event/badends/badend-1.md b/docs/event/badends/badend-1.md
@@ -10,19 +10,19 @@ tags:
     - 生死簿
     - 死法
     - 砍死
-
 ---
 
 # {{ $frontmatter.title }}
 
-<img width="720" src="/images/badends/badend1.png">
+<img width="720" src="/images/badends/badend1.webp">
 
 ## 條件與流程
 
 <b>條件：</b>無<br>
 <b>流程：</b><br>
 
 ### 一、前往江陵途中被砍死
-1. 第二年二月上旬－唐門會議，選擇**📜議題：(事件)我想去崆峒派留學**。
+
+1. 第二年二月上旬－唐門會議，選擇**📜 議題：(事件)我想去崆峒派留學**。
 2. 第二年八月上旬，得知江陵城被泥教圍攻，離開崆峒派，出發與唐門會合．
-3. 路途中四次隨機事件，發生遭遇打劫的綠林好漢，**🆚決鬥：山賊**，敗北後被砍死．
+3. 路途中四次隨機事件，發生遭遇打劫的綠林好漢，**🆚 決鬥：山賊**，敗北後被砍死．
diff --git a/docs/event/badends/badend-12.md b/docs/event/badends/badend-12.md
@@ -16,12 +16,13 @@ tags:
 
 # {{ $frontmatter.title }}
 
-<img width="720" src="/images/badends/badend12.png">
+<img width="720" src="/images/badends/badend12.webp">
 
 ## 條件與流程
 
 <b>條件：</b>留學崆峒派<br>
 <b>流程：</b><br>
-1. 第二年二月上旬－唐門會議，選擇**📜議題：(事件)我想去崆峒派留學**。
+
+1. 第二年二月上旬－唐門會議，選擇**📜 議題：(事件)我想去崆峒派留學**。
 2. 第二年三月中旬，第二年三月中旬動作前，<Girl3Icon>虞小梅</Girl3Icon>帶領遊覽崆峒派．
-3. 導覽結束後，**🆚決鬥：崆峒戰隊(&奪魂弟子《腳和腿》飛天弟子《頭部》)**，敗戰後被合力殺死．
+3. 導覽結束後，**🆚 決鬥：崆峒戰隊(&奪魂弟子《腳和腿》飛天弟子《頭部》)**，敗戰後被合力殺死．