Files
100DaysOfCode/day33/src/components/Counter.devto
2022-10-25 22:13:51 -05:00

23 lines
942 B
Plaintext

<div class="mb-2">
<h2 class="text-xl font-semibold text-center">count is: { appState.contents.count }</h2>
</div>
<div class="flex justify-center mb-3">
<button d-on:click="appState.contents.count--"
class="transition-colors p-3 duration-300 active:bg-red-700 hover:bg-red-600 hover:text-zinc-100 mr-1">
<img src='/minus.svg'
width="24px"
alt="minus" />
</button>
<button d-on:click="appState.contents.count = 0"
class="transition-colors p-3 duration-300 active:bg-zinc-700 hover:bg-zinc-800 hover:text-red-100 mr-1">
<img src='/refresh.svg'
width="24px"
alt="reset">
</button>
<button d-on:click="appState.contents.count++"
class="transition-colors p-3 duration-300 active:bg-green-700 hover:bg-green-600 hover:text-green-100">
<img src='/plus.svg'
width="24px"
alt="plus" />
</button>
</div>