package components

import "strings"

type Blog struct {
	Title   string
	Summary string
	Link    templ.SafeURL
}

templ BlogSummary(entry Blog) {
	<article
		aria-labelledby={ "blog-entry-" + strings.ReplaceAll(entry.Title, " ", "-") }
	>
		<h3
			id={ "blog-entry-" + strings.ReplaceAll(entry.Title, " ", "-") }
			class="font-cal text-xl"
		>
			{ entry.Title }
		</h3>
		<div class="relative w-fit h-fit">
			<p class="line-clamp-3 text-justify text-light-gray">
				{ entry.Summary }
			</p>
			<div
				aria-hidden="true"
				class="h-0 w-0 pointer-events-none bg-transparent! contrast-more:hidden"
			>
				<div
					class={ "absolute left-0 top-0 h-100% w-100% " +
						"bg-transparent bg-gradient-to-t from-black/50" }
				></div>
			</div>
		</div>
		<div>
			<a
				class={ "transition-2s transition-all text-gray hover:text-light-gray no-underline " +
				"hover:underline transform-gpu hover:-translate-y-0.2 " +
				"contrast-more:text-light-gray contrast-more:hover:text-white" }
				href={ entry.Link }
			>
				Read all
				<span
					class="w-3 h-3 i-solar:arrow-right-up-line-duotone inline-block"
				></span>
			</a>
		</div>
	</article>
}
