変更内容はREADME.mdを読みましょう
This commit is contained in:
parent
e9c6cccb4b
commit
ca7a2d1aab
10
README.md
10
README.md
|
|
@ -1,3 +1,13 @@
|
|||
# ゆずねっとサポート
|
||||
|
||||
本家：https://github.com/Daichimarukana/support_uwuzu_net
|
||||
|
||||
## 変更点
|
||||
- ダークモード対応
|
||||
- 記事をMarkdownファイルで記述に
|
||||
- jQueryからVanilla JSへ移管
|
||||
- フッター+クレジットを追加
|
||||
- CSS短縮
|
||||
- コード整形
|
||||
- モバイル表示のサイズを最小限に変更
|
||||
- 記事画面で検索ボックスを削除
|
||||
|
|
|
|||
|
|
@ -0,0 +1,81 @@
|
|||
@media (prefers-color-scheme: dark) {
|
||||
body {
|
||||
background-color: #0b0b0b;
|
||||
}
|
||||
|
||||
.top {
|
||||
background-color: #ffc832;
|
||||
}
|
||||
|
||||
.top .left a {
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.top .right .searchbox {
|
||||
border: solid 1px #000000;
|
||||
background-color: #0b0b0b;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
main .contents .items:hover {
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
main .contents .items {
|
||||
background-color: #181616;
|
||||
}
|
||||
|
||||
main h1,
|
||||
main p,
|
||||
main .contents .items h1,
|
||||
main .contents .items p,
|
||||
main .contents .items .date,
|
||||
main .article .date,
|
||||
main .article h1,
|
||||
main .article h2,
|
||||
main .article h3,
|
||||
main .article p {
|
||||
color: #f0f0f0;
|
||||
}
|
||||
|
||||
main .article td,
|
||||
th {
|
||||
border: solid 1px #f0f0f0;
|
||||
}
|
||||
|
||||
main .article pre,
|
||||
.link_btn,
|
||||
.error p {
|
||||
color: #0b0b0b;
|
||||
}
|
||||
|
||||
main .article pre {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
|
||||
.link_btn {
|
||||
background-color: #ffc832;
|
||||
}
|
||||
|
||||
.error {
|
||||
background-color: #ff4848;
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.error p {
|
||||
text-shadow: 0 0 0 #0b0b0b;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #000000;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
ul, li, ol {
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
|
@ -3,8 +3,10 @@
|
|||
body {
|
||||
margin: 0px;
|
||||
width: 100%;
|
||||
height: fit-content;
|
||||
background-color: #f7f7f7;
|
||||
height: 100%;
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr auto;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.top {
|
||||
|
|
@ -13,7 +15,6 @@ body {
|
|||
height: 64px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #ffc832;
|
||||
border-radius: 0px 0px 15px 15px;
|
||||
}
|
||||
|
||||
|
|
@ -40,7 +41,6 @@ body {
|
|||
width: fit-content;
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
margin: 8px 0px;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.top .right {
|
||||
|
|
@ -54,7 +54,6 @@ body {
|
|||
margin: 16px;
|
||||
border-radius: 25px;
|
||||
padding-left: 8px;
|
||||
border: solid 1px #ffffff;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
|
@ -64,16 +63,12 @@ main {
|
|||
}
|
||||
|
||||
main h1 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
main p {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: normal;
|
||||
color: #252525;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
|
@ -90,21 +85,13 @@ main .contents .items {
|
|||
cursor: pointer;
|
||||
width: calc(50% - 40px);
|
||||
height: fit-content;
|
||||
background-color: #ffffff;
|
||||
border-radius: 10px;
|
||||
padding: 16px;
|
||||
margin-bottom: 16px;
|
||||
transition: all 250ms ease-out;
|
||||
}
|
||||
|
||||
main .contents .items:hover {
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
main .contents .items h1 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 24px;
|
||||
margin: 4px 0px;
|
||||
}
|
||||
|
|
@ -112,15 +99,11 @@ main .contents .items h1 {
|
|||
main .contents .items p {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: normal;
|
||||
color: #252525;
|
||||
font-size: 14px;
|
||||
margin: 4px 0px;
|
||||
}
|
||||
|
||||
main .contents .items .date {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
|
|
@ -129,38 +112,36 @@ main .article {
|
|||
height: fit-content;
|
||||
}
|
||||
|
||||
main .article .date {
|
||||
main h1
|
||||
main .contents .items .date,
|
||||
main .contents .items h1
|
||||
main .article .date,
|
||||
main .article h1,
|
||||
main .article h2,
|
||||
main .article h3 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
}
|
||||
|
||||
main .article .date {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
main .article h1 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
main .article h2 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 32px;
|
||||
}
|
||||
|
||||
main .article h3 {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: bold;
|
||||
color: #252525;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
main .article p {
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: normal;
|
||||
color: #252525;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
|
@ -174,16 +155,13 @@ main .article table {
|
|||
main .article td,
|
||||
th {
|
||||
padding: 4px 16px;
|
||||
border: solid 1px #252525;
|
||||
}
|
||||
|
||||
main .article pre {
|
||||
width: 100%;
|
||||
height: fit-content;
|
||||
background-color: #252525;
|
||||
padding: 16px;
|
||||
border-radius: 15px;
|
||||
color: #f7f7f7;
|
||||
font-family: "BIZ UDGothic", sans-serif;
|
||||
}
|
||||
|
||||
|
|
@ -192,8 +170,6 @@ main .article pre {
|
|||
width: fit-content;
|
||||
height: 32px;
|
||||
padding: 8px 16px;
|
||||
background-color: #ffc832;
|
||||
color: #f7f7f7;
|
||||
text-decoration: none;
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-weight: normal;
|
||||
|
|
@ -212,9 +188,7 @@ main .article pre {
|
|||
width: fit-content;
|
||||
height: 32px;
|
||||
z-index: 9999;
|
||||
background-color: #ff4848;
|
||||
border-radius: 20px;
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.15);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
|
|
@ -226,16 +200,14 @@ main .article pre {
|
|||
line-height: 24px;
|
||||
font-family: "Inter", "BIZ UDPGothic", sans-serif;
|
||||
font-size: 16px;
|
||||
color: #f7f7f7;
|
||||
color: transparent;
|
||||
text-shadow: 0 0 0 #f7f7f7;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #f0f0f0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@keyframes slideDown {
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
@media (prefers-color-scheme: light) {
|
||||
body {
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.top {
|
||||
background-color: #ffc832;
|
||||
}
|
||||
|
||||
.top .left a {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.top .right .searchbox {
|
||||
border: solid 1px #ffffff;
|
||||
}
|
||||
|
||||
main .contents .items:hover {
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
main .contents .items {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
main h1,
|
||||
main p,
|
||||
main .contents .items h1,
|
||||
main .contents .items p,
|
||||
main .contents .items .date,
|
||||
main .article .date,
|
||||
main .article h1,
|
||||
main .article h2,
|
||||
main .article h3,
|
||||
main .article p {
|
||||
color: #252525;
|
||||
}
|
||||
|
||||
main .article td,
|
||||
th {
|
||||
border: solid 1px #252525;
|
||||
}
|
||||
|
||||
main .article pre,
|
||||
.link_btn,
|
||||
.error p {
|
||||
color: #f7f7f7;
|
||||
}
|
||||
|
||||
main .article pre {
|
||||
background-color: #252525;
|
||||
}
|
||||
|
||||
.link_btn {
|
||||
background-color: #ffc832;
|
||||
}
|
||||
|
||||
.error {
|
||||
background-color: #ff4848;
|
||||
box-shadow: 0 0px 48px 0 rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.error p {
|
||||
text-shadow: 0 0 0 #f7f7f7;
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: #f0f0f0;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
footer a {
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
19
index.html
19
index.html
|
|
@ -3,12 +3,14 @@
|
|||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<link rel="stylesheet" href="/css/style.css" type="text/css" />
|
||||
|
||||
<link rel="icon" href="/img/uwuzu_net_icon.png" />
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<title>ゆずねっとサポート</title>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||||
<link rel="stylesheet" href="/css/layout.css" type="text/css" />
|
||||
<link rel="stylesheet" href="/css/light.css" type="text/css" />
|
||||
<link rel="stylesheet" href="/css/dark.css" type="text/css" />
|
||||
</head>
|
||||
<body>
|
||||
<div id="error" class="error" style="display: none">
|
||||
|
|
@ -45,13 +47,16 @@
|
|||
</main>
|
||||
|
||||
<footer>
|
||||
©2024-2025
|
||||
Created by
|
||||
<a class="credit" href="https://daichimarukana.com">Daichimarukana</a>
|
||||
|
||||
<br>
|
||||
Created by Daichimarukana
|
||||
<br>
|
||||
Edited by Last2014
|
||||
|
||||
Edited by
|
||||
<a class="credit" href="https://last2014.com">Last2014</a>
|
||||
</footer>
|
||||
</body>
|
||||
|
||||
<script src="/js/script.js"></script>
|
||||
<script src="/js/credit.js"></script>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
const footer = document.querySelector("footer");
|
||||
|
||||
const startYear = 2024;
|
||||
const nowYear = new Date().getFullYear();
|
||||
|
||||
if (startYear === nowYear) {
|
||||
footer.innerHTML = `
|
||||
©${String(startYear)} uwuzu.net
|
||||
|
||||
<br>
|
||||
|
||||
` + footer.innerHTML;
|
||||
} else {
|
||||
footer.innerHTML = `
|
||||
©${String(startYear)}-${String(nowYear)} uwuzu.net
|
||||
|
||||
<br>
|
||||
|
||||
` + footer.innerHTML;
|
||||
}
|
||||
|
|
@ -69,7 +69,7 @@ document.addEventListener("DOMContentLoaded", async () => {
|
|||
|
||||
// URLパラメータから記事IDを取得
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const articleId = urlParams.get("articles");
|
||||
const articleId = urlParams.get("article");
|
||||
|
||||
if (articleId) {
|
||||
const article = articlesData.find(a => a && a.id === articleId);
|
||||
|
|
@ -90,7 +90,7 @@ document.addEventListener("DOMContentLoaded", async () => {
|
|||
if (article) {
|
||||
showArticle(article);
|
||||
try {
|
||||
history.pushState({ articleId: id }, article.title, `?articles=${id}`);
|
||||
history.pushState({ articleId: id }, article.title, `?article=${id}`);
|
||||
} catch (error) {
|
||||
console.warn("History API操作に失敗しました:", error);
|
||||
}
|
||||
|
|
@ -191,6 +191,9 @@ document.addEventListener("DOMContentLoaded", async () => {
|
|||
for (let i = 0; i < articleList.length; i++) {
|
||||
articleList[i].style.display = "none";
|
||||
}
|
||||
|
||||
// 検索ボックス削除
|
||||
document.querySelector(".right").remove();
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
|
|
|
|||
Loading…
Reference in New Issue