From 0c361cd8ae8b1689a36e7da427148c93cd1f2ad9 Mon Sep 17 00:00:00 2001 From: Flatlogic Bot Date: Thu, 18 Dec 2025 03:56:08 +0000 Subject: [PATCH] Auto commit: 2025-12-18T03:56:08.868Z --- assets/css/custom.css | 163 +++++++++++++++++++++++++----------------- index.php | 3 + 2 files changed, 99 insertions(+), 67 deletions(-) diff --git a/assets/css/custom.css b/assets/css/custom.css index 7ffdf9b..7f2a119 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -1,97 +1,122 @@ +/* --- Modern Japanese Retro Theme --- */ + +:root { + --primary-color: #5A8D8D; /* Deep Teal */ + --accent-color: #D65A5A; /* Muted Red */ + --bg-light: #F8F8F8; /* Off-white background */ + --text-dark: #333333; + --text-light: #666666; + --border-color: #E0E0E0; + --shadow-light: rgba(0, 0, 0, 0.05); +} body { - background: #f0f0f0 url('https://www.transparenttextures.com/patterns/lined-paper.png'); - font-family: Verdana, Geneva, sans-serif; - color: #333; + font-family: 'Noto Sans JP', sans-serif; + background-color: var(--bg-light); + color: var(--text-dark); + line-height: 1.6; } .header { - background: linear-gradient(to bottom, #eaeaea, #cccccc); - border-bottom: 1px solid #999; - padding: 15px 20px; + background: var(--primary-color); + color: var(--bg-light); + padding: 20px 25px; display: flex; justify-content: space-between; align-items: center; + border-bottom: none; + box-shadow: 0 2px 4px var(--shadow-light); } .header h1 { - font-family: Georgia, Times, 'Times New Roman', serif; - font-size: 2.5em; - color: #000080; /* Classic Blue */ + font-family: 'Zen Old Mincho', serif; + font-size: 2.8em; + color: var(--bg-light); margin: 0; - text-shadow: 2px 2px 3px #aaa; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); } .auth-links a { - margin-left: 15px; - color: #000080; + margin-left: 20px; + color: var(--bg-light); text-decoration: none; + font-weight: 300; + transition: color 0.3s ease; +} + +.auth-links a:hover { + color: var(--accent-color); } .container { - background-color: #fff; - border: 1px solid #ccc; - box-shadow: 0 0 10px rgba(0,0,0,0.1); - border-radius: 5px; + background-color: #FFFFFF; + border: 1px solid var(--border-color); + box-shadow: 0 5px 15px var(--shadow-light); + border-radius: 8px; + overflow: hidden; /* For inner elements like category-list and content */ } .category-list { - background-color: #f8f9fa; - border-right: 1px solid #dee2e6; - padding: 15px; -} - -.category-list h3 { - font-family: Georgia, Times, "Times New Roman", serif; - font-size: 1.5rem; - color: #0048ad; - border-bottom: 2px solid #f2c94c; - padding-bottom: 10px; - margin-bottom: 15px; -} - -.category-list .nav-link { - color: #0000FF; - padding: 5px 0; - font-size: 0.9rem; - text-decoration: none; -} - -.category-list .nav-link:hover { - text-decoration: underline; -} - -.content { + background-color: #FAFAFA; + border-right: 1px solid var(--border-color); padding: 20px; } -.content h2 { - font-family: Georgia, Times, "Times New Roman", serif; - color: #0048ad; - border-bottom: 2px solid #ccc; +.category-list h3 { + font-family: 'Zen Old Mincho', serif; + font-size: 1.8rem; + color: var(--primary-color); + border-bottom: 2px solid var(--accent-color); padding-bottom: 10px; margin-bottom: 20px; } +.category-list .nav-link { + color: var(--text-dark); + padding: 8px 0; + font-size: 1rem; + text-decoration: none; + transition: color 0.3s ease, transform 0.2s ease; +} + +.category-list .nav-link:hover { + color: var(--primary-color); + transform: translateX(5px); +} + +.content { + padding: 25px; +} + +.content h2 { + font-family: 'Zen Old Mincho', serif; + color: var(--primary-color); + border-bottom: 2px solid var(--border-color); + padding-bottom: 12px; + margin-bottom: 25px; +} + .link-item { margin-bottom: 20px; - border: 1px solid #ddd; + border: 1px solid var(--border-color); padding: 15px; - border-radius: 4px; - background-color: #fff; - transition: box-shadow 0.3s ease; + border-radius: 6px; + background-color: #FFFFFF; + transition: box-shadow 0.3s ease, transform 0.2s ease; } .link-item:hover { - box-shadow: 0 4px 8px rgba(0,0,0,0.1); + box-shadow: 0 8px 20px var(--shadow-light); + transform: translateY(-3px); } .link-item .thumbnail { - width: 120px; - height: 90px; + width: 150px; /* Slightly larger thumbnail */ + height: 100px; object-fit: cover; - border: 1px solid #ccc; - margin-right: 15px; + border: 1px solid var(--border-color); + border-radius: 4px; + margin-right: 20px; float: left; } @@ -100,36 +125,40 @@ body { } .link-item-title { - font-size: 1.2rem; - font-weight: bold; + font-size: 1.3rem; + font-weight: 700; margin-bottom: 5px; } .link-item-title a { - color: #0000FF; + color: var(--primary-color); text-decoration: none; + transition: color 0.3s ease; } .link-item-title a:hover { + color: var(--accent-color); text-decoration: underline; } .link-item-url { - font-size: 0.8rem; - color: #006400; /* Dark Green */ - margin-bottom: 5px; + font-size: 0.9rem; + color: var(--text-light); + margin-bottom: 8px; display: block; } .link-item-description { - font-size: 0.9rem; - color: #555; + font-size: 1rem; + color: var(--text-dark); } .footer { text-align: center; - padding: 20px 0; - background-color: #343a40; - color: white; + padding: 25px 0; + background-color: var(--primary-color); + color: var(--bg-light); font-size: 0.9rem; -} + margin-top: 40px; + box-shadow: 0 -2px 4px var(--shadow-light); +} \ No newline at end of file diff --git a/index.php b/index.php index c1e8b2e..4667bfe 100644 --- a/index.php +++ b/index.php @@ -9,6 +9,9 @@ + + +