48 lines
2.2 KiB
HTML
48 lines
2.2 KiB
HTML
<section
|
|
class="lg:col-span-5 bg-gray-100 dark:bg-gray-800 rounded-xl px-6 pt-6 pb-24 lg:pb-6 -mx-6 lg:mx-0 -mb-24 lg:mb-0"
|
|
x-data="{ postsResource: { status: 'loading' } }"
|
|
x-init="postsResource = await fetch('{{ site.Params.tickerApiURL }}?origin={{ site.Params.tickerClientURL }}&limit=3')
|
|
.then(res => res.json())
|
|
.then(json => {
|
|
const data = json.data?.messages ?? null
|
|
return data === null
|
|
? { status: 'error' }
|
|
: { status: 'success', data }
|
|
})
|
|
.catch(error => { status: 'error', error })"
|
|
>
|
|
<template x-if="postsResource.status == 'loading'">
|
|
<div class="text-center">Načítám...</div>
|
|
</template>
|
|
<template x-if="postsResource.status == 'error'">
|
|
<div class="text-center">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-8 mx-auto mb-2">
|
|
<path fill="none" d="M0 0h24v24H0z"/>
|
|
<path fill="currentColor" d="M12 2c5.523 0 10 4.477 10 10 0 .727-.077 1.435-.225 2.118l-1.782-1.783a8 8 0 1 0-4.375 6.801 3.997 3.997 0 0 0 1.555 1.423A9.956 9.956 0 0 1 12 22C6.477 22 2 17.523 2 12S6.477 2 12 2zm7 12.172l1.414 1.414a2 2 0 1 1-2.93.11l.102-.11L19 14.172zM12 15c1.466 0 2.785.631 3.7 1.637l-.945.86C13.965 17.182 13.018 17 12 17c-1.018 0-1.965.183-2.755.496l-.945-.86A4.987 4.987 0 0 1 12 15zm-3.5-5a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3zm7 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3z"/>
|
|
</svg>
|
|
<p>Něco se pokazilo</p>
|
|
</div>
|
|
</template>
|
|
<template x-if="postsResource.status == 'success'">
|
|
<div>
|
|
<h2 class="mb-4 font-bold">Novinky</h2>
|
|
<ol>
|
|
<template x-for="post in postsResource.data">
|
|
<li class="mb-4">
|
|
<article class="text-sm">
|
|
<p x-text="post.text" class="mb-1"></p>
|
|
<time
|
|
class="text-gray-500 text-xs"
|
|
x-bind:datetime="post.creation_date"
|
|
x-text="new Date(post.creation_date).toLocaleString()"
|
|
></time>
|
|
</article>
|
|
</li>
|
|
</template>
|
|
</ol>
|
|
{{ with site.Params.tickerClientURL }}
|
|
<a class="link text-sm font-bold" href="https://{{ . }}" target="_blank">Přečíst starší zprávy →</a>
|
|
{{ end }}
|
|
</div>
|
|
</template>
|
|
</section>
|