huladesign

<div class="bg-gray-300 flex justify-center items-center p-8 h-full h-screen">
  <div x-data="{ tab: 'foo' }" style="max-width:550px">
    <div 
      class="flex -mx-px"
    >
      <button
        x-on:click="tab = 'foo'"
        x-bind:class="{ 'bg-white border-white': tab === 'foo' }"
        class="bg-transparent hover:bg-gray-200 text-gray-700 text-sm md:text-base font-semibold rounded-t focus:outline-none mx-px py-px md:py-2 px-3 md:px-4"
        type="button"

huladesign

Datepicker with TailwindCSS and AlpineJS

A Pen by Mithicher on CodePen.

License.

huladesign

1	Aum Shrī Swāminārāyaṇāya namah ।
2	Aum Shrī Sākṣhād-akṣhara-puruṣhottamāya namah ।
3	Aum Shrī Paramātmane namah ।
4	Aum Shrī Parabrahmaṇe namah ।
5	Aum Shrī Bhagavate namah ।
6	Aum Shrī Puruṣhottamāya namah ।
7	Aum Shrī Akṣhara-dhāma-vāsāya namah ।
8	Aum Shrī Divya-sundara-vigrahāya namah ।
9	Aum Shrī Sākārāya namah ।  
10	Aum Shrī Dvibhujāya namah ।

huladesign

<div id="map">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 29.7 1061.9 1545.2" id="nzmap">
<g fill="teal"><path d="M668.9 572.6c.6-6.5 1.9-13 2.4-19.4.3-4 .5-8 .4-12.1-.1-2.3-.1-2.5 1.4-4.2 1.2-1.3 1.9-2.5 2.8-4.1 2-3.8 2.6-6.9 2.8-11.1.2-3.8-.7-7.4-1.2-11.2-.2-1.7-1.6-2.7.2-3.4.8-.3 4.1-1.7 4.5-1 2 2.7 5.7 3.3 8.9 4.1-2.4-3.5 1.9-3.2 2.7-6 .3-1.2 0-2.6-1.3-3.3-2.2-1.1-3.9 1-4.7 2.7-1.1 2.5-1.7 1-1.7-.8 0-2.1.7-2.8 2-4.4.9-1.1 2-1.6 3.4-2.3.5-.3.6-1.2 1-1.5.5-.4 1.3-.6 1.9-.8-.5-1-1.3-1.6-.6-2.5.6-.9.4-1.7.5-2.7-2.4.1-4 .2-6.2 1.1-.6.2-.6 2.5-.8 3.1-.3 1.5-.5 1.8-1.6 2.9 0-1.9 1-7.8 0-9.4-.9-1.5-2.5-3.4-2.1-5.2.4-2 .7-3.5 2-5.1 2.5-3.1 5.1-3.2 8.9-3.2 1.9 0 2.5 0 3.7-1.5 1-1.4 2-2.7 2.9-4.1-1.2.6-2.8 1-3.9 1.8-1.6 1.1-1.3 1.7-3.3 1.6-2.4-.1-2.5-.1-3.8-2.2-.9-1.6-1.2-3.2-1.7-4.9-1-3.1-1.8-6.2-2.5-9.4-.7-2.7-.3-5.5-.8-8.2-.7-3.5-1.1-5.8-3.1-8.7-.7-1.1-2.3-2.8-2.6-4.1-.1-.6.1-3.5.6-3.9 1.2-1 2.3-2 3.5-3 .7-.6 2.2.9 3.4 1.1 1.3.2 2 .7 2.8-.3.7-.9 2.6-3.9 3.3-3.5-.5-.8-1.1-2.7-2.1-2.8l-4.4-.4 1.5-2.9c-1.3 1