Scarriffle/Calendarr
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

UI-Verbesserungen: Favicon, Tab-Titel, Kalender umbenennen, Avatar-Crop, Farbpalette

Browse Source 
- SVG-Favicon hinzugefügt
- Dynamischer Tab-Titel (z.B. "Calendarr - März 2026")
- Kalender per Doppelklick umbenennen (Backend + Frontend)
- Avatar-Anzeige im Topbar gefixt (onerror Fallback, robustes Laden)
- Avatar-Upload mit Cropper.js Bildausschnitt-Wahl
- Avatar-Limit auf 5 MB erhöht, Thumbnail auf 512px
- Farbpalette statt nativem Color-Picker für Kalenderfarben
This commit is contained in:
Scarriffle
2026-03-26 15:14:34 +01:00
parent 77d6e20f86
commit 1bbabd6c4d
7 changed files with 256 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/index.html
View File

@@ -4,6 +4,8 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Calendarr</title>
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.min.css" />
<link rel="stylesheet" href="/static/css/app.css" />
</head>
<body>
@@ -481,9 +483,29 @@
</div>
</div>
<!-- Avatar Crop Modal -->
<div id="modal-crop" class="modal-overlay hidden" style="z-index:1000">
<div class="modal-card" style="max-width:480px">
<div class="modal-header">
<h3>Bildausschnitt wählen</h3>
<button class="icon-btn modal-close" data-modal="modal-crop">&times;</button>
</div>
<div class="modal-body" style="padding:0">
<div class="crop-container">
<img id="crop-image" />
</div>
</div>
<div class="modal-footer">
<button class="btn btn-ghost" data-modal="modal-crop">Abbrechen</button>
<button class="btn btn-primary" id="crop-save">Zuschneiden & Hochladen</button>
</div>
</div>
</div>
<!-- Toast -->
<div id="toast" class="toast hidden"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/cropperjs/1.6.2/cropper.min.js"></script>
<script type="module" src="/static/js/app.js"></script>
</body>
</html>