mirror of
https://github.com/ThatGuySam/doesitarm.git
synced 2026-05-18 06:44:46 -07:00
Add SimpleList for categories page
This commit is contained in:
parent
e37728a673
commit
cde632001e
2 changed files with 38 additions and 23 deletions
27
src/components/simple-list.astro
Normal file
27
src/components/simple-list.astro
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
---
|
||||
// Simple list for listing thinngs like categories, tags, etc.
|
||||
|
||||
const {
|
||||
items
|
||||
} = Astro.props
|
||||
---
|
||||
<ul class="simple-list space-y-3">
|
||||
{ items.map( item => (
|
||||
<li
|
||||
class="relative"
|
||||
>
|
||||
<a
|
||||
href={ item.href }
|
||||
class="flex justify-start items-center inset-x-0 text-3xl md:text-4xl hover:bg-darkest border-2 border-white border-opacity-0 hover:border-opacity-50 focus:outline-none focus:bg-gray-50 duration-300 ease-in-out rounded-lg space-x-3 -mx-5 px-5 md:pr-64 py-3"
|
||||
style="transition-property: border;"
|
||||
>
|
||||
<div class="font-hairline">
|
||||
<h2>{ item.heading }</h2>
|
||||
<div class="text-xs opacity-75 mb-3">{ item.description }</div>
|
||||
</div>
|
||||
<div>➔</div>
|
||||
</a>
|
||||
|
||||
</li>
|
||||
)) }
|
||||
</ul>
|
||||
Loading…
Add table
Add a link
Reference in a new issue