Compacted sidebar, fixed search/toggle at top, narrower width
Deploy TrassenPlaner / deploy (push) Waiting to run Details

This commit is contained in:
Johannes Baumeister 2026-04-15 20:44:39 +02:00
parent e775b187b0
commit e20ebbfcf3
1 changed files with 22 additions and 22 deletions

View File

@ -27,8 +27,8 @@
--bg-glass: rgba(255, 253, 235, 0.85);
/* Warm base */
--border-glass: rgba(204, 163, 0, 0.2);
--sidebar-width: 380px;
--panel-width: 320px;
--sidebar-width: 300px;
--panel-width: 310px;
--success: #299500;
/* CMYK 75 10 100 35 */
--danger: #ef4444;
@ -96,14 +96,14 @@
/* Sidebar CRM Elements */
.sidebar-header {
padding: 24px;
padding: 16px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.sidebar-content {
flex: 1;
overflow-y: auto;
padding: 20px;
padding: 12px 16px;
}
.search-box {
@ -141,9 +141,9 @@
.owner-card {
background: white;
border-radius: 12px;
padding: 16px;
margin-bottom: 12px;
border-radius: 10px;
padding: 10px 12px;
margin-bottom: 8px;
border: 1px solid rgba(204, 163, 0, 0.1);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
cursor: pointer;
@ -583,30 +583,30 @@
<aside id="sidebar">
<div class="sidebar-header">
<img src="Logos/20201202-ENWELO-Logo-4c_ohne_Claim.png" alt="ENWELO"
style="width: 100%; max-width: 220px; margin-bottom: 20px;">
<div style="display: flex; flex-direction: column;">
style="width: 100%; max-width: 180px; margin-bottom: 12px;">
<div style="display: flex; flex-direction: column; margin-bottom: 12px;">
<h1
style="font-size: 20px; display: flex; align-items: center; gap: 10px; color: white; margin: 0; font-weight: 800; letter-spacing: -0.5px;">
<i data-lucide="map-pin"></i> TrassenPlaner Basic
style="font-size: 18px; display: flex; align-items: center; gap: 8px; color: white; margin: 0; font-weight: 800; letter-spacing: -0.5px;">
<i data-lucide="map-pin"></i> TrassenPlaner
</h1>
<span
style="font-size: 11px; color: var(--info); opacity: 0.9; margin-left: 34px; margin-top: -2px; font-weight: 600;">v1.0.4</span>
style="font-size: 10px; color: var(--info); opacity: 0.9; margin-left: 30px; margin-top: -2px; font-weight: 600;">v1.0.5</span>
</div>
</div>
<div class="sidebar-content">
<div id="quick-toggles" style="padding: 0 0 12px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.1); margin-bottom: 15px;">
<label style="display: flex; align-items: center; gap: 10px; cursor: pointer; color: white; font-size: 13px; font-weight: 600; padding: 4px 0;">
<input type="checkbox" id="sidebar-toggle-owner-status" checked onchange="document.getElementById('toggle-owner-status').checked = this.checked; toggleLayer('ownerStatus', this.checked); document.getElementById('status-legend').style.display = this.checked ? 'block' : 'none';" style="width: 16px; height: 16px; cursor: pointer;">
<span style="display: flex; align-items: center; gap: 8px;">
<i data-lucide="shield-check" style="width: 18px; color: var(--info);"></i> Sicherungsstand anzeigen
<div id="quick-toggles" style="padding: 0; border-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 12px; margin-top: 8px;">
<label style="display: flex; align-items: center; gap: 8px; cursor: pointer; color: white; font-size: 12px; font-weight: 600; padding: 4px 0;">
<input type="checkbox" id="sidebar-toggle-owner-status" checked onchange="document.getElementById('toggle-owner-status').checked = this.checked; toggleLayer('ownerStatus', this.checked); document.getElementById('status-legend').style.display = this.checked ? 'block' : 'none';" style="width: 14px; height: 14px; cursor: pointer;">
<span style="display: flex; align-items: center; gap: 6px;">
<i data-lucide="shield-check" style="width: 16px; color: var(--info);"></i> Sicherungsstand aktiv
</span>
</label>
</div>
<div id="owner-search-container" style="margin-top: 0px; margin-bottom: 15px;">
<div id="owner-search-container" style="margin-top: 8px;">
<input type="text" class="search-box" id="owner-search" placeholder="Eigentümer suchen..."
style="margin-bottom: 0px; background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); color: white;">
style="margin-bottom: 0; padding: 8px 12px; border-radius: 8px; background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.2); color: white; font-size: 13px;">
</div>
</div>
<div class="sidebar-content">
<div id="owner-list">
<div style="text-align: center; color: #888; margin-top: 40px;">