121 lines
3.5 KiB
Plaintext
121 lines
3.5 KiB
Plaintext
---
|
|
import { metaData, ENVIRONMENT, WHITELABELS, MAJOR_VERSION, RELEASE_FLAG } from "../config";
|
|
import RandomMsg from "../components/RandomMsg";
|
|
import { buildTime, buildNumber } from '../utils/buildTime.js';
|
|
|
|
const YEAR = new Date().getFullYear();
|
|
|
|
const hostHeader = Astro.request?.headers?.get('host') || '';
|
|
const host = hostHeader.split(':')[0];
|
|
import { getSubsiteByHost } from '../utils/subsites.js';
|
|
import { getSubsiteByPath } from '../utils/subsites.js';
|
|
const detected = getSubsiteByHost(host) ?? getSubsiteByPath(Astro.url.pathname) ?? null;
|
|
const isReq = detected?.short === 'req';
|
|
const whitelabel = WHITELABELS[host] ?? (isReq ? WHITELABELS[detected.host] : null);
|
|
|
|
const versionDisplay = `v${MAJOR_VERSION}${RELEASE_FLAG ? `-${RELEASE_FLAG}` : ''}`;
|
|
const envBadge = ENVIRONMENT === 'Dev' ? 'DEV' : null;
|
|
---
|
|
|
|
<div class:list={['footer', whitelabel && 'footer--subsite']}>
|
|
{!whitelabel && <RandomMsg client:only="react" />}
|
|
<div class="footer-version" data-build-time={buildTime} title={`Built: ${buildTime}`}>
|
|
<span class="version-pill">
|
|
{envBadge && <span class="env-dot" title="Development build"></span>}
|
|
{!envBadge && <span class="version-dot"></span>}
|
|
{versionDisplay}:{buildNumber}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function updateBuildTooltip() {
|
|
const el = document.querySelector('.footer-version[data-build-time]');
|
|
if (el) {
|
|
const iso = el.getAttribute('data-build-time');
|
|
if (iso) {
|
|
const local = new Date(iso).toLocaleString(undefined, {
|
|
dateStyle: 'medium',
|
|
timeStyle: 'short',
|
|
});
|
|
el.setAttribute('title', `Built: ${local}`);
|
|
}
|
|
}
|
|
}
|
|
updateBuildTooltip();
|
|
document.addEventListener('astro:page-load', updateBuildTooltip);
|
|
</script>
|
|
|
|
<style is:global>
|
|
.footer-version {
|
|
margin-top: 1.25rem;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.footer--subsite .footer-version {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.version-pill {
|
|
font-family: 'SF Mono', 'Fira Code', 'Geist Mono', ui-monospace, monospace;
|
|
font-size: 0.72rem;
|
|
font-weight: 500;
|
|
color: #3f3f46;
|
|
background: linear-gradient(135deg, rgba(255,255,255,0.9), rgba(244,244,245,0.8));
|
|
border: 1px solid rgba(0, 0, 0, 0.08);
|
|
padding: 0.4rem 0.85rem;
|
|
border-radius: 999px;
|
|
cursor: help;
|
|
letter-spacing: 0.04em;
|
|
transition: all 0.2s ease;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.8);
|
|
}
|
|
|
|
.version-pill:hover {
|
|
background: linear-gradient(135deg, rgba(255,255,255,1), rgba(250,250,250,0.95));
|
|
color: #18181b;
|
|
border-color: rgba(0, 0, 0, 0.12);
|
|
box-shadow: 0 2px 6px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.9);
|
|
}
|
|
|
|
[data-theme="dark"] .version-pill {
|
|
color: #71717a;
|
|
background: #1a1a1c;
|
|
border-color: #2a2a2e;
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
|
|
}
|
|
|
|
[data-theme="dark"] .version-pill:hover {
|
|
background: #252528;
|
|
color: #a1a1aa;
|
|
border-color: #3a3a3e;
|
|
box-shadow: 0 2px 6px rgba(0,0,0,0.6);
|
|
}
|
|
|
|
.version-dot {
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 50%;
|
|
background: #22c55e;
|
|
box-shadow: 0 0 4px rgba(34, 197, 94, 0.4);
|
|
}
|
|
|
|
.env-dot {
|
|
width: 6px;
|
|
height: 6px;
|
|
border-radius: 50%;
|
|
background: #f59e0b;
|
|
box-shadow: 0 0 4px rgba(245, 158, 11, 0.5);
|
|
}
|
|
|
|
@media screen and (max-width: 480px) {
|
|
article {
|
|
padding-top: 2rem;
|
|
padding-bottom: 4rem;
|
|
}
|
|
}
|
|
</style> |