You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
17 lines
1.2 KiB
17 lines
1.2 KiB
<section x-data="{ showArticle: false }">
|
|
<div class="py-8 px-4 mx-auto max-w-screen-xl text-center lg:py-16 lg:px-6">
|
|
<div class="mx-auto max-w-screen-sm">
|
|
<h2 class="mb-1 text-4xl tracking-tight font-extrabold text-gray-900 dark:text-white">{{ article.title }}</h2>
|
|
<p class="mb-3 text-base text-gray-500 dark:text-gray-400">{{{ article-timestamp article.created }}}</time></p>
|
|
|
|
<p x-show="!showArticle" class="mb-4 font-light text-gray-500 lg:mb-8 sm:text-xl dark:text-gray-400"> {{ article.content }} </p>
|
|
<p x-show="showArticle" class="mb-4 font-light text-gray-500 lg:mb-8 sm:text-xl dark:text-gray-400"> {{ article.content }} </p>
|
|
</div>
|
|
<div class="text-center">
|
|
<a x-on:click="showArticle = !showArticle" x-text="showArticle ? 'Show less' : 'Show more...'" class="py-2.5 px-5 mr-2 mb-2 text-sm font-medium text-gray-900 focus:outline-none bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-blue-700 focus:z-10 focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<hr class="w-48 h-1 mx-auto my-4 bg-gray-100 border-0 rounded md:my-10 dark:bg-gray-700">
|