import { JSXElement } from "solid-js";

import { EngagementIcon } from "../../Util/Icons";

export default function EngagementButton(): JSXElement {
  return (
    <>
      <div class="flex p-1">
        <button
          class="rounded-base btn btn-xs hover:border-primary"
          aria-label="Show sign of engagement"
        >
          <EngagementIcon />
        </button>
        <span class="text-1xl countdown px-1.5 pt-1.5 text-center">
          <p style={{ "--value": 46 }}></p>
        </span>
      </div>
    </>
  );
}