index.html

<!DOCTYPE html>
<html>
  <head>
    <title>Poltio SDK Demos</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" href="/public/favicon.ico" />
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body class="mx-5">
    <h1 class="text-3xl font-bold underline">Poltio SDK Demos</h1>

    <nav class="flex flex-1 flex-col" aria-label="Sidebar">
      <ul role="list" class="-mx-2 space-y-1">
        <li>
          <a
            href="ecom/home.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Home Page with SDK Bubble (Dynamic Widget)</a
          >
        </li>
        <li>
          <a
            href="ecom/product.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Product Page with SDK Bubble</a
          >
        </li>
        <li>
          <a
            href="ecom/product_flying.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Product Page with Flying Widget
          </a>
        </li>
        <li>
          <a
            href="ecom/product_hide_button.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Product Page with In Page Toggles (click "let's choose
            together")
          </a>
        </li>
        <li>
          <a
            href="gtm/gtm.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Implementation with GTM Example</a
          >
        </li>
        <li>
          <a
            href="gtm/gtm1.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Implementation with GTM_1 Example</a
          >
        </li>
        <li>
          <a
            href="gtm/gtm2.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Ecommerce Implementation with GTM_2 Example</a
          >
        </li>
      </ul>
    </nav>
    <h2 class="text-xl font-semibold underline mt-5">
      Flying Widget With Different Positions
    </h2>
    <nav class="flex flex-1 flex-col" aria-label="Sidebar">
      <ul role="list" class="-mx-2 space-y-1">
        <li>
          <a
            href="ecom/product_top_right.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Top Right</a
          >
        </li>
        <li>
          <a
            href="ecom/product_center_right.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Center Right</a
          >
        </li>
        <li>
          <a
            href="ecom/product_top_left.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Top Left
          </a>
        </li>
        <li>
          <a
            href="ecom/product_center_left.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Center Left
          </a>
        </li>
        <li>
          <a
            href="ecom/product_bottom_left.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Bottom Left</a
          >
        </li>
      </ul>
    </nav>
    <h2 class="text-xl font-semibold underline mt-5">
      Flying Widget With Different Initial Positions
    </h2>
    <nav class="flex flex-1 flex-col" aria-label="Sidebar">
      <ul role="list" class="-mx-2 space-y-1">
        <li>
          <a
            href="ecom/product_active.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Active</a
          >
        </li>
        <li>
          <a
            href="ecom/product_expanded.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Expanded</a
          >
        </li>
      </ul>
    </nav>
    <h2 class="text-xl font-semibold underline mt-5">
      New Result Card Examples
    </h2>
    <nav class="flex flex-1 flex-col" aria-label="Sidebar">
      <ul role="list" class="-mx-2 space-y-1">
        <li>
          <a
            href="newcards/results.html?test"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Generic Results</a
          >
        </li>
        <li>
          <a
            href="newcards/results_w_leads.html?test"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >Generic Results with Leads</a
          >
        </li>
        <li>
          <a
            href="newcards/single_result.html?test"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            >1-2 Results</a
          >
        </li>
      </ul>
    </nav>
    <h2 class="text-xl font-semibold underline mt-5">Live Examples</h2>
    <div class="flex flex-1 flex-col" aria-label="Sidebar">
      <ul role="list" class="-mx-2 space-y-1">
        <li>
          <a
            href="https://www.beko.com/gulf/ae-en/products/freestanding-washing-machines"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Beko Global Washing Machines - custom flying widget</a
          >
        </li>
        <li>
          <a
            href="https://www.mavi.com/jeanguide"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Mavi TR Jean Fit Finder - Flying Widget</a
          >
        </li>
        <li>
          <a
            href="https://www.lux.com/arabia/en/lux-profiler.html"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Lux Fragrance Finder - LP
          </a>
        </li>
        <li>
          <a
            href="https://online.vitra.com.tr/tr"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Vitra TR Bathroom Style or Appliance Finder - Flying Widget
          </a>
        </li>
        <li>
          <a
            href="https://www.poltio.com/e/set/2299?resultfit=vf&loc=en"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Recipe Finder Example - Free Input Autocomplete - LP</a
          >
        </li>
        <li>
          <a
            href="https://www.poltio.com/widget/801ec5e191ac?loc=en"
            class="group flex gap-x-3 rounded-md p-2 pl-3 text-sm font-semibold leading-6 text-gray-700 hover:bg-gray-50 hover:text-indigo-600"
            target="_blank"
            >Cheese Quiz - Example Quiz with Form Input at end</a
          >
        </li>
      </ul>
    </div>
  </body>
</html>