Merge branch 'develop'

Author: y-yamasaki

.zed/settings.json

@@ -15,8 +15,6 @@
     "node_modules",
     "*.vscode",
     "package-lock.json",
-    "LICENSE",
-    "favicon.ico",
-    "assets/img"
+    "LICENSE"
   ]
 }

README.md

@@ -1,8 +1,9 @@
 # PanKUN Home Page へようこそ
 
-作者のPortfolioと技術Blogが書いてあるホームページです。
+下記ページが記載されている自作ホームページです。
 
-ページは[こちら](https://breadmotion.github.io/WebSite/)
+- Portfolio
+- 技術Blog
+- Product(tool, game, 資料等)
 
-> [!WARNING]
-> 開発途中です。
+ページは[こちら](https://breadmotion.github.io/WebSite/)

assets/css/blog.css

@@ -70,8 +70,8 @@
 /* サムネイル枠 */
 .blog-card .card__thumb {
     flex-shrink: 0;
-    width: 620px;
-    max-width: 40%;
+    width: 220px;
+    height: 120px;
     aspect-ratio: 16 / 9;
     overflow: hidden;
     border-radius: 18px;
@@ -141,7 +141,7 @@
 /* =========================
    レスポンシブ（一覧）
    ========================= */
-@media (max-width: 768px) {
+@media (max-width: 640px) {
     .blog-filters {
         flex-direction: column;
         align-items: stretch;

assets/css/portfolio.css

@@ -70,7 +70,8 @@
 /* サムネイル枠 */
 .portfolio-card .card__thumb {
     flex-shrink: 0;
-    width: 960px;
+    width: 320px;
+    height: 100px;
     max-width: 40%;
     aspect-ratio: 16 / 9;
     overflow: hidden;
@@ -181,7 +182,7 @@
 /* =========================
    レスポンシブ（一覧）
    ========================= */
-@media (max-width: 768px) {
+@media (max-width: 640px) {
     .portfolio-filters {
         flex-direction: column;
         align-items: stretch;

assets/css/products.css

@@ -73,7 +73,8 @@
 /* サムネイル枠 */
 .product-card .card__thumb {
     flex-shrink: 0;
-    width: 620px;
+    width: 260px;
+    height: 150px;
     max-width: 40%;
     aspect-ratio: 16 / 9;
     overflow: hidden;
@@ -180,7 +181,7 @@
 /* =========================
    レスポンシブ
    ========================= */
-@media (max-width: 768px) {
+@media (max-width: 640px) {
     .products-filters {
         flex-direction: column;
         align-items: stretch;

assets/js/top.js

@@ -11,7 +11,7 @@ document.addEventListener("DOMContentLoaded", async () => {
   // Blog: 日付降順で3件
   if (blogListEl) {
     try {
-      const res = await fetch("content/blog/pagelist.json");
+      const res = await fetch("assets/data/blogList.json");
       if (!res.ok) throw new Error(res.statusText);
       const posts = await res.json();
 
@@ -63,7 +63,7 @@ document.addEventListener("DOMContentLoaded", async () => {
   if (portListEl) {
     try {
       const res = await fetch(
-        "content/portfolio/pagelist.json",
+        "assets/data/portfolioList.json",
       );
       if (!res.ok) throw new Error(res.statusText);
       const works = await res.json();

blog/blog_00007.html

@@ -36,8 +36,8 @@ <h1 class="post-detail__title">RClone導入フロー</h1>
 のステップを 一つのフローチャートにまとめて可視化しました。</li>
 </ul>
 <h1>RClone 導入フロー（Mermaid版）</h1>
-<p>最終版のフローチャートは<a href="assets/data/Rclone.html">こちら</a>です。</p>
-<p><img src="assets/img/MMD_rclone.png" alt="RClone導入フローチャート"></p>
+<p>最終版のフローチャートは<a href="/../content/other/Rclone.html">こちら</a>です。</p>
+<p><img src="/../assets/img/MMD_rclone.png" alt="RClone導入フローチャート"></p>
 <hr>
 <h1>このフローで何ができる？</h1>
 <p>このフローは、Windows環境で以下の一連の作業をミスなく実行できるように可視化したものです。</p>

content/blog/blog_00007.md

@@ -19,9 +19,9 @@ WindowsでGoogle Driveと連携し、大容量ファイルをrcloneで管理し
 
 # RClone 導入フロー（Mermaid版）
 
-最終版のフローチャートは[こちら](assets/data/Rclone.html)です。
+最終版のフローチャートは[こちら](/../content/other/Rclone.html)です。
 
-![RClone導入フローチャート](assets/img/MMD_rclone.png)
+![RClone導入フローチャート](/../assets/img/MMD_rclone.png)
 
 ---