CLeanup unused stuff

2026-05-25 21:35:02 +02:00
parent 6bbde5c1cf
commit 3faab3e3e4
20 changed files with 332 additions and 49 deletions
@@ -1,53 +1,210 @@
-<form class="scrying-pool-settings-form">
-  <div class="form-group">
-    <h2>{{localize "SCRYING_POOL.Settings.Title"}}</h2>
-    <p class="hint">{{localize "SCRYING_POOL.Settings.Hint"}}</p>
-  </div>
+<form class="scrying-pool scrying-pool-settings">
+  <div class="scrying-pool-settings__inner">
+    <!-- Drag grip -->
+    <div class="scrying-pool-settings__grip" title="Drag to move">
+      <i class="fa-solid fa-grip-lines"></i>
+    </div>
+    
+    <!-- Close button -->
+    <button type="button" class="scrying-pool-settings__close-btn" data-action="close">
+      <i class="fa-solid fa-times"></i>
+    </button>
+    
+    <!-- Header -->
+    <div class="scrying-pool-settings__header">
+      <h2 class="scrying-pool-settings__title">{{localize "SCRYING_POOL.Settings.Title"}}</h2>
+      <p class="scrying-pool-settings__hint">{{localize "SCRYING_POOL.Settings.Hint"}}</p>
+    </div>

