..

components/unsorted/uinel-cart-EUTIlcoG.html

@@ -0,0 +1,121 @@
+<div> <section class="relative">
+    <div class="navbar-backdrop fixed inset-0 bg-blueGray-800 opacity-25"></div>
+    <div class="fixed top-0 right-0 bottom-0 w-full md:max-w-xl z-40">
+      <div class="flex flex-col h-full">
+        <div class="flex-1 w-full px-6 pt-20 pb-16 bg-white overflow-y-auto">
+          <div class="px-6 md:px-16">
+            <div class="relative flex flex-wrap items-center -mx-4 mb-8 pb-8 border-b border-gray-200 border-opacity-40">
+              <div class="relative w-full md:w-auto px-4 mb-6 md:mb-10 lg:mb-0">
+                <a href="#">
+                  <img class="w-20" src="uinel-assets/images/ecommerce-product-info/phone01.png" alt="">
+                </a>
+              </div>
+              <div class="w-full md:w-auto px-4">
+                <a class="block mb-2 font-heading font-medium hover:underline" href="#">Apple iPhone 12 Pro (128GB)</a>
+                <span class="flex items-center mb-3 text-xl font-heading font-medium text-blue-500">
+                  <span class="mr-2 text-sm">$</span>
+                  <span>544.90</span>
+                </span>
+                <div class="flex flex-wrap">
+                  <p class="mr-4 text-sm font-medium">
+                    <span class="font-heading">Color:</span>
+                    <span class="ml-2 text-gray-400">Silver</span>
+                  </p>
+                  <p class="text-sm font-medium">
+                    <span>Memory storage:</span>
+                    <span class="ml-2 text-gray-400">128GB</span>
+                  </p>
+                </div>
+              </div>
+              <button class="absolute top-0 right-0 text-gray-200 hover:text-gray-300">
+                <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+              </button>
+            </div>
+            <div class="relative flex flex-wrap items-center -mx-4 mb-8 pb-8 border-b border-gray-200 border-opacity-40">
+              <div class="relative w-full md:w-auto px-4 mb-6 md:mb-10 lg:mb-0">
+                <a href="#">
+                  <img class="w-20" src="uinel-assets/images/ecommerce-product-info/headphones.png" alt="">
+                </a>
+              </div>
+              <div class="w-full md:w-auto px-4">
+                <a class="block mb-2 font-heading font-medium hover:underline" href="#">Headphones SONY 1l X-O</a>
+                <span class="flex items-center mb-3 text-xl font-heading font-medium text-blue-500">
+                  <span class="mr-2 text-sm">$</span>
+                  <span>44.90</span>
+                </span>
+                <div class="flex flex-wrap">
+                  <p class="mr-4 text-sm font-medium">
+                    <span class="font-heading">Color:</span>
+                    <span class="ml-2 text-gray-400">Silver</span>
+                  </p>
+                </div>
+              </div>
+              <button class="absolute top-0 right-0 text-gray-200 hover:text-gray-300">
+                <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+              </button>
+            </div>
+            <div class="relative flex flex-wrap items-center -mx-4">
+              <div class="relative w-full md:w-auto px-4 mb-6 md:mb-10 lg:mb-0">
+                <a href="#">
+                  <img class="w-18" src="uinel-assets/images/ecommerce-product-info/smartwatch.png" alt="">
+                </a>
+              </div>
+              <div class="w-full md:w-auto px-4">
+                <a class="block mb-2 font-heading font-medium hover:underline" href="#">Smartwatch Uistore Watch 19</a>
+                <span class="flex items-center mb-3 text-xl font-heading font-medium text-blue-500">
+                  <span class="mr-2 text-sm">$</span>
+                  <span>120.90</span>
+                </span>
+                <div class="flex flex-wrap">
+                  <p class="mr-4 text-sm font-medium">
+                    <span class="font-heading">Color:</span>
+                    <span class="ml-2 text-gray-400">Green</span>
+                  </p>
+                  <p class="text-sm font-medium">
+                    <span>Size:</span>
+                    <span class="ml-2 text-gray-400">M</span>
+                  </p>
+                </div>
+              </div>
+              <button class="absolute top-0 right-0 text-gray-200 hover:text-gray-300">
+                <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+              </button>
+            </div>
+          </div>
+        </div>
+        <div class="relative mt-auto py-10 px-10 md:px-20 bg-purple-500">
+          <div class="mb-6 text-right">
+            <button class="text-white">
+              <svg width="14" height="13" viewbox="0 0 14 13" fill="none" xmlns="http://www.w3.org/2000/svg"><line x1="13.495" y1="0.494975" x2="1.49498" y2="12.495" stroke="currentColor" stroke-width="1.4"></line><line x1="12.505" y1="12.495" x2="0.505026" y2="0.494976" stroke="currentColor" stroke-width="1.4"></line></svg>
+            </button>
+          </div>
+          <img class="absolute top-0 left-0 h-full" src="uinel-assets/images/ecommerce-cart/color-bar.svg" alt="">
+          <h2 class="mb-5 text-2xl font-heading font-medium text-white">Totals</h2>
+          <div class="flex justify-between items-center mb-3">
+            <h4 class="font-heading font-medium text-white text-opacity-50">Subtotal</h4>
+            <span class="text-xl font-heading font-medium text-white">
+              <span class="text-base">$</span>
+              <span>710,70</span>
+            </span>
+          </div>
+          <div class="flex mb-6 justify-between items-center">
+            <h4 class="font-heading font-medium text-white text-opacity-50">Shipping</h4>
+            <span class="text-xl font-heading font-medium text-white">
+              <span class="text-base">$</span>
+              <span>10,00</span>
+            </span>
+          </div>
+          <div class="pt-6 mb-6 border-t border-white border-opacity-20">
+            <div class="flex pb-4 justify-between items-center">
+              <h4 class="font-heading font-medium text-white">Total</h4>
+              <span class="text-xl font-heading font-medium text-white">
+                <span class="text-base">$</span>
+                <span>720,70</span>
+              </span>
+            </div>
+          </div>
+          <div class="text-center"><a class="inline-block py-4 px-10 text-lg text-white font-heading font-medium tracking-tighter text-center bg-blue-500 focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 hover:bg-blue-600 rounded-xl" href="#">Checkout</a></div>
+        </div>
+      </div>
+    </div>
+  </section></div>

