41 lines
1.5 KiB
JavaScript
41 lines
1.5 KiB
JavaScript
import { navBar } from './nav-bar.js';
|
|
|
|
export function appShell(appName, appVersion, runtimeMode) {
|
|
const currentYear = new Date().getFullYear();
|
|
|
|
return `
|
|
<div class="app-shell d-flex flex-column min-vh-100">
|
|
<div id="app-nav">
|
|
${navBar(appName)}
|
|
</div>
|
|
<main id="route-view" class="flex-grow-1"></main>
|
|
<footer class="app-footer border-top mt-auto py-3">
|
|
<div class="container-xxl d-flex flex-column flex-md-row justify-content-between align-items-md-center gap-1 small">
|
|
<div>© ${currentYear} AKLARO</div>
|
|
<div class="text-body-secondary">
|
|
${appName} v${appVersion} • ${runtimeMode} mode • PWA frontend for Tryton kitchen
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
<div class="toast-stack" x-data="alertsData()">
|
|
<template x-for="alert in alerts" :key="alert.id">
|
|
<div class="toast show align-items-center border-0 mb-2 text-bg-dark" role="status">
|
|
<div class="d-flex">
|
|
<div class="toast-body">
|
|
<span class="badge me-2 text-uppercase" :class="badgeClass(alert.type)" x-text="alert.type"></span>
|
|
<span x-text="alert.message"></span>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
class="btn-close btn-close-white me-2 m-auto"
|
|
@click="dismiss(alert.id)"
|
|
aria-label="Close"
|
|
></button>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|