<!-- Hero -->
<div class="hero min-h-screen bg-base-200">
  <div class="hero-content flex-col lg:flex-row-reverse">
    <img
      src="/images/hero_image.gif"
      class="max-w-xs lg:max-w-sm md:max-w-sm rounded-lg shadow-2xl"
    />
    <div>
      <h1 class="text-5xl font-bold">Qtools!!!</h1>
      <p class="py-6">
        Welcome to Qtools, your ultimate hub for
        <a href="/#tools" rel="noopener noreferrer"><u>quick tools</u></a
        >. Discover a world of powerful tools designed to simplify your workflow
        and amplify your productivity. With Qtools, resizing images, converting
        audio to text, generating QR codes, and many more are just a click away.
        Our extensive collection of quick tools and
        <a
          href="/api"
          target="_blank"
          rel="noopener noreferrer"
          class="link link-primary bg-primary-content"
          >powerful APIs</a
        >
        cover a wide range of tasks, ensuring you have a lot of what you need in
        one convenient place.
      </p>
      <a href="/login" rel="noopener noreferrer" class="btn btn-primary mx-1"
        >Get Started</a
      >
    </div>
  </div>
</div>

<!-- All Tools -->
<div id="tools" class="bg-base-300 p-1">
  <div class="divider text-primary text-2xl bg-base-300 pt-4">All Tools</div>
  <div class="min-h-fit bg-base-300">
    <!-- single 3 column row -->
    <div class="flex flex-col w-full lg:flex-row px-5 my-10">
      <a
        href="tools/image-resizer"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� Image Resizer</a
      >
      <div class="divider lg:divider-horizontal"></div>
      <a
        href="tools/generate-text-from-audio"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 card bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� Generate Text From Audio</a
      >
      <div class="divider lg:divider-horizontal"></div>
      <a
        href="tools/video-to-mp3-converter"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 card bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� Video To MP3 Converter</a
      >
    </div>

    <!-- single 3 column row -->
    <div class="flex flex-col w-full lg:flex-row px-5 my-10">
      <a
        href="tools/extract-text-from-image"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 card bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� Extract Text From Image</a
      >
      <div class="divider lg:divider-horizontal"></div>
      <a
        href="tools/extract-text-from-video"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 card bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� Extract text from video</a
      >
      <div class="divider lg:divider-horizontal"></div>
      <a
        href="tools/QR-generator"
        rel="noopener noreferrer"
        class="btn btn-outline flex-grow grid h-20 card bg-base-300 rounded-box place-items-center"
        >ğŸ› ï¸� QR Code Generator</a
      >
    </div>
  </div>
  <div class="pb-5 font-extralight text-center">More tools coming soon...</div>
</div>

<!-- Pricing -->
<div
  id="pricing"
  class="bg-base-200 pt-1 pb-4 px-2 m-5 lg:px-5 lg:m-10 rounded-xl"
  data-theme="synthwave"
>
  <div id="tools" class="divider text-primary text-2xl bg-base-200">
    Pricing
  </div>
  <div class="stats stats-vertical bg-base-200 min-w-full lg:stats-horizontal">
    <div class="stat">
      <div class="stat-title">Free</div>
      <div class="stat-value">
        Rs. 0 <span class="text-sm font-light align-middle">/ month</span>
      </div>
      <div class="stat-desc text-sm">- Monthly File Transfer Limit: 50mb</div>
      <div class="stat-desc text-sm">- Montlhy API calls: 25</div>
    </div>

    <div class="stat">
      <div class="stat-title">ğŸ‘‘ Pro</div>
      <div class="stat-value">
        Rs. 10 <span class="text-sm font-light align-middle">/ month</span>
      </div>
      <div class="stat-desc text-sm">+ Monthly File Transfer Limit: 200mb</div>
      <div class="stat-desc text-sm">+ Montlhy API calls: 100</div>
    </div>

    <div class="stat" data-theme="luxury">
      <div class="stat-title">ğŸ‘‘ğŸ‘‘ Unlimited</div>
      <div class="stat-value">
        Rs. 50 <span class="text-sm font-light align-middle">/ month</span>
      </div>
      <div class="stat-desc text-sm lg:text-lg">
        ++ Monthly File Transfer Limit: Unlimited
      </div>
      <div class="stat-desc text-sm lg:text-lg">
        ++ Montlhy API calls: Unlimited
      </div>
    </div>
  </div>
</div>

<!-- About -->
<div
  id="about"
  class="bg-base-100 p-1 m-5 lg:m-10 rounded-xl"
  data-theme="cyberpunk"
>
  <div id="tools" class="divider text-primary text-2xl bg-base-100">About</div>
  <div class="hero min-h-fit bg-base-100">
    <div class="hero-content text-center">
      <div class="max-w-screen-md">
        <p class="py-3">
          Qtools is an open-source project, with both the website and API
          released under the
          <em><code>GNU Affero General Public License</code></em>
          on
          <a
            href="https://github.com/HarshRaj2717/Qtools"
            target="_blank"
            rel="noopener noreferrer"
            class="link link-primary"
            >GitHub</a
          >. I am regularly trying to improve the site and add more features, so
          feel free to start an issue for either the
          <a
            class="link link-primary"
            href="https://github.com/HarshRaj2717/Qtools/issues/new"
            target="_blank"
            rel="noopener noreferrer"
            >website</a
          >
          or the
          <a
            class="link link-primary"
            href="https://github.com/HarshRaj2717/Qtools-API/issues/new"
            target="_blank"
            rel="noopener noreferrer"
            >API</a
          >. <br />
          Also, I have kept the pricing very minimal to support the costs that
          might come from hosting. If you want to support, then please do
          purchase a plan; otherwise, you can also deploy your own Qtools
          website by forking my repo.
        </p>
        <h1 class="text-lg font-semibold py-3">
          Designed & Built with â�¤ï¸� by
          <span
            ><a
              class="btn btn-secondary btn-sm"
              href="https://hraj.dev"
              target="_blank"
              rel="noopener noreferrer"
              ><u>Harsh Raj</u></a
            >
          </span>
        </h1>
      </div>
    </div>
  </div>
</div>
