79 lines
1.9 KiB
Text
79 lines
1.9 KiB
Text
---
|
|
|
|
import NavBar from "../../components/NavBar.astro";
|
|
import TimeZone from "../../components/TimeZone.vue";
|
|
import Layout from "../../layouts/Layout.astro";
|
|
import TimeFormat from "../../components/TimeFormat.vue";
|
|
import UnixTime from "../../components/UnixTime.vue";
|
|
|
|
const navLinks = [
|
|
{
|
|
img: {
|
|
src: '/icons/arrow-left.svg',
|
|
alt: 'Back to Utilities',
|
|
},
|
|
to: '/utilities',
|
|
name: 'Utilities',
|
|
},
|
|
{
|
|
img: {
|
|
src: '/icons/home.svg',
|
|
alt: 'Go Home',
|
|
},
|
|
to: '/',
|
|
name: 'Home',
|
|
},
|
|
];
|
|
---
|
|
|
|
<Layout title="VännerBästa | Time" navLinks={navLinks}>
|
|
<div class="container grid place-items-center">
|
|
<div class="grid place-items-center">
|
|
<h1 class="text-6xl font-bold underline p-4">Time Utilities</h1>
|
|
<p class="p-4">
|
|
Your current timezone:
|
|
<TimeZone client:load />
|
|
</p>
|
|
|
|
<UnixTime client:load/>
|
|
|
|
<p class="p-4">
|
|
To format the time for Discord, you can use: <br />
|
|
<TimeFormat formats={[{
|
|
day: 'numeric',
|
|
month: 'long',
|
|
year: 'numeric',
|
|
}, {hour: '2-digit', minute: '2-digit'}]} dFormat="f" client:only />
|
|
<br />
|
|
<TimeFormat formats={[{
|
|
weekday: 'long',
|
|
day: 'numeric',
|
|
month: 'long',
|
|
year: 'numeric',
|
|
}, { hour: '2-digit', minute: '2-digit', }]} dFormat="F" client:only />
|
|
<br />
|
|
<TimeFormat formats={[{
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
}]} dFormat="t" client:only />
|
|
<br />
|
|
<TimeFormat formats={[{
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
second: '2-digit',
|
|
}]} dFormat="T" client:only />
|
|
<br />
|
|
<TimeFormat formats={[{
|
|
day: '2-digit',
|
|
month: '2-digit',
|
|
year: 'numeric',
|
|
}]} dFormat="d" client:only />
|
|
<br />
|
|
<TimeFormat formats={[{
|
|
day: 'numeric',
|
|
month: 'long',
|
|
year: 'numeric',
|
|
}]} dFormat="D" client:only />
|
|
</p>
|
|
</div>
|
|
</Layout>
|