fix: NCWF-2 bugs and desing fixes (#7)

Co-authored-by: Lala, Shahd <Shahd.Lala@sybit.de> Reviewed-on: #7
2026-05-15 02:16:43 +02:00
parent 70a4debb40
commit c02414ea40
45 changed files with 3167 additions and 1277 deletions
@@ -0,0 +1,51 @@
+<details class="card disclose">
+  <summary>
+    <span class="panel-title">Export Position</span>
+    <span class="chev" aria-hidden="true">
+      <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+        <polyline points="6 9 12 15 18 9"/>
+      </svg>
+    </span>
+  </summary>
+
+  <div class="panel-body">
+    <div class="seg" role="tablist" aria-label="Export format">
+      <button
+        class="seg-btn"
+        [class.active]="exportKind === 'fen'"
+        role="tab"
+        [attr.aria-selected]="exportKind === 'fen'"
+        (click)="setKind('fen')">FEN</button>
+      <button
+        class="seg-btn"
+        [class.active]="exportKind === 'pgn'"
+        role="tab"
+        [attr.aria-selected]="exportKind === 'pgn'"
+        (click)="setKind('pgn')">PGN</button>
+    </div>
+
+    <textarea class="export-out" [value]="exportValue" [placeholder]="exportPlaceholder" rows="4" readonly></textarea>
+
+    <div class="export-row">
+      <button class="btn" type="button" (click)="copy()">
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
+          <rect x="9" y="9" width="13" height="13" rx="2"/>
+          <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/>
+        </svg>
+        Copy
+      </button>
+      <button class="btn" type="button" (click)="download()">
+        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
+          <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/>
+          <polyline points="7 10 12 15 17 10"/>
+          <line x1="12" y1="15" x2="12" y2="3"/>
+        </svg>
+        Download
+      </button>
+    </div>
+
+    @if (copyNotice) {
+      <p class="copy-notice">{{ copyNotice }}</p>
+    }
+  </div>
+</details>