-  <div class="form-group">
-    <label>{{localize "SCRYING_POOL.Settings.StripStatus"}}</label>
-    {{#if hasStrip}}
-      <button type="button" data-action="close-strip" class="scrying-pool-btn scrying-pool-btn-close">
-        <i class="fa-solid fa-eye-slash"></i> {{localize "SCRYING_POOL.Settings.CloseStrip"}}
-      </button>
-    {{else}}
-      <button type="button" data-action="reopen-strip" class="scrying-pool-btn scrying-pool-btn-reopen">
-        <i class="fa-solid fa-eye"></i> {{localize "SCRYING_POOL.Settings.ReopenStrip"}}
-      </button>
-    {{/if}}
+    <!-- Content -->
+    <div class="scrying-pool-settings__content">
+      <div class="scrying-pool-settings__status">
+        <label class="scrying-pool-settings__label">{{localize "SCRYING_POOL.Settings.StripStatus"}}</label>
+        {{#if hasStrip}}
+          <button type="button" data-action="close-strip" class="scrying-pool-settings__btn scrying-pool-settings__btn--close">
+            <i class="fa-solid fa-eye-slash"></i> {{localize "SCRYING_POOL.Settings.CloseStrip"}}
+          </button>
+        {{else}}
+          <button type="button" data-action="reopen-strip" class="scrying-pool-settings__btn scrying-pool-settings__btn--reopen">
+            <i class="fa-solid fa-eye"></i> {{localize "SCRYING_POOL.Settings.ReopenStrip"}}
+          </button>
+        {{/if}}
+      </div>
+    </div>
  </div>

  <style>
-    .scrying-pool-settings-form {
-      padding: 15px;
+    /* Match Director's Board styling */
+    .scrying-pool-settings {
+      background: linear-gradient(175deg, hsl(220, 18%, 13%) 0%, hsl(220, 15%, 10%) 100%);
+      color: var(--sp-text-primary, #dde2e8);
+      border: 1px solid rgba(255, 255, 255, 0.08);
+      border-top: 2px solid hsl(200, 55%, 40%);
+      border-radius: 8px;
+      box-shadow: 0 8px 32px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.35),
+                  inset 0 1px 0 rgba(255, 255, 255, 0.04);
+      min-width: 320px;
    }
-    .scrying-pool-settings-form .form-group {
-      margin-bottom: 15px;
+
+    /* Hide Foundry's default window header */
+    .scrying-pool-settings header.window-header {
+      display: none;
    }
-    .scrying-pool-settings-form .hint {
-      color: var(--text-muted);
-      font-size: 0.9em;
+
+    .scrying-pool-settings__inner {
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      height: 100%;
    }
-    .scrying-pool-btn {
-      padding: 8px 16px;
-      border: none;
-      border-radius: 4px;
-      cursor: pointer;
+
+    /* Drag grip */
+    .scrying-pool-settings__grip {
+      width: 100%;
+      height: 18px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: grab;
+      color: var(--sp-text-muted, hsl(0, 0%, 70%));
+      opacity: 0.35;
+      font-size: 10px;
+      flex-shrink: 0;
+      transition: opacity 0.15s, background 0.15s;
+      user-select: none;
+      border-radius: 8px 8px 0 0;
+    }
+
+    .scrying-pool-settings__grip:hover {
+      opacity: 0.8;
+      background: rgba(255, 255, 255, 0.03);
+    }
+
+    .scrying-pool-settings__grip:active {
+      cursor: grabbing;
+      opacity: 1;
+    }
+
+    /* Close button */
+    .scrying-pool-settings__close-btn {
+      position: absolute;
+      top: 2px;
+      right: 6px;
+      z-index: 10;
+      width: 20px;
+      height: 20px;
+      padding: 0;
+      line-height: 20px;
      font-size: 14px;
-      display: inline-flex;
+      font-weight: 400;
+      background: transparent;
+      color: var(--sp-text-muted, hsl(0, 0%, 70%));
+      border: none;
+      border-radius: 3px;
+      cursor: pointer;
+      opacity: 0.5;
+      transition: opacity 0.15s, background 0.15s, color 0.15s;
+    }
+
+    .scrying-pool-settings__close-btn:hover {
+      opacity: 1;
+      background: rgba(255, 255, 255, 0.08);
+      color: var(--sp-text-primary, #dde2e8);
+    }
+
+    .scrying-pool-settings__close-btn:active {
+      opacity: 0.75;
+    }
+
+    /* Header */
+    .scrying-pool-settings__header {
+      padding: 12px 16px 8px;
+    }
+
+    .scrying-pool-settings__title {
+      margin: 0 0 4px 0;
+      font-size: 16px;
+      font-weight: 600;
+      color: var(--sp-text-primary, #dde2e8);
+      text-align: center;
+    }
+
+    .scrying-pool-settings__hint {
+      margin: 0;
+      font-size: 12px;
+      color: var(--sp-text-muted, hsl(0, 0%, 60%));
+      text-align: center;
+      line-height: 1.4;
+    }
+
+    /* Content */
+    .scrying-pool-settings__content {
+      padding: 8px 16px 16px;
+      display: flex;
+      justify-content: center;
+    }
+
+    .scrying-pool-settings__status {
+      display: flex;
+      flex-direction: column;
      align-items: center;
      gap: 8px;
    }
-    .scrying-pool-btn-reopen {
-      background-color: var(--success);
-      color: white;
+
+    .scrying-pool-settings__label {
+      font-size: 12px;
+      color: var(--sp-text-muted, hsl(0, 0%, 65%));
+      font-weight: 500;
    }
-    .scrying-pool-btn-close {
-      background-color: var(--danger);
-      color: white;
+
+    /* Buttons */
+    .scrying-pool-settings__btn {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      font-size: 12px;
+      font-weight: 500;
+      border: none;
+      border-radius: 4px;
+      padding: 8px 16px;
+      cursor: pointer;
+      transition: background 0.15s, opacity 0.15s, transform 0.1s;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+
+      i {
+        font-size: 12px;
+        pointer-events: none;
+      }
+
+      &:hover {
+        transform: translateY(-1px);
+        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.4);
+      }
+
+      &:active {
+        transform: translateY(0);
+        opacity: 0.9;
+      }
    }
-    .scrying-pool-btn:hover {
-      opacity: 0.9;
+
+    .scrying-pool-settings__btn--reopen {
+      background: linear-gradient(175deg, hsl(120, 60%, 30%) 0%, hsl(120, 60%, 25%) 100%);
+      color: #d0f0d0;
+      border: 1px solid rgba(0, 255, 0, 0.3);
+
+      &:hover {
+        background: linear-gradient(175deg, hsl(120, 60%, 35%) 0%, hsl(120, 60%, 30%) 100%);
+      }
+    }
+
+    .scrying-pool-settings__btn--close {
+      background: linear-gradient(175deg, hsl(0, 60%, 30%) 0%, hsl(0, 60%, 25%) 100%);
+      color: #f0d0d0;
+      border: 1px solid rgba(255, 0, 0, 0.3);
+
+      &:hover {
+        background: linear-gradient(175deg, hsl(0, 60%, 35%) 0%, hsl(0, 60%, 30%) 100%);
+      }
    }
  </style>
 </form>