catarrh/ponomar-pwa
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

nav: right-align via nav.justify-end; calendar panels: reduce padding

Browse Source
This commit is contained in:
catarrh committed 2026-08-02 02:03:23 +03:00
1 parent f1753f3bb4
commit 79fb3d4a15
2 files changed
+8 -8
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/ui/app.ts
+3 -3
View File
@@ -117,8 +117,8 @@ export class App {
const t = getTranslations(this.settings.language as LanguageCode); const t = getTranslations(this.settings.language as LanguageCode);
this.container.innerHTML = ` this.container.innerHTML = `
<div class="app-container min-h-screen flex flex-col"> <div class="app-container min-h-screen flex flex-col">
<header class="bg-navy text-parchment p-3 flex items-center justify-between shadow-md"> <header class="bg-navy text-parchment p-3 flex items-center shadow-md">
<nav class="flex flex-wrap gap-4 text-sm"> <nav class="flex flex-wrap gap-4 text-sm justify-end">
<a href="#calendar" class="nav-link hover:text-gold transition-colors" data-view="calendar">${t.nav.calendar}</a> <a href="#calendar" class="nav-link hover:text-gold transition-colors" data-view="calendar">${t.nav.calendar}</a>
<details class="nav-group relative" data-nav="library"> <details class="nav-group relative" data-nav="library">
<summary class="cursor-pointer list-none hover:text-gold transition-colors flex items-center gap-1">${t.nav.library} <span class="text-xs">▾</span></summary> <summary class="cursor-pointer list-none hover:text-gold transition-colors flex items-center gap-1">${t.nav.library} <span class="text-xs">▾</span></summary>
@@ -135,7 +135,7 @@ export class App {
<a href="#triodion" class="nav-link hover:text-gold transition-colors px-2 py-1" data-view="triodion">${t.nav.triodion}</a> <a href="#triodion" class="nav-link hover:text-gold transition-colors px-2 py-1" data-view="triodion">${t.nav.triodion}</a>
</div> </div>
</details> </details>
<a href="#settings" class="nav-link hover:text-gold transition-colors ml-auto" data-view="settings">${t.nav.settings}</a> <a href="#settings" class="nav-link hover:text-gold transition-colors" data-view="settings">${t.nav.settings}</a>
</nav> </nav>
</header> </header>
<main id="view-container" class="flex-1 overflow-auto"></main> <main id="view-container" class="flex-1 overflow-auto"></main>
src/ui/calendar-view.ts
+5 -5
View File
@@ -570,7 +570,7 @@ export class CalendarView {
</div> </div>
<div class="flex-1 p-6 overflow-auto"> <div class="flex-1 p-4 overflow-auto">
<div class="max-w-2xl lg:max-w-3xl xl:max-w-4xl"> <div class="max-w-2xl lg:max-w-3xl xl:max-w-4xl">
<h2 class="text-base font-bold text-red mb-1"> <h2 class="text-base font-bold text-red mb-1">
${julianStr} ${julianStr}
@@ -581,22 +581,22 @@ export class CalendarView {
<div id="day-title" class="mb-4"></div> <div id="day-title" class="mb-4"></div>
<div id="commemorations-panel" class="mb-4 p-4 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="commemorations-panel" class="mb-4 p-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}">
<h3 class="font-bold text-red mb-2">${this.t.calendar.commemorations}</h3> <h3 class="font-bold text-red mb-2">${this.t.calendar.commemorations}</h3>
<p class="text-sm text-navy-light italic">${this.t.loading}</p> <p class="text-sm text-navy-light italic">${this.t.loading}</p>
</div> </div>
<div id="fasting-panel" class="mb-4 p-4 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="fasting-panel" class="mb-4 p-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}">
<h3 class="font-bold text-red mb-2">${this.t.calendar.fastingRule}</h3> <h3 class="font-bold text-red mb-2">${this.t.calendar.fastingRule}</h3>
<p class="text-sm italic text-navy-light">${this.t.loading}</p> <p class="text-sm italic text-navy-light">${this.t.loading}</p>
</div> </div>
<div id="readings-panel" class="mb-4 p-4 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="readings-panel" class="mb-4 p-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}">
<h3 class="font-bold text-red mb-2">${this.t.calendar.readings}</h3> <h3 class="font-bold text-red mb-2">${this.t.calendar.readings}</h3>
<p class="text-sm text-navy-light italic">${this.t.loading}</p> <p class="text-sm text-navy-light italic">${this.t.loading}</p>
</div> </div>
<div id="services-panel" class="mb-4 border-t border-gold/20 pt-6"></div> <div id="services-panel" class="mb-4 border-t border-gold/20 pt-3"></div>
</div> </div>
</div> </div>
</div> </div>