v2.0.13 — edge-to-edge fullscreen overlays, rounded-cards badge variant

- Overlays: drop the 24/40/54px inset frame on tasks, calendar,
  gallery, search, detail, edit modal, bookmarks, email, gitea and
  oumta-dashboard so they fill the viewport like the support
  overlay does. Removed the shared border-radius + overflow:hidden
  rule on their inner containers (only settings + dialog still use
  it) so the card's top colour bar isn't clipped.
- Done badge: the corner-triangle variant gets chopped by rounded
  card borders. applyDesign now toggles body.rounded-cards whenever
  --ui-radius-card > 0, and the CSS swaps the triangle for a 18px
  circle pill with the check centred. Triangle stays for square
  cards.
- Support plugin: "Close ticket" button is a regular labelled
  button now (was a 30×30 icon ghost that clipped the text). Empty
  hero state ("select a ticket") matches the board's empty style —
  centred in the column with a pixel-font blink-cursor label.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
thandClaude Opus 4.7 committed 2026-04-19 12:34:50 +02:00
1 parent 7bce6a3a36
commit 8cbec8d601
11 files changed
+66 -30

No files matched your search

+26 -2
View File
@@ -124,13 +124,37 @@
flex-direction: column;
gap: 18px;
}
.support-empty, .support-empty-hero {
.support-empty {
color: var(--t-dim);
text-align: center;
padding: 40px 20px;
font-size: 13px;
}
.support-empty-hero i { font-size: 48px; display: block; margin: 0 auto 12px; color: var(--t-muted); }
/* Hero empty-state ("pick a ticket on the left") matches the board's
* "no cards found" placeholder: centred in the available column, pixel
* font with blink cursor, 4xl dim icon above. flex:1 consumes the
* detail column so the axis centring actually has a box to work in. */
.support-empty-hero {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 20px;
}
.support-empty-hero i {
display: block;
font-size: 2.25rem; /* matches text-4xl */
color: var(--t-dim);
margin-bottom: 1rem; /* matches mb-4 */
}
.support-empty-hero p {
margin: 0;
font-family: var(--t-font-ui, var(--t-font-pixel, 'Silkscreen', cursive));
font-size: 0.875rem; /* text-sm */
color: var(--t-dim);
}
.support-ticket-header h2 { font-family: var(--t-font-pixel); color: var(--t-bright); font-size: 14px; margin: 0 0 4px; }
.support-ticket-header .meta { color: var(--t-dim); font-size: 11px; display: flex; gap: 12px; flex-wrap: wrap; }
+1 -1
View File
@@ -28,7 +28,7 @@
<section id="support-detail" class="support-detail">
<div class="support-empty-hero">
<i class="ph ph-envelope-open"></i>
<p>Pick a ticket on the left.</p>
<p class="cursor-blink">select a ticket</p>
</div>
</section>
</div>
+2 -2
View File
@@ -132,7 +132,7 @@ function renderDetail(t) {
const host = $('support-detail');
if (!host) return;
if (!t) {
host.innerHTML = `<div class="support-empty-hero"><i class="ph ph-envelope-open"></i><p>Pick a ticket on the left.</p></div>`;
host.innerHTML = `<div class="support-empty-hero"><i class="ph ph-envelope-open"></i><p class="cursor-blink">select a ticket</p></div>`;
return;
}
const replies = (t.replies || []).map(r => `
@@ -168,7 +168,7 @@ function renderDetail(t) {
<span id="support-composer-status" class="support-composer-status"></span>
<button class="support-btn" id="support-save-fragment"><i class="ph ph-plus-circle"></i> Save as fragment</button>
<span class="spacer"></span>
<button class="support-btn support-btn-ghost" id="support-status-closed" title="Close without replying">Close ticket</button>
<button class="support-btn" id="support-status-closed" title="Close without replying"><i class="ph ph-archive"></i> Close ticket</button>
<button class="support-btn support-btn-primary" id="support-send-btn"><i class="ph ph-paper-plane-tilt"></i> Send reply</button>
</div>
</div>