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

Fix: Scroll-Navigation nur für Monat/Quartal, Stundenhöhen reduziert

Browse Source 
Wheel-Scroll ändert Zeitraum jetzt nur noch in Monats- und Quartalsansicht. In Wochen-, Tag- und Terminansicht scrollt die Seite normal. Stundenhöhen: 40/60/80/100 → 36/54/72/90px; Kompakt (36px) zeigt 24h auf 1080p ohne Scrollen.
This commit is contained in:
Scarriffle
2026-04-08 14:19:13 +02:00
parent e9a307a20d
commit dea15191d8
3 changed files with 10 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
frontend/index.html
View File

@@ -494,10 +494,10 @@
<h4 class="panel-title" style="margin-top:24px" data-i18n="settings_hour_height">Stundenhöhe (Wochen- &amp; Tagesansicht)</h4> <h4 class="panel-title" style="margin-top:24px" data-i18n="settings_hour_height">Stundenhöhe (Wochen- &amp; Tagesansicht)</h4>
<p class="panel-desc" data-i18n="settings_hour_height_desc">Wie viel Platz eine Stunde in der Zeitrasteransicht einnimmt</p> <p class="panel-desc" data-i18n="settings_hour_height_desc">Wie viel Platz eine Stunde in der Zeitrasteransicht einnimmt</p>
<div class="contrast-selector" id="cfg-hour-height" data-setting="hour_height"> <div class="contrast-selector" id="cfg-hour-height" data-setting="hour_height">
<button class="contrast-btn" data-val="40"><span class="hour-preview">━━</span><span class="contrast-lbl" data-i18n="hour_compact">Kompakt</span></button> <button class="contrast-btn" data-val="36"><span class="hour-preview">━━</span><span class="contrast-lbl" data-i18n="hour_compact">Kompakt</span></button>
<button class="contrast-btn" data-val="60"><span class="hour-preview">━━━</span><span class="contrast-lbl" data-i18n="hour_normal">Normal</span></button> <button class="contrast-btn" data-val="54"><span class="hour-preview">━━━</span><span class="contrast-lbl" data-i18n="hour_normal">Normal</span></button>
<button class="contrast-btn" data-val="80"><span class="hour-preview">━━━━</span><span class="contrast-lbl" data-i18n="hour_comfort">Komfort</span></button> <button class="contrast-btn" data-val="72"><span class="hour-preview">━━━━</span><span class="contrast-lbl" data-i18n="hour_comfort">Komfort</span></button>
<button class="contrast-btn" data-val="100"><span class="hour-preview">━━━━━</span><span class="contrast-lbl" data-i18n="hour_large">Gross</span></button> <button class="contrast-btn" data-val="90"><span class="hour-preview">━━━━━</span><span class="contrast-lbl" data-i18n="hour_large">Gross</span></button>
</div> </div>
<h4 class="panel-title" style="margin-top:24px" data-i18n="settings_hidden_cals">Ausgeblendete Kalender</h4> <h4 class="panel-title" style="margin-top:24px" data-i18n="settings_hidden_cals">Ausgeblendete Kalender</h4>

10
frontend/js/calendar.js
View File

@@ -227,7 +227,7 @@ function renderView() {
showEventPopup, showEventPopup,
false, false,
weekStartDay, weekStartDay,
state.settings.hour_height || 60 state.settings.hour_height || 54
); );
} else if (state.currentView === 'day') { } else if (state.currentView === 'day') {
renderWeek(container, state.currentDate, evs, renderWeek(container, state.currentDate, evs,
@@ -235,7 +235,7 @@ function renderView() {
showEventPopup, showEventPopup,
true, true,
weekStartDay, weekStartDay,
state.settings.hour_height || 60 state.settings.hour_height || 54
); );
} else if (state.currentView === 'quarter') { } else if (state.currentView === 'quarter') {
renderQuarter(container, state.currentDate, evs, renderQuarter(container, state.currentDate, evs,
@@ -653,15 +653,15 @@ function bindTopbar() {
document.getElementById('btn-settings').onclick = openSettingsModal; document.getElementById('btn-settings').onclick = openSettingsModal;
document.getElementById('btn-create-event').onclick = () => openNewEventModal(new Date()); document.getElementById('btn-create-event').onclick = () => openNewEventModal(new Date());
// Mouse wheel / trackpad scroll navigation (500ms cooldown = 1 nav per gesture) // Mouse wheel / trackpad scroll navigation – only for month & quarter
let _wheelLast = 0; let _wheelLast = 0;
document.getElementById('view-container').addEventListener('wheel', e => { document.getElementById('view-container').addEventListener('wheel', e => {
if (state.currentView !== 'month' && state.currentView !== 'quarter') return;
e.preventDefault(); e.preventDefault();
const now = Date.now(); const now = Date.now();
if (now - _wheelLast < 500) return; if (now - _wheelLast < 500) return;
_wheelLast = now; _wheelLast = now;
const dir = e.deltaY > 0 ? 1 : -1; const dir = e.deltaY > 0 ? 1 : -1;
if (state.currentView === 'agenda') return;
if (state.currentView === 'month') { if (state.currentView === 'month') {
state.currentDate = new Date(state.currentDate); state.currentDate = new Date(state.currentDate);
state.currentDate.setDate(state.currentDate.getDate() + dir * 7); state.currentDate.setDate(state.currentDate.getDate() + dir * 7);
@@ -1527,7 +1527,7 @@ function bindSettingsModal() {
dim_past_events: document.getElementById('cfg-dim-past').checked, dim_past_events: document.getElementById('cfg-dim-past').checked,
text_contrast: getActive('cfg-text-contrast') || 3, text_contrast: getActive('cfg-text-contrast') || 3,
line_contrast: getActive('cfg-line-contrast') || 3, line_contrast: getActive('cfg-line-contrast') || 3,
hour_height: getActive('cfg-hour-height') || 60, hour_height: getActive('cfg-hour-height') || 54,
language: document.getElementById('cfg-language').value, language: document.getElementById('cfg-language').value,
}; };
try { try {

2
frontend/js/utils.js
View File

@@ -92,7 +92,7 @@ export function applyTheme(settings) {
root.style.setProperty('--border', lc.border); root.style.setProperty('--border', lc.border);
root.style.setProperty('--border-light', lc.light); root.style.setProperty('--border-light', lc.light);
const hh = settings.hour_height || 60; const hh = settings.hour_height || 54;
root.style.setProperty('--hour-h', hh + 'px'); root.style.setProperty('--hour-h', hh + 'px');
} }