Fix: Suchfeld+Button table-Layout für garantierte Nebeneinander-Darstellung — SW by-v501, APP_VER 478

This commit is contained in:
rene 2026-04-29 13:29:39 +02:00
parent 9603f099b5
commit b2e7f1409a
3 changed files with 30 additions and 21 deletions

View file

@ -3,7 +3,7 @@
Router, State-Management, Navigation, Initialisierung.
============================================================ */
const APP_VER = '477'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const APP_VER = '478'; // ← bei jedem Deploy mit Frontend-Änderungen erhöhen
const App = (() => {

View file

@ -551,25 +551,34 @@ window.Page_uebungen = (() => {
function _render() {
_container.innerHTML = `
<div id="ueb-wrap">
<div style="padding:var(--space-3) var(--space-4) var(--space-2);display:grid;grid-template-columns:1fr auto;align-items:stretch;gap:var(--space-2)">
<input type="search" id="ueb-search" placeholder="Übung suchen…"
style="padding:var(--space-2) var(--space-3);width:100%;
border:1px solid var(--c-border);border-radius:var(--radius-md);
background:var(--c-surface);color:var(--c-text);font-size:var(--text-sm);
outline:none" value="${_esc(_searchQuery)}">
<button id="ueb-quicksetup-btn"
style="padding:5px 12px;
background:var(--c-surface-2);border:1px solid var(--c-border);
border-radius:var(--radius-sm);cursor:pointer;
display:flex;align-items:center;gap:var(--space-2)">
<svg class="ph-icon" style="width:15px;height:15px;flex-shrink:0;color:var(--c-primary)" aria-hidden="true">
<use href="/icons/phosphor.svg#list-checks"></use>
</svg>
<span style="display:flex;flex-direction:column;align-items:flex-start;gap:1px">
<span style="font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--c-text);white-space:nowrap;line-height:1.2">Stand erfassen</span>
<span style="font-size:10px;color:var(--c-text-muted);white-space:nowrap;line-height:1.2">Wo stehst du bei jeder Übung?</span>
</span>
</button>
<div style="padding:var(--space-3) var(--space-4) var(--space-2)">
<table style="width:100%;border-collapse:collapse">
<tr>
<td style="width:100%;padding-right:var(--space-2)">
<input type="search" id="ueb-search" placeholder="Übung suchen…"
style="display:block;width:100%;box-sizing:border-box;
padding:var(--space-2) var(--space-3);
border:1px solid var(--c-border);border-radius:var(--radius-md);
background:var(--c-surface);color:var(--c-text);font-size:var(--text-sm);
outline:none" value="${_esc(_searchQuery)}">
</td>
<td style="white-space:nowrap;vertical-align:middle">
<button id="ueb-quicksetup-btn"
style="padding:5px 12px;height:100%;
background:var(--c-surface-2);border:1px solid var(--c-border);
border-radius:var(--radius-sm);cursor:pointer;
display:flex;align-items:center;gap:var(--space-2)">
<svg class="ph-icon" style="width:15px;height:15px;flex-shrink:0;color:var(--c-primary)" aria-hidden="true">
<use href="/icons/phosphor.svg#list-checks"></use>
</svg>
<span style="display:flex;flex-direction:column;align-items:flex-start;gap:1px">
<span style="font-size:var(--text-xs);font-weight:var(--weight-semibold);color:var(--c-text);white-space:nowrap;line-height:1.2">Stand erfassen</span>
<span style="font-size:10px;color:var(--c-text-muted);white-space:nowrap;line-height:1.2">Wo stehst du bei jeder Übung?</span>
</span>
</button>
</td>
</tr>
</table>
</div>
${_renderTabs()}
<div id="ueb-stats-banner" style="padding:var(--space-2) var(--space-4) 0"></div>