From be2d1bfd78e96da0f5e2d9295638023bfaa467d4 Mon Sep 17 00:00:00 2001 From: zenn Date: Mon, 12 Jan 2026 00:48:20 +0900 Subject: [PATCH] [260112] Initial Build --- font/NovaBySoristudio-Regular.otf | Bin 0 -> 18272 bytes index.html | 105 ++++++++ script.js | 68 +++++ style.css | 406 ++++++++++++++++++++++++++++++ 4 files changed, 579 insertions(+) create mode 100644 font/NovaBySoristudio-Regular.otf create mode 100644 index.html create mode 100644 script.js create mode 100644 style.css diff --git a/font/NovaBySoristudio-Regular.otf b/font/NovaBySoristudio-Regular.otf new file mode 100644 index 0000000000000000000000000000000000000000..8142de08657315e80f1cff92fc9da9a66a37c656 GIT binary patch literal 18272 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 + + + + + + SORI STUDIO + + + +
+

sori.studio

+
+ +
+ +

Core Infrastructure

+
+ + + + +
+
Proxy Manager
+ Nginx Proxy Manager +
+
+
spm.sori.studio
+

리버스 프록시 관리자

+
+ + + + + +
+
Gitea
+ Gitea +
+
+
git.sori.studio
+

"zenn"의 개발 리소스 저장소

+
+ + + + + +
+
Pocket Base
+ Pocket Base +
+
+
api.sori.studio
+

sori.studio 맞춤형 API 서버

+
+ +
+
+ +
+ +

Public Services

+
+ + + +
+
UNIARE
+ Union Arena Deck Builder +
+
+
uniare.sori.studio
+

반다이 남코의 TCG 'Union Arena'의 덱 빌더

+
+ +
+
+ +
+ +

Personal Archive

+
+ + + + +
+
Mastodon
+ SoRi.Space +
+
+
sns.sori.studio
+

소리 스튜디오(Sori Studio)의 공식 마스토돈 인스턴스입니다.

+

운영자 zenn의 개인적인 기록과 소소한 이야기를 공유하는 독립적인 공간입니다.

