fix

2026-04-01 20:06:17 +08:00
parent ae3e6f717b
commit afbcd99224
596 changed files with 62930 additions and 13 deletions
--- a/index.html
+++ b/index.html
@@ -206,13 +206,81 @@
        display: block;
        background: #000;
      }
+
+      .modal {
+        position: fixed;
+        inset: 0;
+        z-index: 30;
+        display: none;
+        place-items: center;
+        background: rgba(4, 6, 10, 0.7);
+        backdrop-filter: blur(4px);
+      }
+
+      .modal.active {
+        display: grid;
+      }
+
+      .modal-card {
+        width: min(900px, 92vw);
+        max-height: 90vh;
+        overflow: auto;
+        border: 1px solid rgba(123, 178, 255, 0.5);
+        border-radius: 14px;
+        background: #0c0f1a;
+        padding: 14px;
+      }
+
+      .modal-grid {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: 10px;
+      }
+
+      .modal-grid input,
+      .modal-grid textarea {
+        width: 100%;
+        border: 1px solid rgba(255, 255, 255, 0.18);
+        background: rgba(255, 255, 255, 0.04);
+        color: #fff;
+        border-radius: 8px;
+        padding: 8px;
+      }
+
+      .modal-grid textarea {
+        min-height: 220px;
+        resize: vertical;
+        grid-column: 1 / -1;
+        font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace;
+      }
+
+      .table {
+        margin-top: 10px;
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        border-radius: 10px;
+        overflow: hidden;
+      }
+
+      .row-item {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 10px;
+        padding: 8px 10px;
+        border-top: 1px solid rgba(255, 255, 255, 0.08);
+      }
+
+      .row-item:first-child {
+        border-top: 0;
+      }
    </style>
  </head>
  <body>
    <header class="site-header">
      <div class="brand">Shadervault</div>
      <div class="header-right">
-        <input class="search" placeholder="Search shaders..." />
+        <input id="search-input" class="search" placeholder="Search shaders..." />
+        <button id="manage-btn">管理内容</button>
      </div>
    </header>
    <div id="app">
@@ -243,6 +311,27 @@
        <canvas id="detail-canvas"></canvas>
      </div>
    </section>
-    <script src="./app.js"></script>
+
+    <section id="manage-modal" class="modal" aria-hidden="true">
+      <div class="modal-card">
+        <div class="topbar">
+          <strong>Shader 内容管理</strong>
+          <div style="display:flex; gap:8px">
+            <button id="close-manage-btn">关闭</button>
+          </div>
+        </div>
+        <div class="modal-grid">
+          <input id="shader-name-input" placeholder="名称" />
+          <input id="shader-author-input" placeholder="作者（可选）" />
+          <textarea id="shader-code-input" placeholder="粘贴 GLSL，必须包含 mainImage"></textarea>
+        </div>
+        <div style="display:flex; gap:8px; margin-top:10px;">
+          <button id="save-shader-btn">保存到后端</button>
+          <button id="fill-example-btn">填入示例</button>
+        </div>
+        <div class="table" id="shader-admin-list"></div>
+      </div>
+    </section>
+    <script src="./frontend.js"></script>
  </body>
 </html>