Feedback

Your Feedback matters!

{#each tabs as item, i} {/each}

</div>

<ul class="flex gap-5 justify-center mt-5 mb-5">
      {#if category === "general"}
        <li on:click={() => (rating = "Very Good")} class="cursor-pointer">
          <div
            class="rounded-full w-16 h-16 relative {rating === 'Very Good'
              ? 'bg-secondary'
              : ''} hover:bg-secondary flex items-center justify-center"
          >
            <img
              class="w-8 h-8 sm:w-10 sm:h-10"
              src={veryGoodEmoji}
              loading="lazy"
            />
          </div>
        </li>
        <li on:click={() => (rating = "Good")} class="cursor-pointer">
          <div
            class="rounded-full w-16 h-16 relative {rating === 'Good'
              ? 'bg-secondary'
              : ''} hover:bg-secondary flex items-center justify-center"
          >
            <img
              class="w-8 h-8 sm:w-10 sm:h-10"
              src={goodEmoji}
              loading="lazy"
            />
          </div>
        </li>
        <li on:click={() => (rating = "Bad")} class="cursor-pointer">
          <div
            class="rounded-full w-16 h-16 relative {rating === 'Bad'
              ? 'bg-secondary'
              : ''} hover:bg-secondary flex items-center justify-center"
          >
            <img
              class="w-8 h-8 sm:w-10 sm:h-10"
              src={badEmoji}
              loading="lazy"
            />
          </div>
        </li>
        <li on:click={() => (rating = "Very Bad")} class="cursor-pointer">
          <div
            class="rounded-full w-16 h-16 relative {rating === 'Very Bad'
              ? 'bg-secondary'
              : ''} hover:bg-secondary flex items-center justify-center"
          >
            <img
              class="w-8 h-8 sm:w-10 sm:h-10"
              src={veryBadEmoji}
              loading="lazy"
            />
          </div>
        </li>
      {/if}
    </ul>

<button
      on:click={() => sendFeedback()}
      class="mb-4 px-3 py-2 bg-[#fff] sm:hover:bg-gray-300 {(category ===
        'general' &&
        rating?.length !== 0 &&
        inputValue?.length !== 0) ||
      (category !== 'general' && inputValue?.length !== 0)
        ? 'opacity-100 cursor-pointer'
        : 'opacity-60 cursor-not-allowed'} w-11/12 rounded-md m-auto text-black font-semibold text-md"
    >
      Send Feedback
    </button>
  </div>
</dialog>