+
+ + +
+ +
+ + + + diff --git a/script.js b/script.js new file mode 100644 index 0000000..894f44f --- /dev/null +++ b/script.js @@ -0,0 +1,68 @@ +// ping +async function checkStatus() { + const cards = document.querySelectorAll(".card"); + + cards.forEach(async (card) => { + const url = card.getAttribute("data-url"); + const dot = card.querySelector(".bolt.tr"); + + try { + const controller = new AbortController(); + const timeoutId = setTimeout(() => controller.abort(), 5000); + + await fetch(url, { + mode: "no-cors", + cache: "no-cache", + signal: controller.signal, + }); + + dot.classList.remove("status-offline"); + dot.classList.add("status-online"); + clearTimeout(timeoutId); + } catch (e) { + dot.classList.remove("status-online"); + dot.classList.add("status-offline"); + } + }); +} + +checkStatus(); +setInterval(checkStatus, 300000); + +// bolt animation +function startBoltAction() { + const allBolts = document.querySelectorAll(".bolt, .header-bolt"); + if (allBolts.length === 0) return; + + const availableBolts = Array.from(allBolts).filter( + (bolt) => !bolt.classList.contains("bolt-acting") + ); + + if (availableBolts.length > 0) { + const randomBolt = + availableBolts[Math.floor(Math.random() * availableBolts.length)]; + + const baseRot = + randomBolt.getAttribute("data-rotate") || + randomBolt.style.getPropertyValue("--r") || + "0"; + + randomBolt.style.setProperty( + "--r", + baseRot.toString().replace("deg", "") + "deg" + ); + + randomBolt.classList.add("bolt-acting"); + + setTimeout(() => { + randomBolt.classList.remove("bolt-acting"); + }, 8100); + } + + const nextInterval = Math.random() * 4000 + 3000; + setTimeout(startBoltAction, nextInterval); +} + +window.addEventListener("load", () => { + setTimeout(startBoltAction, 2000); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..ad8a484 --- /dev/null +++ b/style.css @@ -0,0 +1,406 @@ +@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css"); + +@import url("https://fonts.googleapis.com/css2?family=Anton&family=Orbitron:wght@800&family=Staatliches&family=Tenor+Sans&display=swap"); + +@font-face { + font-family: "Nova"; + src: url("./font/NovaBySoristudio-Regular.otf") format("opentype"); + font-weight: normal; + font-style: normal; +} + +body { + margin: 0; + padding: 0; + background-color: #050505; + background: radial-gradient(circle at 50% 50%, #1a1a1a 0%, #050505 100%); + color: #e0e0e0; + font-family: "Pretendard", system-ui, sans-serif; + min-height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + word-break: keep-all; +} + +.nova { + font-family: "nova"; +} + +header { + padding: 80px 0 50px; + text-align: center; +} + +header h1 { + font-family: "Tenor Sans", sans-serif; + font-size: 3.5rem; + font-weight: 900; + letter-spacing: 4px; + text-transform: lowercase; + margin: 0; + + background: linear-gradient(to bottom, #ffffff 30%, #a1a1a1 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + + filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5)); +} + +header h1 .dot-point { + background: none; + -webkit-background-clip: initial; + -webkit-text-fill-color: initial; + + color: #00ff88; + display: inline-block; + + text-shadow: 0 0 8px rgba(0, 255, 136, 0.8); + + animation: pulse-dot 2s infinite; + margin: 0 2px; +} +@keyframes pulse-dot { + 0%, + 100% { + opacity: 0.5; + text-shadow: 0 0 8px rgba(0, 255, 136, 0.8); + } + 50% { + opacity: 1; + text-shadow: 0 0 2px rgba(0, 255, 136, 0.2); + } +} + +/* [1] 공통 섹션 레이아웃 */ +.category-section { + width: 95%; + max-width: 1440px; + margin: 0 auto 60px; /* 중앙 정렬 유지 */ +} + +/* [2] 섹션 타이틀 (반응형 대응) */ +.section-title { + font-family: 'Tenor Sans', sans-serif; + font-size: 1.25rem; + color: #666; + text-transform: uppercase; + letter-spacing: 3px; + padding-left: 15px; + margin-bottom: 25px; + border-left: 3px solid #00ff88; /* 나사 불빛과 맞춘 포인트 컬러 추천 */ + display: flex; + align-items: center; +} + +.section-title::after { + content: ""; + flex: 1; + height: 1px; + background: linear-gradient(to right, #333, transparent); + margin-left: 20px; +} + +/* [3] 그리드 컨테이너 (부모 폭에 맞춤) */ +.container { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 1.5rem; + /* padding 제거 (부모인 category-section에서 폭 제어) */ + width: 100%; +} + +/* --- 반응형 구간 설정 --- */ + +/* 1. 태블릿 (1200px 이하) */ +@media (max-width: 1200px) { + .category-section { + max-width: 900px; /* 2열 카드 폭에 맞춤 */ + } + .container { + grid-template-columns: repeat(2, 1fr); + } +} + +/* 2. 모바일 (768px 이하) */ +@media (max-width: 768px) { + .category-section { + max-width: 500px; /* 1열 카드 폭에 맞춤 */ + margin-bottom: 40px; + } + .container { + grid-template-columns: 1fr; + gap: 1.25rem; + } + .section-title { + font-size: 1rem; /* 모바일에서 타이틀 살짝 축소 */ + letter-spacing: 2px; + } + header h1 { + font-size: 2.5rem; + } +} + +.card { + position: relative; + display: flex; + flex-direction: column; + gap: 0.5rem; + + background: linear-gradient(145deg, #242424 0%, #111111 100%); + backdrop-filter: blur(40px); + -webkit-backdrop-filter: blur(40px); + + border: 1px solid #222222; + + box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.05); + + border-radius: 24px; + padding: 30px; + text-decoration: none; + color: inherit; + transition: all 0.4s ease; +} + +.card:hover { + transform: translateY(-8px); + background: linear-gradient(145deg, #1a1a1a 0%, #0d0d0d 100%); + border-color: #333333; +} + +.bolt { + position: absolute; + width: 1rem; + height: 1rem; + background: linear-gradient(135deg, #777 0%, #333 100%); + border-radius: 50%; + border: 1px solid #111; +} + +.tl { + top: 1rem; + left: 1rem; +} +.tr { + top: 1rem; + right: 1rem; +} +.bl { + bottom: 1rem; + left: 1rem; +} +.br { + bottom: 1rem; + right: 1rem; +} + +.bolt::before { + content: ""; + position: absolute; + top: 50%; + left: 50%; + width: 64%; + height: 1.5px; + background: #222; + border-radius: 4px; + transform: translate(-50%, -50%) rotate(var(--r, 0deg)); + transition: background 0.3s; +} + +.bolt.bolt-acting::before { + transform: translate(-50%, -50%) rotate(calc(var(--r, 0deg) + 45deg)); + background: #000; +} + +.bolt[data-rotate="45"]::before { + transform: translate(-50%, -50%) rotate(45deg); +} +.bolt[data-rotate="160"]::before { + transform: translate(-50%, -50%) rotate(160deg); +} +.bolt[data-rotate="-20"]::before { + transform: translate(-50%, -50%) rotate(-20deg); +} +.bolt[data-rotate="100"]::before { + transform: translate(-50%, -50%) rotate(100deg); +} + +.card-inner { + display: flex; + width: 100%; + gap: 1rem; + align-items: center; +} + +.card-icon { + flex-shrink: 0; + width: auto; + height: 60px; + border-radius: 15px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + overflow: hidden; + font-family: "Nova"; + + font-size: 36px; + line-height: 1; +} + +.icon-nova { + font-family: "Nova"; + font-size: 3rem; + line-height: 1; + -webkit-text-stroke: 1px rgba(255, 255, 255, 0.5); +} + +.icon-ruby { + font-family: "pretendard", sans-serif; + font-size: 12px; + line-height: 1; + color: #eaeaea; + font-weight: 700; +} + +.card-content { + flex-grow: 1; + display: flex; + flex-direction: column; + justify-content: center; + min-width: 0; +} + +.title-wrapper { + display: flex; + justify-content: center; + align-items: center; + gap: 10px; + width: 100%; +} + +.url-display { + margin: 1.25rem 0 0.25rem; + font-size: 1.125rem; + font-weight: 700; + color: #acacac; + + text-transform: lowercase; + letter-spacing: -0.3px; + text-align: center; + + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + flex: 1; + font-family: "Pretendard", sans-serif; +} + +.desc { + margin: 0.25rem 0 0; + color: #888888; + font-size: 0.85rem; + font-weight: 400; + color: #666666; + text-align: center; +} + +.status-dot { + position: absolute; + top: 1rem; + right: 1rem; + flex-shrink: 0; + width: 1rem; + height: 1rem; + border-radius: 50%; + transition: background-color 0.5s ease; +} + +.status-online { + background-color: #00ff88; + box-shadow: 0 0 10px #00ff88; + animation: pulse 2s infinite; +} + +.status-offline { + background-color: #ff4444; + box-shadow: 0 0 10px #ff4444; + animation: none; +} + +@keyframes pulse { + 0% { + transform: scale(0.95); + box-shadow: 0 0 0 0 rgba(0, 255, 136, 0.7); + } + 70% { + transform: scale(1); + box-shadow: 0 0 0 10px rgba(0, 255, 136, 0); + } + 100% { + transform: scale(0.95); + box-shadow: 0 0 0 0 rgba(0, 255, 136, 0); + } +} + +@media (max-width: 768px) { + .container { + grid-template-columns: 1fr; + } +} + +@keyframes bolt-full-cycle { + 0% { + transform: translate(-50%, -50%) rotate(var(--r, 0deg)); + } + 15% { + transform: translate(-50%, -50%) rotate(calc(var(--r, 0deg) + 1080deg)); + } + 85% { + transform: translate(-50%, -50%) rotate(calc(var(--r, 0deg) + 1080deg)); + } + 100% { + transform: translate(-50%, -50%) rotate(var(--r, 0deg)); + } +} + +.bolt-acting::before { + animation: bolt-full-cycle 16s cubic-bezier(0.65, 0, 0.35, 1) forwards; +} + + +/* 1. 전체 스크롤바 영역 (폭 설정) */ +::-webkit-scrollbar { + width: 8px; /* 스크롤바 두께를 얇게 조절 */ + height: 8px; /* 가로 스크롤바 대비 */ +} + +/* 2. 스크롤바 배경 (트랙) */ +::-webkit-scrollbar-track { + background: #050505; /* 바디 배경색과 맞춰서 일체감 부여 */ +} + +/* 3. 스크롤 바 (움직이는 부분) */ +::-webkit-scrollbar-thumb { + background: linear-gradient(to bottom, #333, #222); /* 나사 머리 같은 금속 느낌 */ + border-radius: 10px; + border: 2px solid #050505; /* 트랙과 분리되어 보이는 효과 (공간감) */ +} + +/* 4. 마우스 호버 시 (사용자가 잡았을 때) */ +::-webkit-scrollbar-thumb:hover { + background: #444; /* 살짝 밝아지며 반응 */ + border-color: #050505; +} + +/* 5. (선택사항) 스크롤바가 작동할 때 나사 불빛과 맞춘 포인트 */ +::-webkit-scrollbar-thumb:active { + background: #00ff88; /* 나사 LED 컬러로 포인트 */ + box-shadow: 0 0 10px #00ff88; +} + +/* Firefox용 설정 */ +* { + scrollbar-width: thin; + scrollbar-color: #333 #050505; +} \ No newline at end of file