45 lines
965 B
Svelte
45 lines
965 B
Svelte
<script lang="ts">
|
|
import { onMount } from 'svelte';
|
|
import { slide } from 'svelte/transition';
|
|
|
|
let isNotLondon = $state(false);
|
|
let londonZone = $state('Greenwich Mean Time');
|
|
|
|
onMount(() => {
|
|
const userTZ = Intl.DateTimeFormat().resolvedOptions().timeZone;
|
|
isNotLondon = userTZ !== 'Europe/London';
|
|
|
|
const parts = new Intl.DateTimeFormat('en-GB', {
|
|
timeZone: 'Europe/London',
|
|
timeZoneName: 'long'
|
|
}).formatToParts(new Date());
|
|
|
|
londonZone = parts.find((p) => p.type === 'timeZoneName')?.value || 'UK Time';
|
|
});
|
|
</script>
|
|
|
|
{#if isNotLondon}
|
|
<div transition:slide={{ duration: 300 }} class="tzWarn">
|
|
<p class="tzText">
|
|
All times are shown in <strong>{londonZone}</strong>
|
|
</p>
|
|
</div>
|
|
{/if}
|
|
|
|
<style>
|
|
.tzWarn {
|
|
display: flex;
|
|
justify-content: center;
|
|
width: 100%;
|
|
padding: 1rem 0 0 0;
|
|
}
|
|
|
|
.tzText {
|
|
width: 80%;
|
|
text-align: center;
|
|
margin: auto;
|
|
font-family: 'URW Gothic', sans-serif;
|
|
font-size: 1.2rem;
|
|
}
|
|
</style>
|