components/unsorted/uinel-cart-fSgPmoww.html

@@ -0,0 +1,160 @@
+<div><section class="pt-12 pb-24 bg-blueGray-100">
+    <div class="container px-4 mx-auto">
+      <ul class="flex flex-wrap items-center mb-10 xl:mb-0">
+        <li class="mr-6">
+          <a class="flex items-center text-sm font-medium text-gray-400 hover:text-gray-500" href="#">
+            <span>Home</span>
+            <svg class="ml-6" width="4" height="7" viewbox="0 0 4 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M0.150291 0.898704C-0.0500975 0.692525 -0.0500975 0.359292 0.150291 0.154634C0.35068 -0.0507836 0.674443 -0.0523053 0.874831 0.154634L3.7386 3.12787C3.93899 3.33329 3.93899 3.66576 3.7386 3.8727L0.874832 6.84594C0.675191 7.05135 0.35068 7.05135 0.150292 6.84594C-0.0500972 6.63976 -0.0500972 6.30652 0.150292 6.10187L2.49888 3.49914L0.150291 0.898704Z" fill="currentColor"></path>
+            </svg>
+          </a>
+        </li>
+        <li class="mr-6">
+          <a class="flex items-center text-sm font-medium text-gray-400 hover:text-gray-500" href="#">
+            <span>Store</span>
+            <svg class="ml-6" width="4" height="7" viewbox="0 0 4 7" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <path d="M0.150291 0.898704C-0.0500975 0.692525 -0.0500975 0.359292 0.150291 0.154634C0.35068 -0.0507836 0.674443 -0.0523053 0.874831 0.154634L3.7386 3.12787C3.93899 3.33329 3.93899 3.66576 3.7386 3.8727L0.874832 6.84594C0.675191 7.05135 0.35068 7.05135 0.150292 6.84594C-0.0500972 6.63976 -0.0500972 6.30652 0.150292 6.10187L2.49888 3.49914L0.150291 0.898704Z" fill="currentColor"></path>
+            </svg>
+          </a>
+        </li>
+        <li><a class="text-sm font-medium text-indigo-500 hover:text-indigo-600" href="#">Your cart</a></li>
+      </ul>
+      <div class="pb-9 mb-7 text-center border-b border-black border-opacity-5">
+        <h2 class="text-9xl xl:text-10xl leading-normal font-heading font-medium text-center">Your cart</h2>
+      </div>
+      <div class="py-12 px-8 md:px-12 mb-14 xl:mb-9 bg-white rounded-3xl">
+        <span class="inline-block mb-16 text-darkBlueGray-300 font-medium">3 products</span>
+        <div class="lg:px-10">
+          <div class="relative flex flex-wrap items-center -mx-4 mb-8 pb-8 border-b border-gray-200 border-opacity-40">
+            <div class="relative w-full md:w-auto px-4 md:pr-10 mb-6 md:mb-0">
+              <a class="block mx-auto max-w-max" href="#">
+                <img class="w-24 object-cover" src="uinel-assets/images/ecommerce-product-info/phone01.png" alt="">
+              </a>
+            </div>
+            <div class="w-full md:w-auto px-4 mb-6 lg:mb-0">
+              <a class="block mb-5 text-xl font-heading font-medium hover:underline" href="#">Apple iPhone 12 Pro (128GB)</a>
+              <div class="flex flex-wrap">
+                <p class="mr-4 text-sm font-medium">
+                  <span class="font-heading">Color:</span>
+                  <span class="ml-2 text-gray-400">Silver</span>
+                </p>
+                <p class="text-sm font-medium">
+                  <span>Memory storage:</span>
+                  <span class="ml-2 text-gray-400">128GB</span>
+                </p>
+              </div>
+            </div>
+            <div class="w-full md:w-1/2 lg:w-auto px-4 ml-auto">
+              <div class="inline-flex w-full md:w-auto mb-4 md:mb-0 md:mr-10 items-center">
+                <h4 class="mr-4 font-heading font-medium">Qty:</h4>
+                <input class="w-16 px-3 py-2 text-center placeholder-gray-400 text-gray-400 bg-blue-50 border-2 border-blue-400 outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 rounded-xl" type="text" placeholder="1">
+              </div>
+              <span class="text-xl font-heading font-medium text-blue-500">
+                <span class="text-sm">$</span>
+                <span>544.90</span>
+              </span>
+            </div>
+            <button class="absolute top-0 right-0 lg:mt-2 lg:-mr-4 text-gray-200 hover:text-gray-300">
+              <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+            </button>
+          </div>
+          <div class="relative flex flex-wrap items-center -mx-4 mb-8 pb-8 border-b border-gray-200 border-opacity-40">
+            <div class="relative w-full md:w-auto px-4 md:pr-10 mb-6 md:mb-0">
+              <a class="block mx-auto max-w-max" href="#">
+                <img class="w-24 object-cover" src="uinel-assets/images/ecommerce-product-info/headphones.png" alt="">
+              </a>
+            </div>
+            <div class="w-full md:w-auto px-4 mb-6 lg:mb-0">
+              <a class="block mb-5 text-xl font-heading font-medium hover:underline" href="#">Headphones SONY 1l X-O</a>
+              <div class="flex flex-wrap">
+                <p class="mr-4 text-sm font-medium">
+                  <span class="font-heading">Color:</span>
+                  <span class="ml-2 text-gray-400">Grey</span>
+                </p>
+              </div>
+            </div>
+            <div class="w-full md:w-1/2 lg:w-auto px-4 ml-auto">
+              <div class="inline-flex w-full md:w-auto mb-4 md:mb-0 md:mr-10 items-center">
+                <h4 class="mr-4 font-heading font-medium">Qty:</h4>
+                <input class="w-16 px-3 py-2 text-center placeholder-gray-400 text-gray-400 bg-blue-50 border-2 border-blue-400 outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 rounded-xl" type="text" placeholder="1">
+              </div>
+              <span class="text-xl font-heading font-medium text-blue-500">
+                <span class="text-sm">$</span>
+                <span>44.90</span>
+              </span>
+            </div>
+            <button class="absolute top-0 right-0 lg:mt-2 lg:-mr-4 text-gray-200 hover:text-gray-300">
+              <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+            </button>
+          </div>
+          <div class="relative flex flex-wrap items-center -mx-4">
+            <div class="relative w-full md:w-auto px-4 md:pr-10 mb-6 md:mb-0">
+              <a class="block mx-auto max-w-max" href="#">
+                <img class="w-24 object-cover" src="uinel-assets/images/ecommerce-product-info/smartwatch.png" alt="">
+              </a>
+            </div>
+            <div class="w-full md:w-auto px-4">
+              <a class="block mb-5 text-xl font-heading font-medium hover:underline" href="#">Smartwatch Uistore Watch 19</a>
+              <div class="flex flex-wrap">
+                <p class="mr-4 text-sm font-medium">
+                  <span class="font-heading">Color:</span>
+                  <span class="ml-2 text-gray-400">Green</span>
+                </p>
+                <p class="text-sm font-medium">
+                  <span>Size:</span>
+                  <span class="ml-2 text-gray-400">M</span>
+                </p>
+              </div>
+            </div>
+            <div class="w-full md:w-1/2 lg:w-auto ml-auto px-4 mb-6 md:mb-0">
+              <div class="inline-flex w-full md:w-auto mb-4 md:mb-0 md:mr-10 items-center">
+                <h4 class="mr-4 font-heading font-medium">Qty:</h4>
+                <input class="w-16 px-3 py-2 text-center placeholder-gray-400 text-gray-400 bg-blue-50 border-2 border-blue-400 outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 rounded-xl" type="text" placeholder="1">
+              </div>
+              <span class="text-xl font-heading font-medium text-blue-500">
+                <span class="text-sm">$</span>
+                <span>120.90</span>
+              </span>
+            </div>
+            <button class="absolute top-0 right-0 lg:mt-2 lg:-mr-4 text-gray-200 hover:text-gray-300">
+              <svg width="28" height="28" viewbox="0 0 28 28" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="0.5" y="0.5" width="27" height="27" rx="13.5" stroke="currentColor"></rect><line x1="20.495" y1="8.49497" x2="8.49498" y2="20.495" stroke="currentColor" stroke-width="1.4"></line><line x1="19.505" y1="20.495" x2="7.50503" y2="8.49498" stroke="currentColor" stroke-width="1.4"></line></svg>
+            </button>
+          </div>
+        </div>
+      </div>
+      <div class="lg:flex xl:items-center">
+        <div class="mb-10 xl:mb-0 lg:w-2/12 xl:w-1/12">
+          <h3 class="text-xl font-heading font-medium">Cart totals</h3>
+        </div>
+        <div class="sm:flex sm:flex-wrap lg:justify-end lg:w-10/12 xl:w-11/12">
+          <div class="sm:pr-3 lg:px-3 mb-6 xl:mb-0 w-full sm:w-1/2 lg:w-4/12 xl:w-3/12">
+            <div class="relative flex items-center justify-between py-4 px-10 leading-8 bg-white bg-opacity-50 font-medium rounded-3xl">
+              <div class="absolute left-3 flex justify-center items-center w-20 h-20 bg-white rounded-full">
+                <div class="flex justify-center items-center w-11 h-11 text-xl text-white font-bold bg-blue-500 rounded-full">3</div>
+              </div>
+              <span class="ml-16">Products</span>
+            </div>
+          </div>
+          <div class="sm:pl-3 lg:px-3 mb-3 xl:mb-0 w-full sm:w-1/2 lg:w-4/12 xl:w-3/12">
+            <div class="flex items-center justify-between py-4 px-10 leading-8 bg-white bg-opacity-50 font-heading font-medium rounded-3xl">
+              <span>Shipping</span>
+              <span class="flex items-center">
+                <span class="mr-3 text-sm">$</span>
+                <span class="text-xl">10,00</span>
+              </span>
+            </div>
+          </div>
+          <div class="sm:pr-3 lg:px-3 mb-10 sm:mb-0 w-full sm:w-1/2 lg:w-4/12 xl:w-3/12">
+            <div class="flex items-center justify-between py-4 px-10 leading-8 bg-white font-heading font-medium rounded-3xl">
+              <span>Total</span>
+              <span class="flex items-center text-blue-500">
+                <span class="mr-3 text-sm">$</span>
+                <span class="text-xl">720,70</span>
+              </span>
+            </div>
+          </div>
+          <div class="sm:pl-3 w-full sm:w-1/2 lg:max-w-max lg:ml-auto xl:ml-0"><a class="block py-5 px-10 w-full text-xl leading-6 font-medium tracking-tighter font-heading text-center text-white bg-blue-500 hover:bg-blue-600 focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 rounded-xl" href="#">Checkout</a></div>
+        </div>
+      </div>
+    </div>
+  </section> </div>