From 9bd200a2c4ccfda30e8ddee2ae819414711f75d5 Mon Sep 17 00:00:00 2001
From: yyamashita <yyamashita@hetzner.yyamashita.com>
Date: Sat, 7 Nov 2026 09:04:16 +0900
Subject: 中野セットとノア中野を追加し、ノアなどは表の上にボタンで出す
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 static/index.html | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

(limited to 'static/index.html')

diff --git a/static/index.html b/static/index.html
index ed7a2da..0c2cffe 100644
--- a/static/index.html
+++ b/static/index.html
@@ -33,9 +33,10 @@
   td.closed { background: #fff; }
   td.hour { border-right-color: #bbb; }
   .err { color: #c23a3a; font-size: 12px; font-weight: normal; }
-  .offline { margin-top: 16px; }
-  .offline h2 { font-size: 15px; margin: 0 0 6px; }
-  .offline li { margin: 4px 0; font-size: 14px; }
+  .offline { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
+  .offline a.btn { display: inline-block; padding: 6px 12px; border: 1px solid var(--line); border-radius: 6px; text-decoration: none; color: #222; font-size: 13px; }
+  .offline a.btn:hover { background: #f6f6f6; }
+  .offline .meta { display: inline; margin-left: 6px; }
   .note { font-size: 12px; color: #777; margin-top: 10px; }
   .legend span { display: inline-block; width: 14px; height: 14px; vertical-align: middle; border: 1px solid var(--line); margin: 0 4px 0 10px; }
   #status { font-size: 13px; color: #777; }
@@ -62,9 +63,9 @@
   <span class="legend"><span style="background:var(--free-bg)"></span>空き<span style="background:#e6e6e6"></span>予約済み</span>
 </div>
 
+<div class="offline" id="offline"></div>
 <div class="wrap"><table id="grid"></table></div>
 <p class="note" id="note"></p>
-<div class="offline" id="offline"></div>
 
 <script>
 const $ = (id) => document.getElementById(id);
@@ -175,10 +176,9 @@ function render() {
     : "";
 
   const offline = data.studios.filter((s) => !s.online);
-  $("offline").innerHTML = offline.length
-    ? `<h2>オンラインで空きを確認できないスタジオ</h2><ul>${offline.map((s) =>
-        `<li><a href="${esc(s.url)}" target="_blank" rel="noopener">${esc(s.name)}</a>（${esc(s.area)}）${s.phone ? ` <a href="tel:${esc(s.phone)}">${esc(s.phone)}</a>` : " 問い合わせフォーム"}</li>`).join("")}</ul>`
-    : "";
+  // 空き枠を取れないスタジオは、公式サイト（空室検索）へのボタンにする
+  $("offline").innerHTML = offline.map((s) =>
+    `<a class="btn" href="${esc(s.url)}" target="_blank" rel="noopener">${esc(s.name)} ↗<span class="meta">${s.phone ? esc(s.phone) : "問い合わせフォーム"}</span></a>`).join("");
 }
 
 async function init() {
-- 
cgit v1.3