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

reduce spacing across all views; i18n for cache info text

Browse Source
This commit is contained in:
catarrh committed 2026-08-02 02:47:31 +03:00
1 parent 33d69f001e
commit accd5cf48c
6 files changed
+32 -22
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/core/i18n.ts
+4
View File
@@ -499,6 +499,7 @@ export interface Translations {
offlineDone: string; offlineDone: string;
offlineSelectLang: string; offlineSelectLang: string;
offlineCleared: string; offlineCleared: string;
offlineCacheInfo: string;
locationTitle: string; locationTitle: string;
latitude: string; latitude: string;
longitude: string; longitude: string;
@@ -1044,6 +1045,7 @@ const translations: Record<LanguageCode, Translations> = {
offlineDone: 'Done! Data cached for offline use.', offlineDone: 'Done! Data cached for offline use.',
offlineSelectLang: 'Please select at least one language.', offlineSelectLang: 'Please select at least one language.',
offlineCleared: 'Cache cleared.', offlineCleared: 'Cache cleared.',
offlineCacheInfo: 'Cache: {0} / {1} ({2} files)',
locationTitle: 'Location', locationTitle: 'Location',
latitude: 'Latitude', latitude: 'Latitude',
longitude: 'Longitude', longitude: 'Longitude',
@@ -1587,6 +1589,7 @@ const translations: Record<LanguageCode, Translations> = {
offlineDone: 'Готово! Данные закэшированы для офлайн-использования.', offlineDone: 'Готово! Данные закэшированы для офлайн-использования.',
offlineSelectLang: 'Пожалуйста, выберите хотя бы один язык.', offlineSelectLang: 'Пожалуйста, выберите хотя бы один язык.',
offlineCleared: 'Кэш очищен.', offlineCleared: 'Кэш очищен.',
offlineCacheInfo: 'Кэш: {0} / {1} ({2} файлов)',
locationTitle: 'Местоположение', locationTitle: 'Местоположение',
latitude: 'Широта', latitude: 'Широта',
longitude: 'Долгота', longitude: 'Долгота',
@@ -2130,6 +2133,7 @@ const translations: Record<LanguageCode, Translations> = {
offlineDone: 'Готово! Данныя закешированы для офлайн-потребленїя.', offlineDone: 'Готово! Данныя закешированы для офлайн-потребленїя.',
offlineSelectLang: 'Пожалуйста, изберите хотя бы единъ языкъ.', offlineSelectLang: 'Пожалуйста, изберите хотя бы единъ языкъ.',
offlineCleared: 'Кешъ очищенъ.', offlineCleared: 'Кешъ очищенъ.',
offlineCacheInfo: 'Кешъ: {0} / {1} ({2} фа́йлѡвъ)',
locationTitle: 'Мѣстоположе́нїе', locationTitle: 'Мѣстоположе́нїе',
latitude: 'Широта̀', latitude: 'Широта̀',
longitude: 'Долгота̀', longitude: 'Долгота̀',
src/ui/calendar-view.ts
+6 -6
View File
@@ -581,28 +581,28 @@ export class CalendarView {
${this.t.calendar.gregorianDate[0].toLowerCase() + this.t.calendar.gregorianDate.slice(1)}: ${gregorianStr} ${this.t.calendar.gregorianDate[0].toLowerCase() + this.t.calendar.gregorianDate.slice(1)}: ${gregorianStr}
</div> </div>
<div id="day-title" class="mb-4"></div> <div id="day-title" class="mb-2"></div>
<div id="astro-panel" class="mb-4 p-2 bg-white/50 border border-gold/20 rounded-lg text-sm text-navy"> <div id="astro-panel" class="mb-2 p-2 bg-white/50 border border-gold/20 rounded-lg text-sm text-navy">
<span class="text-navy-light italic">${this.t.loading}</span> <span class="text-navy-light italic">${this.t.loading}</span>
</div> </div>
<div id="commemorations-panel" class="mb-4 p-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="commemorations-panel" class="mb-2 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-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="fasting-panel" class="mb-2 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-2 bg-white/50 border border-gold/20 rounded-lg ${fnClass}"> <div id="readings-panel" class="mb-2 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-3"></div> <div id="services-panel" class="mb-2 border-t border-gold/20 pt-3"></div>
</div> </div>
</div> </div>
</div> </div>
src/ui/menaion-view.ts
+4 -4
View File
@@ -55,8 +55,8 @@ export class MenaionView {
this.currentMonth = today.getMonth() + 1; this.currentMonth = today.getMonth() + 1;
this.container.innerHTML = ` this.container.innerHTML = `
<div class="p-6 max-w-4xl xl:max-w-6xl mx-auto"> <div class="p-4 max-w-4xl xl:max-w-6xl mx-auto">
<div class="flex flex-wrap gap-2 mb-4"> <div class="flex flex-wrap gap-2 mb-2">
${[ ${[
{ id: 'prayer', view: 'prayer', label: this.t.nav.prayer }, { id: 'prayer', view: 'prayer', label: this.t.nav.prayer },
{ id: 'akathists', view: 'akathists', label: this.t.nav.akathists }, { id: 'akathists', view: 'akathists', label: this.t.nav.akathists },
@@ -78,7 +78,7 @@ export class MenaionView {
`).join('')} `).join('')}
</div> </div>
<div id="menaion-calendar"></div> <div id="menaion-calendar"></div>
<div id="menaion-content" class="bg-white/50 border border-gold/20 rounded-lg p-6 min-h-[300px]"> <div id="menaion-content" class="bg-white/50 border border-gold/20 rounded-lg p-4 min-h-[300px]">
<p class="text-navy-light italic">${this.t.prayer.selectSection}</p> <p class="text-navy-light italic">${this.t.prayer.selectSection}</p>
</div> </div>
</div> </div>
@@ -132,7 +132,7 @@ export class MenaionView {
<span class="text-base font-bold text-navy">${months[month - 1]}</span> <span class="text-base font-bold text-navy">${months[month - 1]}</span>
<button id="menaion-next" class="text-sm text-navy-light hover:text-navy px-2 py-1">▶</button> <button id="menaion-next" class="text-sm text-navy-light hover:text-navy px-2 py-1">▶</button>
</div> </div>
<div class="grid gap-1 grid-cols-7 mb-4"> <div class="grid gap-1 grid-cols-7 mb-2">
${daysHtml} ${daysHtml}
</div> </div>
`; `;
src/ui/prayer-view.ts
+5 -5
View File
@@ -213,8 +213,8 @@ export class PrayerView {
]; ];
this.container.innerHTML = ` this.container.innerHTML = `
<div class="p-6 max-w-4xl xl:max-w-6xl mx-auto"> <div class="p-4 max-w-4xl xl:max-w-6xl mx-auto">
<div class="flex flex-wrap gap-2 mb-4"> <div class="flex flex-wrap gap-2 mb-2">
${subNavItems.map(item => ` ${subNavItems.map(item => `
<button <button
class="sub-nav-chip text-sm transition-colors rounded-lg px-3 py-1 class="sub-nav-chip text-sm transition-colors rounded-lg px-3 py-1
@@ -225,13 +225,13 @@ export class PrayerView {
>${item.label}</button> >${item.label}</button>
`).join('')} `).join('')}
</div> </div>
<p class="text-navy-light text-sm mb-4">${subtitle}</p> <p class="text-navy-light text-sm mb-2">${subtitle}</p>
<select id="prayer-select" class="w-full border border-gold/20 bg-white/50 text-navy rounded-lg px-3 py-2 text-sm mb-6"> <select id="prayer-select" class="w-full border border-gold/20 bg-white/50 text-navy rounded-lg px-3 py-2 text-sm mb-3">
${sections.map(s => ` ${sections.map(s => `
<option value="${s.id}" ${this.activeSection === s.id ? 'selected' : ''}>${s.name}</option> <option value="${s.id}" ${this.activeSection === s.id ? 'selected' : ''}>${s.name}</option>
`).join('')} `).join('')}
</select> </select>
<div id="prayer-content" class="bg-white/50 border border-gold/20 rounded-lg p-6 min-h-[300px]"> <div id="prayer-content" class="bg-white/50 border border-gold/20 rounded-lg p-4 min-h-[300px]">
<p class="text-navy-light italic">${this.t.prayer.selectSection}</p> <p class="text-navy-light italic">${this.t.prayer.selectSection}</p>
</div> </div>
</div> </div>
src/ui/service-view.ts
+5 -5
View File
@@ -86,11 +86,11 @@ export class ServiceView {
const availableServices = this.getAvailableServices(dayInfo); const availableServices = this.getAvailableServices(dayInfo);
const fontClass = this.getFontClass(); const fontClass = this.getFontClass();
const contentClass = `bg-white/50 border border-gold/20 rounded-lg p-6 ${this.activeService ? 'min-h-[300px]' : ''} ${fontClass}`; const contentClass = `bg-white/50 border border-gold/20 rounded-lg p-4 ${this.activeService ? 'min-h-[300px]' : ''} ${fontClass}`;
const tabHtml = ` const tabHtml = `
<h3 class="font-bold text-red mb-3">${this.t.services.title}</h3> <h3 class="font-bold text-red mb-2">${this.t.services.title}</h3>
<div class="flex flex-wrap gap-2 mb-6"> <div class="flex flex-wrap gap-2 mb-3">
${availableServices.map(s => ` ${availableServices.map(s => `
<button <button
class="service-tab text-sm transition-colors class="service-tab text-sm transition-colors
@@ -108,9 +108,9 @@ export class ServiceView {
`; `;
this.container.innerHTML = standalone this.container.innerHTML = standalone
? `<div class="p-6 max-w-4xl xl:max-w-6xl mx-auto"> ? `<div class="p-4 max-w-4xl xl:max-w-6xl mx-auto">
<h2 class="text-2xl font-bold text-red mb-2">${this.t.services.title}</h2> <h2 class="text-2xl font-bold text-red mb-2">${this.t.services.title}</h2>
<p class="text-navy-light mb-4"> <p class="text-navy-light mb-2">
${this.currentDate.toString()} ${this.currentDate.toString()}
${dayInfo.isLent ? this.t.services.greatLent : ''} ${dayInfo.isLent ? this.t.services.greatLent : ''}
${dayInfo.isBrightWeek ? this.t.services.brightWeek : ''} ${dayInfo.isBrightWeek ? this.t.services.brightWeek : ''}
src/ui/settings-view.ts
+8 -2
View File
@@ -445,7 +445,10 @@ export class SettingsView {
OfflineManager.getStats().then(stats => { OfflineManager.getStats().then(stats => {
const statsEl = document.getElementById('offline-stats'); const statsEl = document.getElementById('offline-stats');
if (statsEl) { if (statsEl) {
statsEl.textContent = `Cache: ${OfflineManager.formatBytes(stats.usageBytes)} / ${OfflineManager.formatBytes(stats.quotaBytes)} (${stats.cachedFiles} files)`; statsEl.textContent = t.settings.offlineCacheInfo
.replace('{0}', OfflineManager.formatBytes(stats.usageBytes))
.replace('{1}', OfflineManager.formatBytes(stats.quotaBytes))
.replace('{2}', String(stats.cachedFiles));
} }
}); });
}); });
@@ -475,7 +478,10 @@ export class SettingsView {
OfflineManager.getStats().then(stats => { OfflineManager.getStats().then(stats => {
const statsEl = document.getElementById('offline-stats'); const statsEl = document.getElementById('offline-stats');
if (statsEl) { if (statsEl) {
statsEl.textContent = `Cache: ${OfflineManager.formatBytes(stats.usageBytes)} / ${OfflineManager.formatBytes(stats.quotaBytes)} (${stats.cachedFiles} files)`; statsEl.textContent = t.settings.offlineCacheInfo
.replace('{0}', OfflineManager.formatBytes(stats.usageBytes))
.replace('{1}', OfflineManager.formatBytes(stats.quotaBytes))
.replace('{2}', String(stats.cachedFiles));
} }
}); });