From 4bf09bb44a3a2f1bf9c524e0047d037bd0c1278a Mon Sep 17 00:00:00 2001
From: SriCharitaG <cherry.studies19@gmail.com>
Date: Mon, 20 May 2024 17:10:10 +0530
Subject: [PATCH 1/4] docs: Add prerequisites section and fix grammar in
 README.md

---
 README.md | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index cc7360d..fab5b31 100644
--- a/README.md
+++ b/README.md
@@ -2,15 +2,22 @@
   <a href="https://floatui.com/" rel="noopener" target="_blank"><img width="200" src="public/logo.svg" alt="Float UI logo"></a>
 </p>
 
-Float UI is collection of modern UI components and website templates built on top of React, and Vue (soon) with Tailwind CSS, the components are beautiful designed, expertly crafted, allow you to build beautiful websites.
+Float UI is a collection of modern UI components and website templates built on top of React, and soon, Vue. With Tailwind CSS, the components are beautifully designed and expertly crafted, allowing you to build beautiful websites.
 
 ## Why Float UI?
 
-First, Float UI is fully free, and open source, you don't need to pay anything to use it, and we are working on it full-time, so we'll keep improving, and adding more UIs, the second thing if you’re working on a large project that requires a high level of UI customization or you find yourself repeating the same UI patterns across projects, consider creating an internal UI library, and in this case Float UI is a great choice. You should definitely use it.
+Float UI is fully free and open source. You don't need to pay anything to use it, and we are working on it full-time, so we'll keep improving and adding more UIs. If you’re working on a large project that requires a high level of UI customization or you find yourself repeating the same UI patterns across projects, consider creating an internal UI library. In this case, Float UI is a great choice. You should definitely use it.
+
+## Prerequisites
+
+Before you begin, ensure you have met the following requirements:
+
+* You have installed the latest version of npm/yarn/pnpm.
+* You have a `Windows/Linux/Mac` machine.
 
 ## Getting Started
 
-First, install the dependencies we highly recommend using pnpm, and run the development server:
+First, install the dependencies. We highly recommend using pnpm, and run the development server:
 
 ```bash
 npm run dev
@@ -18,7 +25,6 @@ npm run dev
 yarn dev
 # or
 pnpm dev
-```
 
 Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 

From 8e35dbb8b6e045b980dc56747a1ac30c2706c0c9 Mon Sep 17 00:00:00 2001
From: SriCharitaG <cherry.studies19@gmail.com>
Date: Wed, 22 May 2024 14:10:05 +0530
Subject: [PATCH 2/4] changedthe primary footer

---
 componentsDB/footers/footers-c68b86ce5cab.mdx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/componentsDB/footers/footers-c68b86ce5cab.mdx b/componentsDB/footers/footers-c68b86ce5cab.mdx
index 72cf4ec..ff1cbd6 100644
--- a/componentsDB/footers/footers-c68b86ce5cab.mdx
+++ b/componentsDB/footers/footers-c68b86ce5cab.mdx
@@ -3,7 +3,7 @@ title: Primary Footer
 category: Marketing
 paid: false
 isActive: true
-ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto\">\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n      <li v-for=\"item in footerNavs\" :key=\"item.id\" class=\"hover:text-gray-800\">\n        <a href=\"{{item.href}}\">\n          {{item.name}}\n        </a>\n      </li>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>\n\n<style scoped>\n.svg-icon path,\n.svg-icon polygon,\n.svg-icon rect {\n  fill: currentColor;\n}\n</style>","label":"App.vue"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-primary\">\n    <div class=\"footer-header\">\n      <img src=\"https://www.floatui.com/logo.svg\" />\n      <p>\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-list\">\n      <li class=\"item\" v-for=\"item in footerNavs\" :key=\"item.id\">\n        <a href={{item.href}}>\n          {{item.name}}\n        </a>\n      </li>\n      \n    </ul>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}","label":"style.css"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n    { href: 'javascript:void(0)', name: 'About' },\n    { href: 'javascript:void(0)', name: 'Blog' },\n    { href: 'javascript:void(0)', name: '' },\n    { href: 'javascript:void(0)', name: 'Team' },\n    { href: 'javascript:void(0)', name: 'Careers' },\n    { href: 'javascript:void(0)', name: 'Support' }\n  ];\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n  <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" alt=\"Logo\"/>\n    <p class=\"leading-relaxed mt-2 text-[15px]\">\n      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n    </p>\n  </div>\n  <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n    {#each footerNavs as item, idx}\n      <li class=\"hover:text-gray-800\">\n        <a href={item.href}>\n          {item.name}\n        </a>\n      </li>\n    {/each}\n  </ul>\n  <div class=\"mt-8 items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>"}]},"html":{"htmlTail":[{"code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\"\n  >\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since\n        the 1500s, when an unknown printer took a galley of type and\n        scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul\n      class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\"\n    >\n      <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n        <li class=\"hover:text-gray-800\">\n          <a :href=\"item.href\" x-text=\"item.name\"></a>\n        </li>\n      </template>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</div>\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n<script>\n  function footerComponent() {\n    return {\n      footerNavs: [\n        {\n          href: \"javascript:void()\",\n          name: \"About\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Blog\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Team\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Careers\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Support\",\n        },\n      ],\n    };\n  }\n</script>","label":"index.html"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"footer-primary\">\n            <div className=\"footer-header\">\n                <img src=\"https://www.floatui.com/logo.svg\" />\n                <p>\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-list\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\"item\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n","label":"App.jsx"}]}}
+ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5 \">\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n      <li v-for=\"item in footerNavs\" :key=\"item.id\" class=\"hover:text-gray-800\">\n        <a href=\"{{item.href}}\">\n          {{item.name}}\n        </a>\n      </li>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>\n\n<style scoped>\n.svg-icon path,\n.svg-icon polygon,\n.svg-icon rect {\n  fill: currentColor;\n}\n</style>","label":"App.vue"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-primary\">\n    <div class=\"footer-header\">\n      <img src=\"https://www.floatui.com/logo.svg\" />\n      <p>\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-list\">\n      <li class=\"item\" v-for=\"item in footerNavs\" :key=\"item.id\">\n        <a href={{item.href}}>\n          {{item.name}}\n        </a>\n      </li>\n      \n    </ul>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}","label":"style.css"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n    { href: 'javascript:void(0)', name: 'About' },\n    { href: 'javascript:void(0)', name: 'Blog' },\n    { href: 'javascript:void(0)', name: '' },\n    { href: 'javascript:void(0)', name: 'Team' },\n    { href: 'javascript:void(0)', name: 'Careers' },\n    { href: 'javascript:void(0)', name: 'Support' }\n  ];\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n  <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" alt=\"Logo\"/>\n    <p class=\"leading-relaxed mt-2 text-[15px]\">\n      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n    </p>\n  </div>\n  <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n    {#each footerNavs as item, idx}\n      <li class=\"hover:text-gray-800\">\n        <a href={item.href}>\n          {item.name}\n        </a>\n      </li>\n    {/each}\n  </ul>\n  <div class=\"mt-8 items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>"}]},"html":{"htmlTail":[{"code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5  md:px-8\"\n  >\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since\n        the 1500s, when an unknown printer took a galley of type and\n        scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul\n      class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\"\n    >\n      <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n        <li class=\"hover:text-gray-800\">\n          <a :href=\"item.href\" x-text=\"item.name\"></a>\n        </li>\n      </template>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</div>\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n<script>\n  function footerComponent() {\n    return {\n      footerNavs: [\n        {\n          href: \"javascript:void()\",\n          name: \"About\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Blog\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Team\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Careers\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Support\",\n        },\n      ],\n    };\n  }\n</script>","label":"index.html"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"footer-primary\">\n            <div className=\"footer-header\">\n                <img src=\"https://www.floatui.com/logo.svg\" />\n                <p>\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-list\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\"item\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n","label":"App.jsx"}]}}
 slug: /footers
 id: 7d4490b8-e7f8-4997-a8e2-c68b86ce5cab
 created_at: 1

From 4d50489a0298dae0bd870e614985a22fb7c603f7 Mon Sep 17 00:00:00 2001
From: SriCharitaG <cherry.studies19@gmail.com>
Date: Thu, 23 May 2024 00:50:18 +0530
Subject: [PATCH 3/4] corrects typo

---
 componentsDB/footers/footers-c68b86ce5cab.mdx | 2 +-
 componentsDB/navbars/navbars-d6a3586b937a.mdx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/componentsDB/footers/footers-c68b86ce5cab.mdx b/componentsDB/footers/footers-c68b86ce5cab.mdx
index ff1cbd6..32e909b 100644
--- a/componentsDB/footers/footers-c68b86ce5cab.mdx
+++ b/componentsDB/footers/footers-c68b86ce5cab.mdx
@@ -3,7 +3,7 @@ title: Primary Footer
 category: Marketing
 paid: false
 isActive: true
-ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5 \">\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n      <li v-for=\"item in footerNavs\" :key=\"item.id\" class=\"hover:text-gray-800\">\n        <a href=\"{{item.href}}\">\n          {{item.name}}\n        </a>\n      </li>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>\n\n<style scoped>\n.svg-icon path,\n.svg-icon polygon,\n.svg-icon rect {\n  fill: currentColor;\n}\n</style>","label":"App.vue"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-primary\">\n    <div class=\"footer-header\">\n      <img src=\"https://www.floatui.com/logo.svg\" />\n      <p>\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-list\">\n      <li class=\"item\" v-for=\"item in footerNavs\" :key=\"item.id\">\n        <a href={{item.href}}>\n          {{item.name}}\n        </a>\n      </li>\n      \n    </ul>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Suuport'\n        }\n      ]\n    }\n  },\n}\n</script>"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}","label":"style.css"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n    { href: 'javascript:void(0)', name: 'About' },\n    { href: 'javascript:void(0)', name: 'Blog' },\n    { href: 'javascript:void(0)', name: '' },\n    { href: 'javascript:void(0)', name: 'Team' },\n    { href: 'javascript:void(0)', name: 'Careers' },\n    { href: 'javascript:void(0)', name: 'Support' }\n  ];\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n  <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" alt=\"Logo\"/>\n    <p class=\"leading-relaxed mt-2 text-[15px]\">\n      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n    </p>\n  </div>\n  <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n    {#each footerNavs as item, idx}\n      <li class=\"hover:text-gray-800\">\n        <a href={item.href}>\n          {item.name}\n        </a>\n      </li>\n    {/each}\n  </ul>\n  <div class=\"mt-8 items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>"}]},"html":{"htmlTail":[{"code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5  md:px-8\"\n  >\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since\n        the 1500s, when an unknown printer took a galley of type and\n        scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul\n      class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\"\n    >\n      <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n        <li class=\"hover:text-gray-800\">\n          <a :href=\"item.href\" x-text=\"item.name\"></a>\n        </li>\n      </template>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</div>\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n<script>\n  function footerComponent() {\n    return {\n      footerNavs: [\n        {\n          href: \"javascript:void()\",\n          name: \"About\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Blog\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Team\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Careers\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Support\",\n        },\n      ],\n    };\n  }\n</script>","label":"index.html"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n    return (\n        <footer className=\"footer-primary\">\n            <div className=\"footer-header\">\n                <img src=\"https://www.floatui.com/logo.svg\" />\n                <p>\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-list\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\"item\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'Suuport'\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n","label":"App.jsx"}]}}
+ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5 \">\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n      <li v-for=\"item in footerNavs\" :key=\"item.id\" class=\"hover:text-gray-800\">\n        <a href=\"{{item.href}}\">\n          {{item.name}}\n        </a>\n      </li>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'Support'\n        }\n      ]\n    }\n  },\n}\n</script>\n\n<style scoped>\n.svg-icon path,\n.svg-icon polygon,\n.svg-icon rect {\n  fill: currentColor;\n}\n</style>","label":"App.vue"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-primary\">\n    <div class=\"footer-header\">\n      <img src=\"https://www.floatui.com/logo.svg\" />\n      <p>\n        Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a\n        galley of type and scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul class=\"items-list\">\n      <li class=\"item\" v-for=\"item in footerNavs\" :key=\"item.id\">\n        <a href={{item.href}}>\n          {{item.name}}\n        </a>\n      </li>\n      \n    </ul>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          href: 'javascript:void()',\n          name: 'About'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Blog'\n        },\n        {\n          href: 'javascript:void()',\n          name: ''\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Team'\n        },\n        {\n          href: 'javascript:void()',\n          name: 'Careers'\n        },\n\n        {\n          href: 'javascript:void()',\n          name: 'p'\n        }\n      ]\n    }\n  },\n}\n</script>"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}","label":"style.css"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n    { href: 'javascript:void(0)', name: 'About' },\n    { href: 'javascript:void(0)', name: 'Blog' },\n    { href: 'javascript:void(0)', name: '' },\n    { href: 'javascript:void(0)', name: 'Team' },\n    { href: 'javascript:void(0)', name: 'Careers' },\n    { href: 'javascript:void(0)', name: 'Support' }\n  ];\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n  <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" alt=\"Logo\"/>\n    <p class=\"leading-relaxed mt-2 text-[15px]\">\n      Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n    </p>\n  </div>\n  <ul class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n    {#each footerNavs as item, idx}\n      <li class=\"hover:text-gray-800\">\n        <a href={item.href}>\n          {item.name}\n        </a>\n      </li>\n    {/each}\n  </ul>\n  <div class=\"mt-8 items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>"}]},"html":{"htmlTail":[{"code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5  md:px-8\"\n  >\n    <div class=\"max-w-lg sm:mx-auto sm:text-center\">\n      <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n      <p class=\"leading-relaxed mt-2 text-[15px]\">\n        Lorem Ipsum has been the industry's standard dummy text ever since\n        the 1500s, when an unknown printer took a galley of type and\n        scrambled it to make a type specimen book.\n      </p>\n    </div>\n    <ul\n      class=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\"\n    >\n      <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n        <li class=\"hover:text-gray-800\">\n          <a :href=\"item.href\" x-text=\"item.name\"></a>\n        </li>\n      </template>\n    </ul>\n    <div class=\"mt-8 items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</div>\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n<script>\n  function footerComponent() {\n    return {\n      footerNavs: [\n        {\n          href: \"javascript:void()\",\n          name: \"About\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Blog\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Team\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Careers\",\n        },\n        {\n          href: \"javascript:void()\",\n          name: \"Support\",\n        },\n      ],\n    };\n  }\n</script>","label":"index.html"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'p'\n        }\n    ]\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'p'\n        }\n    ]\n    return (\n        <footer className=\"footer-primary\">\n            <div className=\"footer-header\">\n                <img src=\"https://www.floatui.com/logo.svg\" />\n                <p>\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-list\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\"item\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-primary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-primary .footer-header {\n  max-width: 32rem;\n}\n.footer-primary .footer-header img {\n  width: 8rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .footer-header, .footer-primary .footer-header img {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .footer-primary .footer-header p {\n    text-align: center;\n  }\n}\n.footer-primary .footer-header p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-primary .items-list {\n  margin-top: 2rem;\n}\n.footer-primary .items-list > * + * {\n  margin-top: 1.25rem;\n}\n@media (min-width: 640px) {\n  .footer-primary .items-list {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n  .footer-primary .items-list > * + * {\n    margin-top: 0px;\n  }\n  .footer-primary .items-list > * + * {\n    margin-left: 1rem;\n  }\n}\n.footer-primary .items-list .item:hover {\n  color: #1f2937;\n}\n.footer-primary .copyright-slmedia {\n  margin-top: 2rem;\n}\n.footer-primary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-primary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-primary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-primary .copyright-slmedia .copyright, .footer-primary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'About'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n        {\n            href: 'javascript:void()',\n            name: ''\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n\n        {\n            href: 'javascript:void()',\n            name: 'p'\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"max-w-lg sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                <p className=\"leading-relaxed mt-2 text-[15px]\">\n                    Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.\n                </p>\n            </div>\n            <ul className=\"items-center justify-center mt-8 space-y-5 sm:flex sm:space-x-4 sm:space-y-0\">\n                {\n                    footerNavs.map((item, idx) => (\n                        <li className=\" hover:text-gray-800\">\n                            <a key={idx} href={item.href}>\n                                { item.name }\n                            </a>\n                        </li>\n                    ))\n                }\n            </ul>\n            <div className=\"mt-8 items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n","label":"App.jsx"}]}}
 slug: /footers
 id: 7d4490b8-e7f8-4997-a8e2-c68b86ce5cab
 created_at: 1
diff --git a/componentsDB/navbars/navbars-d6a3586b937a.mdx b/componentsDB/navbars/navbars-d6a3586b937a.mdx
index 91c2693..459dcc6 100644
--- a/componentsDB/navbars/navbars-d6a3586b937a.mdx
+++ b/componentsDB/navbars/navbars-d6a3586b937a.mdx
@@ -3,7 +3,7 @@ title: Navbar with advenced dropdown
 category: Application
 paid: true
 isActive: true
-ltr: {"vue":{"vueTail":[],"vueCss":[]},"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"import { useEffect, useState } from 'react'\n\nconst dropdownNavs = [\n    {\n        label: \"Products\", navs: [\n            {\n                title: \"Analytics\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\" className=\"w-6 h-6\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941\" />\n                </svg>\n                ,\n            },\n            {\n                title: \"Reports\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75zM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 01-1.875-1.875V8.625zM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 013 19.875v-6.75z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Resources\", navs: [\n            {\n                title: \"Blog\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M11.25 4.533A9.707 9.707 0 006 3a9.735 9.735 0 00-3.25.555.75.75 0 00-.5.707v14.25a.75.75 0 001 .707A8.237 8.237 0 016 18.75c1.995 0 3.823.707 5.25 1.886V4.533zM12.75 20.636A8.214 8.214 0 0118 18.75c.966 0 1.89.166 2.75.47a.75.75 0 001-.708V4.262a.75.75 0 00-.5-.707A9.735 9.735 0 0018 3a9.707 9.707 0 00-5.25 1.533v16.103z\" />\n                </svg>\n\n                ,\n            },\n            {\n                title: \"Community\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M21.721 12.752a9.711 9.711 0 00-.945-5.003 12.754 12.754 0 01-4.339 2.708 18.991 18.991 0 01-.214 4.772 17.165 17.165 0 005.498-2.477zM14.634 15.55a17.324 17.324 0 00.332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 00.332 4.647 17.385 17.385 0 005.268 0zM9.772 17.119a18.963 18.963 0 004.456 0A17.182 17.182 0 0112 21.724a17.18 17.18 0 01-2.228-4.605zM7.777 15.23a18.87 18.87 0 01-.214-4.774 12.753 12.753 0 01-4.34-2.708 9.711 9.711 0 00-.944 5.004 17.165 17.165 0 005.498 2.477zM21.356 14.752a9.765 9.765 0 01-7.478 6.817 18.64 18.64 0 001.988-4.718 18.627 18.627 0 005.49-2.098zM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 001.988 4.718 9.765 9.765 0 01-7.478-6.816zM13.878 2.43a9.755 9.755 0 016.116 3.986 11.267 11.267 0 01-3.746 2.504 18.63 18.63 0 00-2.37-6.49zM12 2.276a17.152 17.152 0 012.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0112 2.276zM10.122 2.43a18.629 18.629 0 00-2.37 6.49 11.266 11.266 0 01-3.746-2.504 9.754 9.754 0 016.116-3.985z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Company\", navs: [\n            {\n                title: \"About us\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm11.378-3.917c-.89-.777-2.366-.777-3.255 0a.75.75 0 01-.988-1.129c1.454-1.272 3.776-1.272 5.23 0 1.513 1.324 1.513 3.518 0 4.842a3.75 3.75 0 01-.837.552c-.676.328-1.028.774-1.028 1.152v.75a.75.75 0 01-1.5 0v-.75c0-1.279 1.06-2.107 1.875-2.502.182-.088.351-.199.503-.331.83-.727.83-1.857 0-2.584zM12 18a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                </svg>\n\n\n                ,\n            },\n            {\n                title: \"Careers\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M7.5 5.25a3 3 0 013-3h3a3 3 0 013 3v.205c.933.085 1.857.197 2.774.334 1.454.218 2.476 1.483 2.476 2.917v3.033c0 1.211-.734 2.352-1.936 2.752A24.726 24.726 0 0112 15.75c-2.73 0-5.357-.442-7.814-1.259-1.202-.4-1.936-1.541-1.936-2.752V8.706c0-1.434 1.022-2.7 2.476-2.917A48.814 48.814 0 017.5 5.455V5.25zm7.5 0v.09a49.488 49.488 0 00-6 0v-.09a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5zm-3 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                    <path d=\"M3 18.4v-2.796a4.3 4.3 0 00.713.31A26.226 26.226 0 0012 17.25c2.892 0 5.68-.468 8.287-1.335.252-.084.49-.189.713-.311V18.4c0 1.452-1.047 2.728-2.523 2.923-2.12.282-4.282.427-6.477.427a49.19 49.19 0 01-6.477-.427C4.047 21.128 3 19.852 3 18.4z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }\n]\n\nexport default () => {\n\n    const [state, setState] = useState(false)\n    const [drapdownState, setDrapdownState] = useState({ isActive: false, idx: null })\n\n    // Replace javascript:void(0) paths with your paths\n    const navigation = [\n        { title: \"Features\", path: \"javascript:void(0)\", isDrapdown: true, navs: dropdownNavs },\n        { title: \"Integrations\", path: \"javascript:void(0)\", isDrapdown: false },\n        { title: \"Customers\", path: \"javascript:void(0)\", isDrapdown: false },\n        { title: \"Pricing\", path: \"javascript:void(0)\", isDrapdown: false }\n    ]\n\n    useEffect(() => {\n        document.onclick = (e) => {\n            const target = e.target;\n            if (!target.closest(\".nav-menu\")) setDrapdownState({ isActive: false, idx: null });\n        };\n    }, [])\n\n    return (\n        <>\n            <nav className={`relative z-20 bg-white w-full md:static md:text-sm md:border-none ${state ? \"shadow-lg rounded-b-xl md:shadow-none\" : \"\"}`}>\n                <div className=\"items-center gap-x-14 px-4 max-w-screen-xl mx-auto md:flex md:px-8\">\n                    <div className=\"flex items-center justify-between py-3 md:py-5 md:block\">\n                        <a href=\"javascript:void(0)\">\n                            <img\n                                src=\"https://www.floatui.com/logo.svg\"\n                                width={120}\n                                height={50}\n                                alt=\"Float UI logo\"\n                            />\n                        </a>\n                        <div className=\"md:hidden\">\n                            <button className=\"text-gray-500 hover:text-gray-800\"\n                                onClick={() => setState(!state)}\n                            >\n                                {\n                                    state ? (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-6 w-6\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                                            <path fillRule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clipRule=\"evenodd\" />\n                                        </svg>\n                                    ) : (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                                            <path fillRule=\"evenodd\" d=\"M3 6.75A.75.75 0 013.75 6h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 6.75zM3 12a.75.75 0 01.75-.75h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 12zm8.25 5.25a.75.75 0 01.75-.75h8.25a.75.75 0 010 1.5H12a.75.75 0 01-.75-.75z\" clipRule=\"evenodd\" />\n                                        </svg>\n\n                                    )\n                                }\n                            </button>\n                        </div>\n                    </div>\n                    <div className={`nav-menu flex-1 pb-3 mt-8 md:block md:pb-0 md:mt-0 ${state ? 'block' : 'hidden'}`}>\n                        <ul className=\"items-center space-y-6 md:flex md:space-x-6 md:space-y-0\">\n                            {\n                                navigation.map((item, idx) => {\n                                    return (\n                                        <li key={idx}>\n                                            {\n                                                item.isDrapdown ? (\n                                                    <button className=\"w-full flex items-center justify-between gap-1 text-gray-700 hover:text-indigo-600\"\n                                                        onClick={() => setDrapdownState({ idx, isActive: !drapdownState.isActive })}\n                                                    >\n                                                        {item.title}\n                                                        {\n                                                            drapdownState.idx == idx && drapdownState.isActive ? (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M14.77 12.79a.75.75 0 01-1.06-.02L10 8.832 6.29 12.77a.75.75 0 11-1.08-1.04l4.25-4.5a.75.75 0 011.08 0l4.25 4.5a.75.75 0 01-.02 1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n\n                                                            ) : (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n                                                            )\n                                                        }\n                                                    </button>\n                                                ) : (\n                                                    <a href={item.path} className=\"block text-gray-700 hover:text-indigo-600\">\n                                                        {item.title}\n                                                    </a>\n                                                )\n                                            }\n                                            {\n                                                item.isDrapdown && drapdownState.idx == idx && drapdownState.isActive ? (\n                                                    <div className=\"mt-6 inset-x-0 top-20 w-full md:absolute md:border-y md:shadow-md md:mt-0\">\n                                                        <ul className='max-w-screen-xl mx-auto grid items-center gap-6 md:p-8 md:grid-cols-2 lg:grid-cols-3'>\n                                                            {item?.navs.map((dropdownItem, idx) => (\n                                                                <li key={idx}>\n                                                                    <p className=\"text-indigo-600 text-sm\">{dropdownItem.label}</p>\n                                                                    <ul className='mt-5 space-y-6'>\n                                                                        {dropdownItem.navs.map((navItem, idx) => (\n                                                                            <li key={idx} className=\"group\">\n                                                                                <a href={navItem.path} className='flex gap-3 items-center'>\n                                                                                    <div className='w-12 h-12 rounded-full bg-indigo-50 text-indigo-600 flex items-center justify-center duration-150 group-hover:bg-indigo-600 group-hover:text-white md:w-14 md:h-14'>\n                                                                                        {navItem.icon}\n                                                                                    </div>\n                                                                                    <div>\n                                                                                        <span className=\"text-gray-800 duration-200 group-hover:text-indigo-600 text-sm font-medium md:text-base\">{navItem.title}</span>\n                                                                                        <p className='text-sm text-gray-600 group-hover:text-gray-800 mt-1'>{navItem.desc}</p>\n                                                                                    </div>\n                                                                                </a>\n                                                                            </li>\n                                                                        ))}\n                                                                    </ul>\n                                                                </li>\n                                                            ))}\n                                                        </ul>\n                                                    </div>\n                                                ) : \"\"\n                                            }\n                                        </li>\n                                    )\n                                })\n                            }\n                            <div className='flex-1 items-center justify-end gap-x-6 space-y-3 md:flex md:space-y-0'>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 text-center text-gray-700 hover:text-indigo-600 border rounded-lg md:border-none\">\n                                        Log in\n                                    </a>\n                                </li>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 px-4 font-medium text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow md:inline\">\n                                        Sign in\n                                    </a>\n                                </li>\n                            </div>\n                        </ul>\n                    </div>\n                </div>\n            </nav>\n            {\n                state ? (\n                    <div\n                        className=\"z-10 fixed top-0 w-screen h-screen bg-black/20 backdrop-blur-sm md:hidden\"\n                        onClick={() => setState(false)}></div>\n                ) : \"\"\n            }\n        </>\n    )\n}"}]},"preview":"function App() {\n\n  const dropdownNavs = [\n    {\n        label: \"Products\", navs: [\n            {\n                title: \"Analytics\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\" className=\"w-6 h-6\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941\" />\n                </svg>\n                ,\n            },\n            {\n                title: \"Reports\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75zM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 01-1.875-1.875V8.625zM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 013 19.875v-6.75z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Resources\", navs: [\n            {\n                title: \"Blog\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M11.25 4.533A9.707 9.707 0 006 3a9.735 9.735 0 00-3.25.555.75.75 0 00-.5.707v14.25a.75.75 0 001 .707A8.237 8.237 0 016 18.75c1.995 0 3.823.707 5.25 1.886V4.533zM12.75 20.636A8.214 8.214 0 0118 18.75c.966 0 1.89.166 2.75.47a.75.75 0 001-.708V4.262a.75.75 0 00-.5-.707A9.735 9.735 0 0018 3a9.707 9.707 0 00-5.25 1.533v16.103z\" />\n                </svg>\n\n                ,\n            },\n            {\n                title: \"Community\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M21.721 12.752a9.711 9.711 0 00-.945-5.003 12.754 12.754 0 01-4.339 2.708 18.991 18.991 0 01-.214 4.772 17.165 17.165 0 005.498-2.477zM14.634 15.55a17.324 17.324 0 00.332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 00.332 4.647 17.385 17.385 0 005.268 0zM9.772 17.119a18.963 18.963 0 004.456 0A17.182 17.182 0 0112 21.724a17.18 17.18 0 01-2.228-4.605zM7.777 15.23a18.87 18.87 0 01-.214-4.774 12.753 12.753 0 01-4.34-2.708 9.711 9.711 0 00-.944 5.004 17.165 17.165 0 005.498 2.477zM21.356 14.752a9.765 9.765 0 01-7.478 6.817 18.64 18.64 0 001.988-4.718 18.627 18.627 0 005.49-2.098zM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 001.988 4.718 9.765 9.765 0 01-7.478-6.816zM13.878 2.43a9.755 9.755 0 016.116 3.986 11.267 11.267 0 01-3.746 2.504 18.63 18.63 0 00-2.37-6.49zM12 2.276a17.152 17.152 0 012.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0112 2.276zM10.122 2.43a18.629 18.629 0 00-2.37 6.49 11.266 11.266 0 01-3.746-2.504 9.754 9.754 0 016.116-3.985z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Company\", navs: [\n            {\n                title: \"About us\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm11.378-3.917c-.89-.777-2.366-.777-3.255 0a.75.75 0 01-.988-1.129c1.454-1.272 3.776-1.272 5.23 0 1.513 1.324 1.513 3.518 0 4.842a3.75 3.75 0 01-.837.552c-.676.328-1.028.774-1.028 1.152v.75a.75.75 0 01-1.5 0v-.75c0-1.279 1.06-2.107 1.875-2.502.182-.088.351-.199.503-.331.83-.727.83-1.857 0-2.584zM12 18a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                </svg>\n\n\n                ,\n            },\n            {\n                title: \"Careers\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M7.5 5.25a3 3 0 013-3h3a3 3 0 013 3v.205c.933.085 1.857.197 2.774.334 1.454.218 2.476 1.483 2.476 2.917v3.033c0 1.211-.734 2.352-1.936 2.752A24.726 24.726 0 0112 15.75c-2.73 0-5.357-.442-7.814-1.259-1.202-.4-1.936-1.541-1.936-2.752V8.706c0-1.434 1.022-2.7 2.476-2.917A48.814 48.814 0 017.5 5.455V5.25zm7.5 0v.09a49.488 49.488 0 00-6 0v-.09a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5zm-3 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                    <path d=\"M3 18.4v-2.796a4.3 4.3 0 00.713.31A26.226 26.226 0 0012 17.25c2.892 0 5.68-.468 8.287-1.335.252-.084.49-.189.713-.311V18.4c0 1.452-1.047 2.728-2.523 2.923-2.12.282-4.282.427-6.477.427a49.19 49.19 0 01-6.477-.427C4.047 21.128 3 19.852 3 18.4z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }\n]\n\n    const [state, setState] = useState(false)\n    const [drapdownState, setDrapdownState] = useState({ isActive: false, idx: null })\n\n    // Replace javascript:void(0) paths with your paths\n    const navigation = [\n        { title: \"Features\", path: \"javascript:void(0)\", isDrapdown: true, navs: dropdownNavs },\n        { title: \"Integrations\", path: \"javascript:void(0)\", isDrapdown: false },\n        { title: \"Customers\", path: \"javascript:void(0)\", isDrapdown: false },\n        { title: \"Pricing\", path: \"javascript:void(0)\", isDrapdown: false }\n    ]\n\n    useEffect(() => {\n        document.onclick = (e) => {\n            const target = e.target;\n            if (!target.closest(\".nav-menu\")) setDrapdownState({ isActive: false, idx: null });\n        };\n    }, [])\n\n    return (\n        <div style={{height: \"480px\"}}>\n            <nav className={`relative z-20 bg-white w-full md:static md:text-sm md:border-none ${state ? \"shadow-lg rounded-b-xl md:shadow-none\" : \"\"}`}>\n                <div className=\"items-center gap-x-14 px-4 max-w-screen-xl mx-auto md:flex md:px-8\">\n                    <div className=\"flex items-center justify-between py-3 md:py-5 md:block\">\n                        <a href=\"javascript:void(0)\">\n                            <img\n                                src=\"https://www.floatui.com/logo.svg\"\n                                width={120}\n                                height={50}\n                                alt=\"Float UI logo\"\n                            />\n                        </a>\n                        <div className=\"md:hidden\">\n                            <button className=\"text-gray-500 hover:text-gray-800\"\n                                onClick={() => setState(!state)}\n                            >\n                                {\n                                    state ? (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-6 w-6\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                                            <path fillRule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clipRule=\"evenodd\" />\n                                        </svg>\n                                    ) : (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                                            <path fillRule=\"evenodd\" d=\"M3 6.75A.75.75 0 013.75 6h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 6.75zM3 12a.75.75 0 01.75-.75h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 12zm8.25 5.25a.75.75 0 01.75-.75h8.25a.75.75 0 010 1.5H12a.75.75 0 01-.75-.75z\" clipRule=\"evenodd\" />\n                                        </svg>\n\n                                    )\n                                }\n                            </button>\n                        </div>\n                    </div>\n                    <div className={`nav-menu flex-1 pb-3 mt-8 md:block md:pb-0 md:mt-0 ${state ? 'block' : 'hidden'}`}>\n                        <ul className=\"items-center space-y-6 md:flex md:space-x-6 md:space-y-0\">\n                            {\n                                navigation.map((item, idx) => {\n                                    return (\n                                        <li key={idx}>\n                                            {\n                                                item.isDrapdown ? (\n                                                    <button className=\"w-full flex items-center justify-between gap-1 text-gray-700 hover:text-indigo-600\"\n                                                        onClick={() => setDrapdownState({ idx, isActive: !drapdownState.isActive })}\n                                                    >\n                                                        {item.title}\n                                                        {\n                                                            drapdownState.idx == idx && drapdownState.isActive ? (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M14.77 12.79a.75.75 0 01-1.06-.02L10 8.832 6.29 12.77a.75.75 0 11-1.08-1.04l4.25-4.5a.75.75 0 011.08 0l4.25 4.5a.75.75 0 01-.02 1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n\n                                                            ) : (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n                                                            )\n                                                        }\n                                                    </button>\n                                                ) : (\n                                                    <a href={item.path} className=\"block text-gray-700 hover:text-indigo-600\">\n                                                        {item.title}\n                                                    </a>\n                                                )\n                                            }\n                                            {\n                                                item.isDrapdown && drapdownState.idx == idx && drapdownState.isActive ? (\n                                                    <div className=\"mt-6 inset-x-0 top-20 w-full md:absolute md:border-y md:shadow-md md:mt-0\">\n                                                        <ul className='max-w-screen-xl mx-auto grid items-center gap-6 md:p-8 md:grid-cols-2 lg:grid-cols-3'>\n                                                            {item?.navs.map((dropdownItem, idx) => (\n                                                                <li key={idx}>\n                                                                    <p className=\"text-indigo-600 text-sm\">{dropdownItem.label}</p>\n                                                                    <ul className='mt-5 space-y-6'>\n                                                                        {dropdownItem.navs.map((navItem, idx) => (\n                                                                            <li key={idx} className=\"group\">\n                                                                                <a href={navItem.path} className='flex gap-3 items-center'>\n                                                                                    <div className='w-12 h-12 rounded-full bg-indigo-50 text-indigo-600 flex items-center justify-center duration-150 group-hover:bg-indigo-600 group-hover:text-white md:w-14 md:h-14'>\n                                                                                        {navItem.icon}\n                                                                                    </div>\n                                                                                    <div>\n                                                                                        <span className=\"text-gray-800 duration-200 group-hover:text-indigo-600 text-sm font-medium md:text-base\">{navItem.title}</span>\n                                                                                        <p className='text-sm text-gray-600 group-hover:text-gray-800 mt-1'>{navItem.desc}</p>\n                                                                                    </div>\n                                                                                </a>\n                                                                            </li>\n                                                                        ))}\n                                                                    </ul>\n                                                                </li>\n                                                            ))}\n                                                        </ul>\n                                                    </div>\n                                                ) : \"\"\n                                            }\n                                        </li>\n                                    )\n                                })\n                            }\n                            <div className='flex-1 items-center justify-end gap-x-6 space-y-3 md:flex md:space-y-0'>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 text-center text-gray-700 hover:text-indigo-600 border rounded-lg md:border-none\">\n                                        Log in\n                                    </a>\n                                </li>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 px-4 font-medium text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow md:inline\">\n                                        Sign in\n                                    </a>\n                                </li>\n                            </div>\n                        </ul>\n                    </div>\n                </div>\n            </nav>\n            {\n                state ? (\n                    <div\n                        className=\"z-10 fixed top-0 w-screen h-screen bg-black/20 backdrop-blur-sm md:hidden\"\n                        onClick={() => setState(false)}></div>\n                ) : \"\"\n            }\n        </div>\n    )\n}","html":{"htmlTail":[]}}
+ltr: {"vue":{"vueTail":[],"vueCss":[]},"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"import { useEffect, useState } from 'react'\n\nconst dropdownNavs = [\n    {\n        label: \"Products\", navs: [\n            {\n                title: \"Analytics\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\" className=\"w-6 h-6\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941\" />\n                </svg>\n                ,\n            },\n            {\n                title: \"Reports\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75zM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 01-1.875-1.875V8.625zM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 013 19.875v-6.75z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Resources\", navs: [\n            {\n                title: \"Blog\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M11.25 4.533A9.707 9.707 0 006 3a9.735 9.735 0 00-3.25.555.75.75 0 00-.5.707v14.25a.75.75 0 001 .707A8.237 8.237 0 016 18.75c1.995 0 3.823.707 5.25 1.886V4.533zM12.75 20.636A8.214 8.214 0 0118 18.75c.966 0 1.89.166 2.75.47a.75.75 0 001-.708V4.262a.75.75 0 00-.5-.707A9.735 9.735 0 0018 3a9.707 9.707 0 00-5.25 1.533v16.103z\" />\n                </svg>\n\n                ,\n            },\n            {\n                title: \"Community\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M21.721 12.752a9.711 9.711 0 00-.945-5.003 12.754 12.754 0 01-4.339 2.708 18.991 18.991 0 01-.214 4.772 17.165 17.165 0 005.498-2.477zM14.634 15.55a17.324 17.324 0 00.332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 00.332 4.647 17.385 17.385 0 005.268 0zM9.772 17.119a18.963 18.963 0 004.456 0A17.182 17.182 0 0112 21.724a17.18 17.18 0 01-2.228-4.605zM7.777 15.23a18.87 18.87 0 01-.214-4.774 12.753 12.753 0 01-4.34-2.708 9.711 9.711 0 00-.944 5.004 17.165 17.165 0 005.498 2.477zM21.356 14.752a9.765 9.765 0 01-7.478 6.817 18.64 18.64 0 001.988-4.718 18.627 18.627 0 005.49-2.098zM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 001.988 4.718 9.765 9.765 0 01-7.478-6.816zM13.878 2.43a9.755 9.755 0 016.116 3.986 11.267 11.267 0 01-3.746 2.504 18.63 18.63 0 00-2.37-6.49zM12 2.276a17.152 17.152 0 012.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0112 2.276zM10.122 2.43a18.629 18.629 0 00-2.37 6.49 11.266 11.266 0 01-3.746-2.504 9.754 9.754 0 016.116-3.985z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Company\", navs: [\n            {\n                title: \"About us\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm11.378-3.917c-.89-.777-2.366-.777-3.255 0a.75.75 0 01-.988-1.129c1.454-1.272 3.776-1.272 5.23 0 1.513 1.324 1.513 3.518 0 4.842a3.75 3.75 0 01-.837.552c-.676.328-1.028.774-1.028 1.152v.75a.75.75 0 01-1.5 0v-.75c0-1.279 1.06-2.107 1.875-2.502.182-.088.351-.199.503-.331.83-.727.83-1.857 0-2.584zM12 18a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                </svg>\n\n\n                ,\n            },\n            {\n                title: \"Careers\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M7.5 5.25a3 3 0 013-3h3a3 3 0 013 3v.205c.933.085 1.857.197 2.774.334 1.454.218 2.476 1.483 2.476 2.917v3.033c0 1.211-.734 2.352-1.936 2.752A24.726 24.726 0 0112 15.75c-2.73 0-5.357-.442-7.814-1.259-1.202-.4-1.936-1.541-1.936-2.752V8.706c0-1.434 1.022-2.7 2.476-2.917A48.814 48.814 0 017.5 5.455V5.25zm7.5 0v.09a49.488 49.488 0 00-6 0v-.09a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5zm-3 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                    <path d=\"M3 18.4v-2.796a4.3 4.3 0 00.713.31A26.226 26.226 0 0012 17.25c2.892 0 5.68-.468 8.287-1.335.252-.084.49-.189.713-.311V18.4c0 1.452-1.047 2.728-2.523 2.923-2.12.282-4.282.427-6.477.427a49.19 49.19 0 01-6.477-.427C4.047 21.128 3 19.852 3 18.4z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }\n]\n\nexport default () => {\n\n    const [state, setState] = useState(false)\n    const [dropdownState, setDropdownState] = useState({ isActive: false, idx: null })\n\n    // Replace javascript:void(0) paths with your paths\n    const navigation = [\n        { title: \"Features\", path: \"javascript:void(0)\", isDropdown: true, navs: dropdownNavs },\n        { title: \"Integrations\", path: \"javascript:void(0)\", isDropdown: false },\n        { title: \"Customers\", path: \"javascript:void(0)\", isDropdown: false },\n        { title: \"Pricing\", path: \"javascript:void(0)\", isDropdown: false }\n    ]\n\n    useEffect(() => {\n        document.onclick = (e) => {\n            const target = e.target;\n            if (!target.closest(\".nav-menu\")) setDropdownState({ isActive: false, idx: null });\n        };\n    }, [])\n\n    return (\n        <>\n            <nav className={`relative z-20 bg-white w-full md:static md:text-sm md:border-none ${state ? \"shadow-lg rounded-b-xl md:shadow-none\" : \"\"}`}>\n                <div className=\"items-center gap-x-14 px-4 max-w-screen-xl mx-auto md:flex md:px-8\">\n                    <div className=\"flex items-center justify-between py-3 md:py-5 md:block\">\n                        <a href=\"javascript:void(0)\">\n                            <img\n                                src=\"https://www.floatui.com/logo.svg\"\n                                width={120}\n                                height={50}\n                                alt=\"Float UI logo\"\n                            />\n                        </a>\n                        <div className=\"md:hidden\">\n                            <button className=\"text-gray-500 hover:text-gray-800\"\n                                onClick={() => setState(!state)}\n                            >\n                                {\n                                    state ? (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-6 w-6\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                                            <path fillRule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clipRule=\"evenodd\" />\n                                        </svg>\n                                    ) : (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                                            <path fillRule=\"evenodd\" d=\"M3 6.75A.75.75 0 013.75 6h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 6.75zM3 12a.75.75 0 01.75-.75h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 12zm8.25 5.25a.75.75 0 01.75-.75h8.25a.75.75 0 010 1.5H12a.75.75 0 01-.75-.75z\" clipRule=\"evenodd\" />\n                                        </svg>\n\n                                    )\n                                }\n                            </button>\n                        </div>\n                    </div>\n                    <div className={`nav-menu flex-1 pb-3 mt-8 md:block md:pb-0 md:mt-0 ${state ? 'block' : 'hidden'}`}>\n                        <ul className=\"items-center space-y-6 md:flex md:space-x-6 md:space-y-0\">\n                            {\n                                navigation.map((item, idx) => {\n                                    return (\n                                        <li key={idx}>\n                                            {\n                                                item.isDropdown ? (\n                                                    <button className=\"w-full flex items-center justify-between gap-1 text-gray-700 hover:text-indigo-600\"\n                                                        onClick={() => setDropdownState({ idx, isActive: !dropdownState.isActive })}\n                                                    >\n                                                        {item.title}\n                                                        {\n                                                            dropdownState.idx == idx && dropdownState.isActive ? (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M14.77 12.79a.75.75 0 01-1.06-.02L10 8.832 6.29 12.77a.75.75 0 11-1.08-1.04l4.25-4.5a.75.75 0 011.08 0l4.25 4.5a.75.75 0 01-.02 1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n\n                                                            ) : (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n                                                            )\n                                                        }\n                                                    </button>\n                                                ) : (\n                                                    <a href={item.path} className=\"block text-gray-700 hover:text-indigo-600\">\n                                                        {item.title}\n                                                    </a>\n                                                )\n                                            }\n                                            {\n                                                item.isDropdown && dropdownState.idx == idx && dropdownState.isActive ? (\n                                                    <div className=\"mt-6 inset-x-0 top-20 w-full md:absolute md:border-y md:shadow-md md:mt-0\">\n                                                        <ul className='max-w-screen-xl mx-auto grid items-center gap-6 md:p-8 md:grid-cols-2 lg:grid-cols-3'>\n                                                            {item?.navs.map((dropdownItem, idx) => (\n                                                                <li key={idx}>\n                                                                    <p className=\"text-indigo-600 text-sm\">{dropdownItem.label}</p>\n                                                                    <ul className='mt-5 space-y-6'>\n                                                                        {dropdownItem.navs.map((navItem, idx) => (\n                                                                            <li key={idx} className=\"group\">\n                                                                                <a href={navItem.path} className='flex gap-3 items-center'>\n                                                                                    <div className='w-12 h-12 rounded-full bg-indigo-50 text-indigo-600 flex items-center justify-center duration-150 group-hover:bg-indigo-600 group-hover:text-white md:w-14 md:h-14'>\n                                                                                        {navItem.icon}\n                                                                                    </div>\n                                                                                    <div>\n                                                                                        <span className=\"text-gray-800 duration-200 group-hover:text-indigo-600 text-sm font-medium md:text-base\">{navItem.title}</span>\n                                                                                        <p className='text-sm text-gray-600 group-hover:text-gray-800 mt-1'>{navItem.desc}</p>\n                                                                                    </div>\n                                                                                </a>\n                                                                            </li>\n                                                                        ))}\n                                                                    </ul>\n                                                                </li>\n                                                            ))}\n                                                        </ul>\n                                                    </div>\n                                                ) : \"\"\n                                            }\n                                        </li>\n                                    )\n                                })\n                            }\n                            <div className='flex-1 items-center justify-end gap-x-6 space-y-3 md:flex md:space-y-0'>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 text-center text-gray-700 hover:text-indigo-600 border rounded-lg md:border-none\">\n                                        Log in\n                                    </a>\n                                </li>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 px-4 font-medium text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow md:inline\">\n                                        Sign in\n                                    </a>\n                                </li>\n                            </div>\n                        </ul>\n                    </div>\n                </div>\n            </nav>\n            {\n                state ? (\n                    <div\n                        className=\"z-10 fixed top-0 w-screen h-screen bg-black/20 backdrop-blur-sm md:hidden\"\n                        onClick={() => setState(false)}></div>\n                ) : \"\"\n            }\n        </>\n    )\n}"}]},"preview":"function App() {\n\n  const dropdownNavs = [\n    {\n        label: \"Products\", navs: [\n            {\n                title: \"Analytics\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\" className=\"w-6 h-6\">\n                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941\" />\n                </svg>\n                ,\n            },\n            {\n                title: \"Reports\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75zM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 01-1.875-1.875V8.625zM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 013 19.875v-6.75z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Resources\", navs: [\n            {\n                title: \"Blog\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M11.25 4.533A9.707 9.707 0 006 3a9.735 9.735 0 00-3.25.555.75.75 0 00-.5.707v14.25a.75.75 0 001 .707A8.237 8.237 0 016 18.75c1.995 0 3.823.707 5.25 1.886V4.533zM12.75 20.636A8.214 8.214 0 0118 18.75c.966 0 1.89.166 2.75.47a.75.75 0 001-.708V4.262a.75.75 0 00-.5-.707A9.735 9.735 0 0018 3a9.707 9.707 0 00-5.25 1.533v16.103z\" />\n                </svg>\n\n                ,\n            },\n            {\n                title: \"Community\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path d=\"M21.721 12.752a9.711 9.711 0 00-.945-5.003 12.754 12.754 0 01-4.339 2.708 18.991 18.991 0 01-.214 4.772 17.165 17.165 0 005.498-2.477zM14.634 15.55a17.324 17.324 0 00.332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 00.332 4.647 17.385 17.385 0 005.268 0zM9.772 17.119a18.963 18.963 0 004.456 0A17.182 17.182 0 0112 21.724a17.18 17.18 0 01-2.228-4.605zM7.777 15.23a18.87 18.87 0 01-.214-4.774 12.753 12.753 0 01-4.34-2.708 9.711 9.711 0 00-.944 5.004 17.165 17.165 0 005.498 2.477zM21.356 14.752a9.765 9.765 0 01-7.478 6.817 18.64 18.64 0 001.988-4.718 18.627 18.627 0 005.49-2.098zM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 001.988 4.718 9.765 9.765 0 01-7.478-6.816zM13.878 2.43a9.755 9.755 0 016.116 3.986 11.267 11.267 0 01-3.746 2.504 18.63 18.63 0 00-2.37-6.49zM12 2.276a17.152 17.152 0 012.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0112 2.276zM10.122 2.43a18.629 18.629 0 00-2.37 6.49 11.266 11.266 0 01-3.746-2.504 9.754 9.754 0 016.116-3.985z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }, {\n        label: \"Company\", navs: [\n            {\n                title: \"About us\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm11.378-3.917c-.89-.777-2.366-.777-3.255 0a.75.75 0 01-.988-1.129c1.454-1.272 3.776-1.272 5.23 0 1.513 1.324 1.513 3.518 0 4.842a3.75 3.75 0 01-.837.552c-.676.328-1.028.774-1.028 1.152v.75a.75.75 0 01-1.5 0v-.75c0-1.279 1.06-2.107 1.875-2.502.182-.088.351-.199.503-.331.83-.727.83-1.857 0-2.584zM12 18a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                </svg>\n\n\n                ,\n            },\n            {\n                title: \"Careers\",\n                desc: \"Duis aute irure dolor in reprehenderit\",\n                path: \"javascript:void(0)\",\n                icon: <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                    <path fillRule=\"evenodd\" d=\"M7.5 5.25a3 3 0 013-3h3a3 3 0 013 3v.205c.933.085 1.857.197 2.774.334 1.454.218 2.476 1.483 2.476 2.917v3.033c0 1.211-.734 2.352-1.936 2.752A24.726 24.726 0 0112 15.75c-2.73 0-5.357-.442-7.814-1.259-1.202-.4-1.936-1.541-1.936-2.752V8.706c0-1.434 1.022-2.7 2.476-2.917A48.814 48.814 0 017.5 5.455V5.25zm7.5 0v.09a49.488 49.488 0 00-6 0v-.09a1.5 1.5 0 011.5-1.5h3a1.5 1.5 0 011.5 1.5zm-3 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z\" clipRule=\"evenodd\" />\n                    <path d=\"M3 18.4v-2.796a4.3 4.3 0 00.713.31A26.226 26.226 0 0012 17.25c2.892 0 5.68-.468 8.287-1.335.252-.084.49-.189.713-.311V18.4c0 1.452-1.047 2.728-2.523 2.923-2.12.282-4.282.427-6.477.427a49.19 49.19 0 01-6.477-.427C4.047 21.128 3 19.852 3 18.4z\" />\n                </svg>\n\n                ,\n            },\n        ]\n    }\n]\n\n    const [state, setState] = useState(false)\n    const [dropdownState, setDropdownState] = useState({ isActive: false, idx: null })\n\n    // Replace javascript:void(0) paths with your paths\n    const navigation = [\n        { title: \"Features\", path: \"javascript:void(0)\", isDropdown: true, navs: dropdownNavs },\n        { title: \"Integrations\", path: \"javascript:void(0)\", isDropdown: false },\n        { title: \"Customers\", path: \"javascript:void(0)\", isDropdown: false },\n        { title: \"Pricing\", path: \"javascript:void(0)\", isDropdown: false }\n    ]\n\n    useEffect(() => {\n        document.onclick = (e) => {\n            const target = e.target;\n            if (!target.closest(\".nav-menu\")) setDropdownState({ isActive: false, idx: null });\n        };\n    }, [])\n\n    return (\n        <div style={{height: \"480px\"}}>\n            <nav className={`relative z-20 bg-white w-full md:static md:text-sm md:border-none ${state ? \"shadow-lg rounded-b-xl md:shadow-none\" : \"\"}`}>\n                <div className=\"items-center gap-x-14 px-4 max-w-screen-xl mx-auto md:flex md:px-8\">\n                    <div className=\"flex items-center justify-between py-3 md:py-5 md:block\">\n                        <a href=\"javascript:void(0)\">\n                            <img\n                                src=\"https://www.floatui.com/logo.svg\"\n                                width={120}\n                                height={50}\n                                alt=\"Float UI logo\"\n                            />\n                        </a>\n                        <div className=\"md:hidden\">\n                            <button className=\"text-gray-500 hover:text-gray-800\"\n                                onClick={() => setState(!state)}\n                            >\n                                {\n                                    state ? (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" className=\"h-6 w-6\" viewBox=\"0 0 20 20\" fill=\"currentColor\">\n                                            <path fillRule=\"evenodd\" d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\" clipRule=\"evenodd\" />\n                                        </svg>\n                                    ) : (\n                                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"currentColor\" className=\"w-6 h-6\">\n                                            <path fillRule=\"evenodd\" d=\"M3 6.75A.75.75 0 013.75 6h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 6.75zM3 12a.75.75 0 01.75-.75h16.5a.75.75 0 010 1.5H3.75A.75.75 0 013 12zm8.25 5.25a.75.75 0 01.75-.75h8.25a.75.75 0 010 1.5H12a.75.75 0 01-.75-.75z\" clipRule=\"evenodd\" />\n                                        </svg>\n\n                                    )\n                                }\n                            </button>\n                        </div>\n                    </div>\n                    <div className={`nav-menu flex-1 pb-3 mt-8 md:block md:pb-0 md:mt-0 ${state ? 'block' : 'hidden'}`}>\n                        <ul className=\"items-center space-y-6 md:flex md:space-x-6 md:space-y-0\">\n                            {\n                                navigation.map((item, idx) => {\n                                    return (\n                                        <li key={idx}>\n                                            {\n                                                item.isDropdown ? (\n                                                    <button className=\"w-full flex items-center justify-between gap-1 text-gray-700 hover:text-indigo-600\"\n                                                        onClick={() => setDropdownState({ idx, isActive: !dropdownState.isActive })}\n                                                    >\n                                                        {item.title}\n                                                        {\n                                                            dropdownState.idx == idx && dropdownState.isActive ? (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M14.77 12.79a.75.75 0 01-1.06-.02L10 8.832 6.29 12.77a.75.75 0 11-1.08-1.04l4.25-4.5a.75.75 0 011.08 0l4.25 4.5a.75.75 0 01-.02 1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n\n                                                            ) : (\n                                                                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                                                    <path fillRule=\"evenodd\" d=\"M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z\" clipRule=\"evenodd\" />\n                                                                </svg>\n                                                            )\n                                                        }\n                                                    </button>\n                                                ) : (\n                                                    <a href={item.path} className=\"block text-gray-700 hover:text-indigo-600\">\n                                                        {item.title}\n                                                    </a>\n                                                )\n                                            }\n                                            {\n                                                item.isDropdown && dropdownState.idx == idx && dropdownState.isActive ? (\n                                                    <div className=\"mt-6 inset-x-0 top-20 w-full md:absolute md:border-y md:shadow-md md:mt-0\">\n                                                        <ul className='max-w-screen-xl mx-auto grid items-center gap-6 md:p-8 md:grid-cols-2 lg:grid-cols-3'>\n                                                            {item?.navs.map((dropdownItem, idx) => (\n                                                                <li key={idx}>\n                                                                    <p className=\"text-indigo-600 text-sm\">{dropdownItem.label}</p>\n                                                                    <ul className='mt-5 space-y-6'>\n                                                                        {dropdownItem.navs.map((navItem, idx) => (\n                                                                            <li key={idx} className=\"group\">\n                                                                                <a href={navItem.path} className='flex gap-3 items-center'>\n                                                                                    <div className='w-12 h-12 rounded-full bg-indigo-50 text-indigo-600 flex items-center justify-center duration-150 group-hover:bg-indigo-600 group-hover:text-white md:w-14 md:h-14'>\n                                                                                        {navItem.icon}\n                                                                                    </div>\n                                                                                    <div>\n                                                                                        <span className=\"text-gray-800 duration-200 group-hover:text-indigo-600 text-sm font-medium md:text-base\">{navItem.title}</span>\n                                                                                        <p className='text-sm text-gray-600 group-hover:text-gray-800 mt-1'>{navItem.desc}</p>\n                                                                                    </div>\n                                                                                </a>\n                                                                            </li>\n                                                                        ))}\n                                                                    </ul>\n                                                                </li>\n                                                            ))}\n                                                        </ul>\n                                                    </div>\n                                                ) : \"\"\n                                            }\n                                        </li>\n                                    )\n                                })\n                            }\n                            <div className='flex-1 items-center justify-end gap-x-6 space-y-3 md:flex md:space-y-0'>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 text-center text-gray-700 hover:text-indigo-600 border rounded-lg md:border-none\">\n                                        Log in\n                                    </a>\n                                </li>\n                                <li>\n                                    <a href=\"javascript:void(0)\" className=\"block py-3 px-4 font-medium text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow md:inline\">\n                                        Sign in\n                                    </a>\n                                </li>\n                            </div>\n                        </ul>\n                    </div>\n                </div>\n            </nav>\n            {\n                state ? (\n                    <div\n                        className=\"z-10 fixed top-0 w-screen h-screen bg-black/20 backdrop-blur-sm md:hidden\"\n                        onClick={() => setState(false)}></div>\n                ) : \"\"\n            }\n        </div>\n    )\n}","html":{"htmlTail":[]}}
 slug: /navbars
 id: b3cb9143-95eb-4de8-b15b-d6a3586b937a
 created_at: 1668383759237

From 13e3c8c04150f67d7aef3930f58efea5ea1cdbe4 Mon Sep 17 00:00:00 2001
From: SriCharitaG <cherry.studies19@gmail.com>
Date: Thu, 23 May 2024 00:59:53 +0530
Subject: [PATCH 4/4] removed max-w-screen-xl mx-auto in footer to get the
 footer complete width

---
 componentsDB/footers/footers-0da45f93945f.mdx | 2 +-
 componentsDB/footers/footers-181aeccbae3c.mdx | 2 +-
 componentsDB/footers/footers-3477ba81914f.mdx | 2 +-
 componentsDB/footers/footers-4f697cf07807.mdx | 2 +-
 componentsDB/footers/footers-7adb1d10aa04.mdx | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/componentsDB/footers/footers-0da45f93945f.mdx b/componentsDB/footers/footers-0da45f93945f.mdx
index a2b0e29..1682f36 100644
--- a/componentsDB/footers/footers-0da45f93945f.mdx
+++ b/componentsDB/footers/footers-0da45f93945f.mdx
@@ -3,7 +3,7 @@ title: Dark Footer
 category: Marketing
 paid: false
 isActive: true
-ltr: {"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10 bg-gray-800\">\n            <div className=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-white text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-300\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-200 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"duration-150 hover:text-gray-400\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n                    <p className=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n    let footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ];\n\n    function preventDefault(e) {\n        e.preventDefault();\n    }\n</script>\n\n<footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n        <div class=\"justify-between items-center gap-12 md:flex\">\n            <div class=\"flex-1 max-w-lg\">\n                <h3 class=\"text-white text-2xl font-bold\">\n                    Get our beautiful newsletter straight to your inbox.\n                </h3>\n            </div>\n            <div class=\"flex-1 mt-6 md:mt-0\">\n                <form on:submit={preventDefault} class=\"flex items-center gap-x-3 md:justify-end\">\n                    <div class=\"relative\">\n                  <svg\n                    class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    fill=\"none\"\n                    viewBox=\"0 0 24 24\"\n                    strokeWidth=\"{1.5}\"\n                    stroke=\"currentColor\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                    />\n                  </svg>\n                        <input type=\"email\" required placeholder=\"Enter your email\" class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\" />\n                    </div>\n                    <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                        Subscribe\n                    </button>\n                </form>\n            </div>\n        </div>\n\n        <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n            {#each footerNavs as item, idx}\n                <ul class=\"space-y-4 text-gray-300\">\n                    <h4 class=\"text-gray-200 font-semibold sm:pb-2\">\n                        {item.label}\n                    </h4>\n                    {#each item.items as el}\n                        <li>\n                            <a href={el.href} class=\"duration-150 hover:text-gray-400\">\n                                {el.name}\n                            </a>\n                        </li>\n                    {/each}\n                </ul>\n            {/each}\n        </div>\n        <div class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n            <p class=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n            <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#a)\">\n                    <path\n                      fill=\"currentColor\"\n                      d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"a\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#clip0_17_80)\">\n                    <path\n                      fill=\"currentColor\"\n                      d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_17_80\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                    <path\n                      fill-rule=\"evenodd\"\n                      d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                      clip-rule=\"evenodd\"\n                    />\n                    <path\n                      d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_910_44\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"currentColor\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#clip0_17_63)\">\n                    <path\n                      d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                    />\n                    <path\n                      d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_17_63\">\n                      <path d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n            </div>\n        </div>\n</footer>\n"}]},"html":{"htmlTail":[{"code":"<div\n  x-data=\"{\n  footerNavs: [\n      { label: 'Resources', items: [{ href: 'javascript:void()', name: 'contact' }, { href: 'javascript:void()', name: 'Support' }, { href: 'javascript:void()', name: 'Documentation' }, { href: 'javascript:void()', name: 'Pricing' }] },\n      { label: 'About', items: [{ href: 'javascript:void()', name: 'Terms' }, { href: 'javascript:void()', name: 'License' }, { href: 'javascript:void()', name: 'Privacy' }, { href: 'javascript:void()', name: 'About US' }] },\n      { label: 'Explore', items: [{ href: 'javascript:void()', name: 'Showcase' }, { href: 'javascript:void()', name: 'Roadmap' }, { href: 'javascript:void()', name: 'Languages' }, { href: 'javascript:void()', name: 'Blog' }] },\n      { label: 'Company', items: [{ href: 'javascript:void()', name: 'Partners' }, { href: 'javascript:void()', name: 'Team' }, { href: 'javascript:void()', name: 'Careers' }] }\n  ]\n}\"\n>\n  <footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-white text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form\n            @submit.prevent=\"e => e.preventDefault()\"\n            class=\"flex items-center gap-x-3 md:justify-end\"\n          >\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button\n              class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\"\n            >\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div\n        class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4 text-gray-300\">\n            <h4\n              class=\"text-gray-200 font-semibold sm:pb-2\"\n              x-text=\"item.label\"\n            ></h4>\n            <template x-for=\"(el, idx) in item.items\" :key=\"idx\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"duration-150 hover:text-gray-400\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n      <div\n        class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\"\n      >\n        <p class=\"text-gray-300\">\n          © 2022 Float UI Inc. All rights reserved.\n        </p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#a)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"a\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_80)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_80\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                <path\n                  fill-rule=\"evenodd\"\n                  d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                  clip-rule=\"evenodd\"\n                />\n                <path\n                  d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_910_44\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"currentColor\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_63)\">\n                <path\n                  d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                />\n                <path\n                  d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_63\">\n                  <path d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</div>","label":"index.html"}]},"react":{"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10 bg-gray-800\">\n            <div className=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-white text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-300\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-200 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"duration-150 hover:text-gray-400\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n                    <p className=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","label":"App.jsx"}],"jsxCss":[]},"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-white text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form @submit.prevent=\"onSubmit\" class=\"flex items-center gap-x-3 md:justify-end\">\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n        <ul v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"space-y-4 text-gray-300\">\n          <h4 class=\"text-gray-200 font-semibold sm:pb-2\">{{ item.label }}</h4>\n          <li v-for=\"(el, index) in item.items\" :key=\"index\">\n            <a :href=\"el.href\" class=\"duration-150 hover:text-gray-400\">{{ el.name }}</a>\n          </li>\n        </ul>\n      </div>\n      <div class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n        <p class=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#a)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"a\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_80)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_80\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                <path\n                  fill-rule=\"evenodd\"\n                  d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                  clip-rule=\"evenodd\"\n                />\n                <path\n                  d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_910_44\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"currentColor\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_63)\">\n                <path\n                  d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                />\n                <path\n                  d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_63\">\n                  <path d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n      ]\n    };\n  },\n};\n</script>","label":"App.vue"}],"vueCss":[]}}
+ltr: {"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10 bg-gray-800\">\n            <div className=\" px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-white text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-300\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-200 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"duration-150 hover:text-gray-400\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n                    <p className=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n    let footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ];\n\n    function preventDefault(e) {\n        e.preventDefault();\n    }\n</script>\n\n<footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n        <div class=\"justify-between items-center gap-12 md:flex\">\n            <div class=\"flex-1 max-w-lg\">\n                <h3 class=\"text-white text-2xl font-bold\">\n                    Get our beautiful newsletter straight to your inbox.\n                </h3>\n            </div>\n            <div class=\"flex-1 mt-6 md:mt-0\">\n                <form on:submit={preventDefault} class=\"flex items-center gap-x-3 md:justify-end\">\n                    <div class=\"relative\">\n                  <svg\n                    class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    fill=\"none\"\n                    viewBox=\"0 0 24 24\"\n                    strokeWidth=\"{1.5}\"\n                    stroke=\"currentColor\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                    />\n                  </svg>\n                        <input type=\"email\" required placeholder=\"Enter your email\" class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\" />\n                    </div>\n                    <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                        Subscribe\n                    </button>\n                </form>\n            </div>\n        </div>\n\n        <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n            {#each footerNavs as item, idx}\n                <ul class=\"space-y-4 text-gray-300\">\n                    <h4 class=\"text-gray-200 font-semibold sm:pb-2\">\n                        {item.label}\n                    </h4>\n                    {#each item.items as el}\n                        <li>\n                            <a href={el.href} class=\"duration-150 hover:text-gray-400\">\n                                {el.name}\n                            </a>\n                        </li>\n                    {/each}\n                </ul>\n            {/each}\n        </div>\n        <div class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n            <p class=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n            <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#a)\">\n                    <path\n                      fill=\"currentColor\"\n                      d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"a\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#clip0_17_80)\">\n                    <path\n                      fill=\"currentColor\"\n                      d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_17_80\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"none\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                    <path\n                      fill-rule=\"evenodd\"\n                      d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                      clip-rule=\"evenodd\"\n                    />\n                    <path\n                      d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_910_44\">\n                      <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n              <a href=\"javascript:void()\">\n                <svg\n                  class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n                  fill=\"currentColor\"\n                  viewBox=\"0 0 48 48\"\n                >\n                  <g clip-path=\"url(#clip0_17_63)\">\n                    <path\n                      d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                    />\n                    <path\n                      d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                    />\n                  </g>\n                  <defs>\n                    <clipPath id=\"clip0_17_63\">\n                      <path d=\"M0 0h48v48H0z\" />\n                    </clipPath>\n                  </defs>\n                </svg>\n              </a>\n            </div>\n        </div>\n</footer>\n"}]},"html":{"htmlTail":[{"code":"<div\n  x-data=\"{\n  footerNavs: [\n      { label: 'Resources', items: [{ href: 'javascript:void()', name: 'contact' }, { href: 'javascript:void()', name: 'Support' }, { href: 'javascript:void()', name: 'Documentation' }, { href: 'javascript:void()', name: 'Pricing' }] },\n      { label: 'About', items: [{ href: 'javascript:void()', name: 'Terms' }, { href: 'javascript:void()', name: 'License' }, { href: 'javascript:void()', name: 'Privacy' }, { href: 'javascript:void()', name: 'About US' }] },\n      { label: 'Explore', items: [{ href: 'javascript:void()', name: 'Showcase' }, { href: 'javascript:void()', name: 'Roadmap' }, { href: 'javascript:void()', name: 'Languages' }, { href: 'javascript:void()', name: 'Blog' }] },\n      { label: 'Company', items: [{ href: 'javascript:void()', name: 'Partners' }, { href: 'javascript:void()', name: 'Team' }, { href: 'javascript:void()', name: 'Careers' }] }\n  ]\n}\"\n>\n  <footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-white text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form\n            @submit.prevent=\"e => e.preventDefault()\"\n            class=\"flex items-center gap-x-3 md:justify-end\"\n          >\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button\n              class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\"\n            >\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div\n        class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4 text-gray-300\">\n            <h4\n              class=\"text-gray-200 font-semibold sm:pb-2\"\n              x-text=\"item.label\"\n            ></h4>\n            <template x-for=\"(el, idx) in item.items\" :key=\"idx\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"duration-150 hover:text-gray-400\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n      <div\n        class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\"\n      >\n        <p class=\"text-gray-300\">\n          © 2022 Float UI Inc. All rights reserved.\n        </p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#a)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"a\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_80)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_80\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                <path\n                  fill-rule=\"evenodd\"\n                  d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                  clip-rule=\"evenodd\"\n                />\n                <path\n                  d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_910_44\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"currentColor\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_63)\">\n                <path\n                  d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                />\n                <path\n                  d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_63\">\n                  <path d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</div>","label":"index.html"}]},"react":{"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10 bg-gray-800\">\n            <div className=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-white text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-300\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-200 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"duration-150 hover:text-gray-400\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n                    <p className=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","label":"App.jsx"}],"jsxCss":[]},"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"pt-10 bg-gray-800\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-white text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form @submit.prevent=\"onSubmit\" class=\"flex items-center gap-x-3 md:justify-end\">\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n        <ul v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"space-y-4 text-gray-300\">\n          <h4 class=\"text-gray-200 font-semibold sm:pb-2\">{{ item.label }}</h4>\n          <li v-for=\"(el, index) in item.items\" :key=\"index\">\n            <a :href=\"el.href\" class=\"duration-150 hover:text-gray-400\">{{ el.name }}</a>\n          </li>\n        </ul>\n      </div>\n      <div class=\"mt-10 py-10 border-t border-gray-700 items-center justify-between sm:flex\">\n        <p class=\"text-gray-300\">© 2022 Float UI Inc. All rights reserved.</p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#a)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"a\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_80)\">\n                <path\n                  fill=\"currentColor\"\n                  d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_80\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"none\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\">\n                <path\n                  fill-rule=\"evenodd\"\n                  d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\"\n                  clip-rule=\"evenodd\"\n                />\n                <path\n                  d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_910_44\">\n                  <path fill=\"#fff\" d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"w-6 h-6 hover:text-gray-500 duration-150\"\n              fill=\"currentColor\"\n              viewBox=\"0 0 48 48\"\n            >\n              <g clip-path=\"url(#clip0_17_63)\">\n                <path\n                  d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\"\n                />\n                <path\n                  d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\"\n                />\n              </g>\n              <defs>\n                <clipPath id=\"clip0_17_63\">\n                  <path d=\"M0 0h48v48H0z\" />\n                </clipPath>\n              </defs>\n            </svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n      ]\n    };\n  },\n};\n</script>","label":"App.vue"}],"vueCss":[]}}
 slug: /footers
 id: 53796d66-3ed3-4669-bc5e-0da45f93945f
 created_at: 1670156038670
diff --git a/componentsDB/footers/footers-181aeccbae3c.mdx b/componentsDB/footers/footers-181aeccbae3c.mdx
index 66b0c0e..84617bf 100644
--- a/componentsDB/footers/footers-181aeccbae3c.mdx
+++ b/componentsDB/footers/footers-181aeccbae3c.mdx
@@ -3,7 +3,7 @@ title: Footer with Download links
 category: Marketing
 paid: false
 isActive: true
-ltr: {"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n                <div className=\"justify-between sm:flex\">\n                    <div className=\"space-y-6\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"max-w-md\">\n                            Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                        </p>\n                        <ul className=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                            {\n                                footerNavs.map((item, idx) => (\n                                    <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                        <a key={idx} href={item.href}>\n                                            {item.name}\n                                        </a>\n                                    </li>\n                                ))\n                            }\n                        </ul>\n                    </div>\n                    <div className=\"mt-6\">\n                        <p className=\"text-gray-700 font-semibold\">Get the app</p>\n                        <div className=\"flex items-center gap-3 mt-3 sm:block\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                            </a>\n                            <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                            </a>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t md:text-center\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                </div>\n            </div>\n        </footer>\n    )\n}"}]},"svelte":{"svelteTail":[{"code":"<script>\n    let footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ];\n</script>\n\n<footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n        <div class=\"justify-between sm:flex\">\n            <div class=\"space-y-6\">\n                <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" alt=\"Float UI Logo\" />\n                <p class=\"max-w-md\">\n                    Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                </p>\n                <ul class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                    {#each footerNavs as item, idx}\n                        <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                            <a href={item.href}>\n                                {item.name}\n                            </a>\n                        </li>\n                    {/each}\n                </ul>\n            </div>\n            <div class=\"mt-6\">\n                <p class=\"text-gray-700 font-semibold\">Get the app</p>\n                <div class=\"flex items-center gap-3 mt-3 sm:block\">\n                  <a href=\"javascript:void()\">\n                      <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                  </a>\n                  <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                      <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                  </a>\n                </div>\n            </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t md:text-center\">\n            <p>© 2022 Float UI Inc. All rights reserved.</p>\n        </div>\n    </div>\n</footer>\n","label":"App.svelte"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n                <div className=\"justify-between sm:flex\">\n                    <div className=\"space-y-6\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"max-w-md\">\n                            Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                        </p>\n                        <ul className=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                            {\n                                footerNavs.map((item, idx) => (\n                                    <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                        <a key={idx} href={item.href}>\n                                            {item.name}\n                                        </a>\n                                    </li>\n                                ))\n                            }\n                        </ul>\n                    </div>\n                    <div className=\"mt-6\">\n                        <p className=\"text-gray-700 font-semibold\">Get the app</p>\n                        <div className=\"flex items-center gap-3 mt-3 sm:block\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                            </a>\n                            <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                            </a>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t md:text-center\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                </div>\n            </div>\n        </footer>\n    )\n}","vue":{"vueTail":[{"code":"<template>\n    <footer class=\"pt-10\">\n        <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n            <div class=\"justify-between sm:flex\">\n                <div class=\"space-y-6\">\n                    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n                    <p class=\"max-w-md\">\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <ul class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                        <li \n                            v-for=\"(item, idx) in footerNavs\" \n                            :key=\"idx\"\n                            class=\"text-gray-800 hover:text-gray-500 duration-150\"\n                        >\n                            <a :href=\"item.href\">\n                                {{ item.name }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n                <div class=\"mt-6\">\n                    <p class=\"text-gray-700 font-semibold\">Get the app</p>\n                    <div class=\"flex items-center gap-3 mt-3 sm:block\">\n                      <a href=\"javascript:void()\">\n                          <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                      </a>\n                      <a href=\"javascript:void()\" class=\"mt-0 block sm:mt-3\">\n                          <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                      </a>\n                    </div>\n                </div>\n            </div>\n            <div class=\"mt-10 py-10 border-t md:text-center\">\n                <p>© 2022 Float UI Inc. All rights reserved.</p>\n            </div>\n        </div>\n    </footer>\n</template>\n\n<script>\nexport default {\n    data() {\n        return {\n            footerNavs: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About us'\n                }\n            ]\n        };\n    }\n}\n</script>","label":"App.vue"}],"vueCss":[]},"html":{"htmlTail":[{"label":"index.html","code":"<div\n  x-data=\"{ \n  footerNavs: [\n      {\n          href: 'javascript:void()',\n          name: 'Terms'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'License'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'Privacy'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'About us'\n      }\n  ]\n}\"\n>\n  <footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n      <div class=\"justify-between sm:flex\">\n        <div class=\"space-y-6\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"max-w-md\">\n            Nulla auctor metus vitae lectus iaculis, vel euismod massa\n            efficitur.\n          </p>\n          <ul\n            class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\"\n          >\n            <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n              <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                <a :href=\"item.href\" x-text=\"item.name\"></a>\n              </li>\n            </template>\n          </ul>\n        </div>\n        <div class=\"mt-6\">\n          <p class=\"text-gray-700 font-semibold\">Get the app</p>\n          <div class=\"flex items-center gap-3 mt-3 sm:block\">\n            <a href=\"javascript:void()\">\n              <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\">\n                <path\n                  fill=\"#000\"\n                  d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\"\n                />\n                <path\n                  fill=\"#A6A6A6\"\n                  d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\"\n                />\n                <path\n                  fill=\"url(#paint0_linear_3_178167)\"\n                  d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\"\n                />\n                <path\n                  fill=\"url(#paint1_linear_3_178167)\"\n                  d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\"\n                />\n                <path\n                  fill=\"url(#paint2_linear_3_178167)\"\n                  d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\"\n                />\n                <path\n                  fill=\"url(#paint3_linear_3_178167)\"\n                  d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\"\n                />\n                <path\n                  fill=\"url(#paint4_linear_3_178167)\"\n                  d=\"M68.327 60.643l.234-.133-.234.133z\"\n                />\n                <path\n                  fill=\"url(#paint5_linear_3_178167)\"\n                  d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\"\n                />\n                <path\n                  fill=\"url(#paint6_linear_3_178167)\"\n                  d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\"\n                />\n                <path\n                  fill=\"url(#paint7_linear_3_178167)\"\n                  d=\"M27.053 81.005l.185-.185-.185.185\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\"\n                />\n                <path\n                  fill=\"url(#paint8_linear_3_178167)\"\n                  d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\"\n                />\n                <path\n                  fill=\"#404040\"\n                  d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\"\n                />\n                <path\n                  fill=\"url(#paint9_linear_3_178167)\"\n                  d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\"\n                />\n                <path\n                  fill=\"#404040\"\n                  d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\"\n                />\n                <path\n                  fill=\"url(#paint10_linear_3_178167)\"\n                  d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\"\n                />\n                <path\n                  fill=\"url(#paint11_linear_3_178167)\"\n                  d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\"\n                />\n                <defs>\n                  <linearGradient\n                    id=\"paint0_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#00A0FF\" />\n                    <stop offset=\".007\" stop-color=\"#00A1FF\" />\n                    <stop offset=\".26\" stop-color=\"#00BEFF\" />\n                    <stop offset=\".512\" stop-color=\"#00D2FF\" />\n                    <stop offset=\".76\" stop-color=\"#00DFFF\" />\n                    <stop offset=\"1\" stop-color=\"#00E3FF\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint1_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FFE000\" />\n                    <stop offset=\".409\" stop-color=\"#FFBD00\" />\n                    <stop offset=\".775\" stop-color=\"orange\" />\n                    <stop offset=\"1\" stop-color=\"#FF9C00\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint2_linear_3_178167\"\n                    x1=\"62.853\"\n                    x2=\"6.24\"\n                    y1=\"55.712\"\n                    y2=\"112.324\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FF3A44\" />\n                    <stop offset=\"1\" stop-color=\"#C31162\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint3_linear_3_178167\"\n                    x1=\"19.246\"\n                    x2=\"44.526\"\n                    y1=\".687\"\n                    y2=\"25.967\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#32A071\" />\n                    <stop offset=\".069\" stop-color=\"#2DA771\" />\n                    <stop offset=\".476\" stop-color=\"#15CF74\" />\n                    <stop offset=\".801\" stop-color=\"#06E775\" />\n                    <stop offset=\"1\" stop-color=\"#00F076\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint4_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.004\"\n                    y2=\"50.004\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#CCB300\" />\n                    <stop offset=\".409\" stop-color=\"#CC9700\" />\n                    <stop offset=\".775\" stop-color=\"#CC8400\" />\n                    <stop offset=\"1\" stop-color=\"#CC7D00\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint5_linear_3_178167\"\n                    x1=\"62.853\"\n                    x2=\"6.24\"\n                    y1=\"55.712\"\n                    y2=\"112.324\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#CC2E36\" />\n                    <stop offset=\"1\" stop-color=\"#9C0E4E\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint6_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#008DE0\" />\n                    <stop offset=\".007\" stop-color=\"#008DE0\" />\n                    <stop offset=\".26\" stop-color=\"#00A7E0\" />\n                    <stop offset=\".512\" stop-color=\"#00B8E0\" />\n                    <stop offset=\".76\" stop-color=\"#00C4E0\" />\n                    <stop offset=\"1\" stop-color=\"#00C7E0\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint7_linear_3_178167\"\n                    x1=\"62.854\"\n                    x2=\"6.242\"\n                    y1=\"55.712\"\n                    y2=\"112.327\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#E0333C\" />\n                    <stop offset=\"1\" stop-color=\"#AB0F56\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint8_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#E0C500\" />\n                    <stop offset=\".409\" stop-color=\"#E0A600\" />\n                    <stop offset=\".775\" stop-color=\"#E09100\" />\n                    <stop offset=\"1\" stop-color=\"#E08900\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint9_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.068\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FFE840\" />\n                    <stop offset=\".409\" stop-color=\"#FFCE40\" />\n                    <stop offset=\".775\" stop-color=\"#FFBC40\" />\n                    <stop offset=\"1\" stop-color=\"#FFB540\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint10_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#40B8FF\" />\n                    <stop offset=\".007\" stop-color=\"#40B9FF\" />\n                    <stop offset=\".26\" stop-color=\"#40CEFF\" />\n                    <stop offset=\".512\" stop-color=\"#40DDFF\" />\n                    <stop offset=\".76\" stop-color=\"#40E7FF\" />\n                    <stop offset=\"1\" stop-color=\"#40EAFF\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint11_linear_3_178167\"\n                    x1=\"19.246\"\n                    x2=\"44.526\"\n                    y1=\".687\"\n                    y2=\"25.967\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#65B895\" />\n                    <stop offset=\".069\" stop-color=\"#62BD95\" />\n                    <stop offset=\".476\" stop-color=\"#50DB97\" />\n                    <stop offset=\".801\" stop-color=\"#44ED98\" />\n                    <stop offset=\"1\" stop-color=\"#40F498\" />\n                  </linearGradient>\n                </defs>\n              </svg>\n            </a>\n            <a href=\"javascript:void()\" class=\"mt-0 block sm:mt-3\">\n              <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\">\n                <g clip-path=\"url(#clip0_3_178097)\">\n                  <path\n                    fill=\"#A6A6A6\"\n                    d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\"\n                  />\n                  <path\n                    fill=\"#000\"\n                    d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\"\n                  />\n                  <path\n                    fill=\"#fff\"\n                    d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\"\n                  />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_3_178097\">\n                    <path\n                      fill=\"#fff\"\n                      d=\"M0 0h299.16v100H0z\"\n                      transform=\"translate(.412)\"\n                    />\n                  </clipPath>\n                </defs>\n              </svg>\n            </a>\n          </div>\n        </div>\n      </div>\n      <div class=\"mt-10 py-10 border-t md:text-center\">\n        <p>© 2022 Float UI Inc. All rights reserved.</p>\n      </div>\n    </div>\n  </footer>\n</div>"}]}}
+ltr: {"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\" px-4 text-gray-600 md:px-8\">\n                <div className=\"justify-between sm:flex\">\n                    <div className=\"space-y-6\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"max-w-md\">\n                            Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                        </p>\n                        <ul className=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                            {\n                                footerNavs.map((item, idx) => (\n                                    <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                        <a key={idx} href={item.href}>\n                                            {item.name}\n                                        </a>\n                                    </li>\n                                ))\n                            }\n                        </ul>\n                    </div>\n                    <div className=\"mt-6\">\n                        <p className=\"text-gray-700 font-semibold\">Get the app</p>\n                        <div className=\"flex items-center gap-3 mt-3 sm:block\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                            </a>\n                            <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                            </a>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t md:text-center\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                </div>\n            </div>\n        </footer>\n    )\n}"}]},"svelte":{"svelteTail":[{"code":"<script>\n    let footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ];\n</script>\n\n<footer class=\"pt-10\">\n    <div class=\" px-4 text-gray-600 md:px-8\">\n        <div class=\"justify-between sm:flex\">\n            <div class=\"space-y-6\">\n                <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" alt=\"Float UI Logo\" />\n                <p class=\"max-w-md\">\n                    Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                </p>\n                <ul class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                    {#each footerNavs as item, idx}\n                        <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                            <a href={item.href}>\n                                {item.name}\n                            </a>\n                        </li>\n                    {/each}\n                </ul>\n            </div>\n            <div class=\"mt-6\">\n                <p class=\"text-gray-700 font-semibold\">Get the app</p>\n                <div class=\"flex items-center gap-3 mt-3 sm:block\">\n                  <a href=\"javascript:void()\">\n                      <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                  </a>\n                  <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                      <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                  </a>\n                </div>\n            </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t md:text-center\">\n            <p>© 2022 Float UI Inc. All rights reserved.</p>\n        </div>\n    </div>\n</footer>\n","label":"App.svelte"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\" px-4 text-gray-600 md:px-8\">\n                <div className=\"justify-between sm:flex\">\n                    <div className=\"space-y-6\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"max-w-md\">\n                            Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                        </p>\n                        <ul className=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                            {\n                                footerNavs.map((item, idx) => (\n                                    <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                        <a key={idx} href={item.href}>\n                                            {item.name}\n                                        </a>\n                                    </li>\n                                ))\n                            }\n                        </ul>\n                    </div>\n                    <div className=\"mt-6\">\n                        <p className=\"text-gray-700 font-semibold\">Get the app</p>\n                        <div className=\"flex items-center gap-3 mt-3 sm:block\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                            </a>\n                            <a href=\"javascript:void()\" className=\"mt-0 block sm:mt-3\">\n                                <svg className=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                            </a>\n                        </div>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t md:text-center\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                </div>\n            </div>\n        </footer>\n    )\n}","vue":{"vueTail":[{"code":"<template>\n    <footer class=\"pt-10\">\n        <div class=\" px-4 text-gray-600 md:px-8\">\n            <div class=\"justify-between sm:flex\">\n                <div class=\"space-y-6\">\n                    <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n                    <p class=\"max-w-md\">\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <ul class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\">\n                        <li \n                            v-for=\"(item, idx) in footerNavs\" \n                            :key=\"idx\"\n                            class=\"text-gray-800 hover:text-gray-500 duration-150\"\n                        >\n                            <a :href=\"item.href\">\n                                {{ item.name }}\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n                <div class=\"mt-6\">\n                    <p class=\"text-gray-700 font-semibold\">Get the app</p>\n                    <div class=\"flex items-center gap-3 mt-3 sm:block\">\n                      <a href=\"javascript:void()\">\n                          <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\"><path fill=\"#000\" d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\" /><path fill=\"#A6A6A6\" d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\" /><path fill=\"#fff\" d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\" /><path fill=\"#fff\" d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\" /><path fill=\"#fff\" d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\" /><path fill=\"#fff\" d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\" /><path fill=\"#fff\" d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\" /><path fill=\"#fff\" d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\" /><path fill=\"#fff\" d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\" /><path fill=\"url(#paint0_linear_3_178167)\" d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\" /><path fill=\"url(#paint1_linear_3_178167)\" d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\" /><path fill=\"url(#paint2_linear_3_178167)\" d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\" /><path fill=\"url(#paint3_linear_3_178167)\" d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\" /><path fill=\"#000\" d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\" /><path fill=\"url(#paint4_linear_3_178167)\" d=\"M68.327 60.643l.234-.133-.234.133z\" /><path fill=\"url(#paint5_linear_3_178167)\" d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\" /><path fill=\"#000\" d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\" /><path fill=\"url(#paint6_linear_3_178167)\" d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\" /><path fill=\"url(#paint7_linear_3_178167)\" d=\"M27.053 81.005l.185-.185-.185.185\" /><path fill=\"#000\" d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\" /><path fill=\"url(#paint8_linear_3_178167)\" d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\" /><path fill=\"#404040\" d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\" /><path fill=\"url(#paint9_linear_3_178167)\" d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\" /><path fill=\"#404040\" d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\" /><path fill=\"url(#paint10_linear_3_178167)\" d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\" /><path fill=\"url(#paint11_linear_3_178167)\" d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\" /><defs><linearGradient id=\"paint0_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#00A0FF\" /><stop offset=\".007\" stop-color=\"#00A1FF\" /><stop offset=\".26\" stop-color=\"#00BEFF\" /><stop offset=\".512\" stop-color=\"#00D2FF\" /><stop offset=\".76\" stop-color=\"#00DFFF\" /><stop offset=\"1\" stop-color=\"#00E3FF\" /></linearGradient><linearGradient id=\"paint1_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE000\" /><stop offset=\".409\" stop-color=\"#FFBD00\" /><stop offset=\".775\" stop-color=\"orange\" /><stop offset=\"1\" stop-color=\"#FF9C00\" /></linearGradient><linearGradient id=\"paint2_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FF3A44\" /><stop offset=\"1\" stop-color=\"#C31162\" /></linearGradient><linearGradient id=\"paint3_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#32A071\" /><stop offset=\".069\" stop-color=\"#2DA771\" /><stop offset=\".476\" stop-color=\"#15CF74\" /><stop offset=\".801\" stop-color=\"#06E775\" /><stop offset=\"1\" stop-color=\"#00F076\" /></linearGradient><linearGradient id=\"paint4_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.004\" y2=\"50.004\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CCB300\" /><stop offset=\".409\" stop-color=\"#CC9700\" /><stop offset=\".775\" stop-color=\"#CC8400\" /><stop offset=\"1\" stop-color=\"#CC7D00\" /></linearGradient><linearGradient id=\"paint5_linear_3_178167\" x1=\"62.853\" x2=\"6.24\" y1=\"55.712\" y2=\"112.324\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#CC2E36\" /><stop offset=\"1\" stop-color=\"#9C0E4E\" /></linearGradient><linearGradient id=\"paint6_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#008DE0\" /><stop offset=\".007\" stop-color=\"#008DE0\" /><stop offset=\".26\" stop-color=\"#00A7E0\" /><stop offset=\".512\" stop-color=\"#00B8E0\" /><stop offset=\".76\" stop-color=\"#00C4E0\" /><stop offset=\"1\" stop-color=\"#00C7E0\" /></linearGradient><linearGradient id=\"paint7_linear_3_178167\" x1=\"62.854\" x2=\"6.242\" y1=\"55.712\" y2=\"112.327\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0333C\" /><stop offset=\"1\" stop-color=\"#AB0F56\" /></linearGradient><linearGradient id=\"paint8_linear_3_178167\" x1=\"85.259\" x2=\"25.067\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#E0C500\" /><stop offset=\".409\" stop-color=\"#E0A600\" /><stop offset=\".775\" stop-color=\"#E09100\" /><stop offset=\"1\" stop-color=\"#E08900\" /></linearGradient><linearGradient id=\"paint9_linear_3_178167\" x1=\"85.259\" x2=\"25.068\" y1=\"50.003\" y2=\"50.003\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#FFE840\" /><stop offset=\".409\" stop-color=\"#FFCE40\" /><stop offset=\".775\" stop-color=\"#FFBC40\" /><stop offset=\"1\" stop-color=\"#FFB540\" /></linearGradient><linearGradient id=\"paint10_linear_3_178167\" x1=\"55.322\" x2=\"13.575\" y1=\"21.915\" y2=\"63.662\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#40B8FF\" /><stop offset=\".007\" stop-color=\"#40B9FF\" /><stop offset=\".26\" stop-color=\"#40CEFF\" /><stop offset=\".512\" stop-color=\"#40DDFF\" /><stop offset=\".76\" stop-color=\"#40E7FF\" /><stop offset=\"1\" stop-color=\"#40EAFF\" /></linearGradient><linearGradient id=\"paint11_linear_3_178167\" x1=\"19.246\" x2=\"44.526\" y1=\".687\" y2=\"25.967\" gradientUnits=\"userSpaceOnUse\"><stop stop-color=\"#65B895\" /><stop offset=\".069\" stop-color=\"#62BD95\" /><stop offset=\".476\" stop-color=\"#50DB97\" /><stop offset=\".801\" stop-color=\"#44ED98\" /><stop offset=\"1\" stop-color=\"#40F498\" /></linearGradient></defs></svg>\n                      </a>\n                      <a href=\"javascript:void()\" class=\"mt-0 block sm:mt-3\">\n                          <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\"><g clip-path=\"url(#clip0_3_178097)\"><path fill=\"#A6A6A6\" d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\" /><path fill=\"#000\" d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\" /><path fill=\"#fff\" d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\" /></g><defs><clipPath id=\"clip0_3_178097\"><path fill=\"#fff\" d=\"M0 0h299.16v100H0z\" transform=\"translate(.412)\" /></clipPath></defs></svg>\n                      </a>\n                    </div>\n                </div>\n            </div>\n            <div class=\"mt-10 py-10 border-t md:text-center\">\n                <p>© 2022 Float UI Inc. All rights reserved.</p>\n            </div>\n        </div>\n    </footer>\n</template>\n\n<script>\nexport default {\n    data() {\n        return {\n            footerNavs: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About us'\n                }\n            ]\n        };\n    }\n}\n</script>","label":"App.vue"}],"vueCss":[]},"html":{"htmlTail":[{"label":"index.html","code":"<div\n  x-data=\"{ \n  footerNavs: [\n      {\n          href: 'javascript:void()',\n          name: 'Terms'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'License'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'Privacy'\n      },\n      {\n          href: 'javascript:void()',\n          name: 'About us'\n      }\n  ]\n}\"\n>\n  <footer class=\"pt-10\">\n    <div class=\" px-4 text-gray-600 md:px-8\">\n      <div class=\"justify-between sm:flex\">\n        <div class=\"space-y-6\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"max-w-md\">\n            Nulla auctor metus vitae lectus iaculis, vel euismod massa\n            efficitur.\n          </p>\n          <ul\n            class=\"flex flex-wrap items-center gap-4 text-sm sm:text-base\"\n          >\n            <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n              <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                <a :href=\"item.href\" x-text=\"item.name\"></a>\n              </li>\n            </template>\n          </ul>\n        </div>\n        <div class=\"mt-6\">\n          <p class=\"text-gray-700 font-semibold\">Get the app</p>\n          <div class=\"flex items-center gap-3 mt-3 sm:block\">\n            <a href=\"javascript:void()\">\n              <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 338 100\">\n                <path\n                  fill=\"#000\"\n                  d=\"M324.477 99.751H13.532c-6.841 0-12.438-5.597-12.438-12.438V12.688C1.094 5.846 6.69.249 13.532.249h310.945c6.841 0 12.438 5.597 12.438 12.438v74.627c0 6.84-5.597 12.437-12.438 12.437z\"\n                />\n                <path\n                  fill=\"#A6A6A6\"\n                  d=\"M324.477.249H13.532C6.69.249 1.094 5.846 1.094 12.687v74.627c0 6.84 5.597 12.437 12.438 12.437h310.945c6.841 0 12.438-5.597 12.438-12.438V12.688c0-6.841-5.597-12.438-12.438-12.438zm0 1.99c5.761 0 10.448 4.687 10.448 10.448v74.627c0 5.76-4.687 10.448-10.448 10.448H13.532c-5.76 0-10.448-4.687-10.448-10.448V12.687c0-5.76 4.687-10.448 10.448-10.448h310.945z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M119.05 25.73c0 2.084-.617 3.744-1.853 4.982-1.404 1.472-3.234 2.208-5.483 2.208-2.155 0-3.986-.746-5.493-2.24-1.508-1.494-2.261-3.346-2.261-5.556s.753-4.061 2.261-5.556c1.507-1.494 3.338-2.24 5.493-2.24 1.068 0 2.092.208 3.063.625.972.418 1.751.973 2.335 1.668l-1.312 1.312c-.988-1.18-2.349-1.77-4.086-1.77-1.572 0-2.93.552-4.077 1.657-1.146 1.105-1.72 2.54-1.72 4.304 0 1.765.574 3.199 1.72 4.305 1.147 1.105 2.505 1.657 4.077 1.657 1.666 0 3.056-.555 4.168-1.667.722-.724 1.14-1.73 1.252-3.023h-5.42v-1.793h7.232c.07.39.104.764.104 1.127\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M119.05 25.73h-.249c-.002 2.037-.596 3.618-1.78 4.806l-.003.002-.001.002c-1.359 1.421-3.106 2.129-5.303 2.132-2.097-.003-3.852-.718-5.318-2.168-1.462-1.453-2.185-3.226-2.188-5.38.003-2.154.726-3.926 2.188-5.378 1.466-1.45 3.221-2.167 5.318-2.17a7.45 7.45 0 012.965.606c.943.406 1.687.938 2.242 1.6l.191-.161-.176-.176-1.312 1.314.176.174.191-.159c-1.034-1.239-2.485-1.864-4.277-1.86-1.63-.002-3.063.58-4.249 1.727-1.197 1.15-1.798 2.665-1.796 4.484-.002 1.818.599 3.332 1.796 4.483 1.186 1.147 2.619 1.729 4.249 1.727 1.721.003 3.189-.581 4.344-1.74.772-.773 1.209-1.845 1.324-3.177l.023-.27h-5.443v-1.296h6.984v-.248l-.245.043c.068.378.1.736.1 1.083h.498c0-.378-.035-.767-.108-1.171l-.037-.204h-7.689v2.291h5.669v-.25l-.248-.021c-.11 1.252-.508 2.194-1.18 2.869-1.069 1.064-2.38 1.59-3.992 1.593-1.513-.002-2.797-.523-3.904-1.587-1.096-1.06-1.641-2.413-1.644-4.125.003-1.713.548-3.066 1.644-4.126 1.107-1.064 2.391-1.585 3.904-1.587 1.682.004 2.952.56 3.895 1.682l.175.208 1.503-1.505.162-.162-.147-.174c-.611-.728-1.426-1.307-2.427-1.736a7.938 7.938 0 00-3.161-.646c-2.212-.002-4.12.775-5.668 2.313-1.554 1.536-2.337 3.466-2.335 5.733-.002 2.265.781 4.196 2.336 5.733 1.547 1.537 3.455 2.313 5.667 2.311 2.303.002 4.213-.763 5.663-2.285l-.18-.172.176.176c1.288-1.288 1.928-3.027 1.926-5.158h-.249zM130.516 19.495h-6.797v4.733h6.13v1.793h-6.13v4.733h6.797v1.833h-8.713V17.662h8.713v1.833z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M130.516 19.495v-.248h-7.046v5.23h6.13v1.295h-6.13v5.23h6.797v1.336h-8.215V17.91h8.215v1.585h.249v-.248.248h.249v-2.082h-9.211v15.423h9.211v-2.332h-6.797V26.27h6.129v-2.292h-6.129v-4.234h6.797v-.249h-.249M138.604 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M138.604 32.587v-.249h-1.671V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.249v-.249.25h.248V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09H138.852v-.248h-.248M150.193 32.587V17.662h1.917v14.925h-1.917z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M150.193 32.587h.249V17.91h1.419v14.428h-1.668v.25h.249-.249v.248h2.166V17.413h-2.415v15.423h.249v-.249zM160.618 32.587h-1.92V19.495h-4.168v-1.833h10.256v1.833h-4.168v13.092z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M160.617 32.587v-.249h-1.67V19.247h-4.168V17.91h9.758v1.337h-4.168v13.34h.248v-.249.25h.249V19.743h4.169v-2.331h-10.754v2.332h4.169v13.09h2.416v-.248h-.249M174.674 29.409c1.105 1.118 2.457 1.677 4.055 1.677 1.599 0 2.951-.559 4.054-1.677 1.106-1.119 1.66-2.548 1.66-4.285 0-1.736-.554-3.166-1.66-4.284-1.103-1.119-2.455-1.677-4.054-1.677-1.598 0-2.95.558-4.055 1.677-1.103 1.118-1.656 2.548-1.656 4.284 0 1.737.553 3.166 1.656 4.285zm9.528 1.25c-1.468 1.508-3.292 2.261-5.473 2.261-2.182 0-4.006-.753-5.47-2.262-1.469-1.507-2.199-3.352-2.199-5.534 0-2.181.73-4.027 2.199-5.534 1.464-1.509 3.288-2.263 5.47-2.263 2.169 0 3.989.758 5.463 2.273 1.472 1.515 2.209 3.356 2.209 5.524 0 2.182-.735 4.027-2.199 5.534z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M174.674 29.409l-.177.175c1.146 1.163 2.575 1.754 4.232 1.75 1.656.004 3.087-.587 4.231-1.75 1.153-1.165 1.733-2.67 1.732-4.46.001-1.788-.579-3.295-1.732-4.459-1.144-1.163-2.575-1.754-4.231-1.75-1.657-.004-3.086.587-4.232 1.75-1.15 1.164-1.731 2.67-1.728 4.46-.003 1.788.578 3.294 1.728 4.459l.177-.175.177-.175c-1.055-1.074-1.583-2.425-1.585-4.11.002-1.684.53-3.035 1.585-4.109 1.065-1.074 2.337-1.6 3.878-1.603 1.54.003 2.815.53 3.877 1.603 1.057 1.074 1.585 2.425 1.587 4.11-.002 1.684-.53 3.035-1.587 4.109-1.062 1.074-2.337 1.6-3.877 1.603-1.541-.003-2.813-.53-3.878-1.603l-.177.175zm9.528 1.25l-.178-.174c-1.426 1.462-3.171 2.184-5.295 2.187-2.125-.003-3.869-.725-5.293-2.187l-.007-.007.007.007c-1.423-1.466-2.126-3.234-2.128-5.36.002-2.127.705-3.895 2.128-5.361 1.424-1.462 3.168-2.185 5.293-2.188 2.111.003 3.851.73 5.285 2.198 1.429 1.473 2.135 3.239 2.138 5.35-.003 2.127-.707 3.895-2.128 5.361l.178.173.179.173c1.508-1.549 2.27-3.47 2.269-5.706.001-2.225-.764-4.142-2.279-5.698-1.516-1.561-3.415-2.351-5.642-2.348-2.239-.003-4.143.783-5.649 2.339v-.001c-1.511 1.55-2.271 3.47-2.269 5.707-.002 2.237.758 4.158 2.269 5.708l.006.007-.006-.008c1.506 1.556 3.41 2.34 5.649 2.338 2.238.002 4.142-.782 5.652-2.338l-.179-.173M189.092 32.587V17.662h2.334l7.254 11.61h.083l-.083-2.876v-8.734h1.919v14.925h-2.001l-7.589-12.174h-.083l.083 2.878v9.296h-1.917z\"\n                />\n                <path\n                  fill=\"#fff\"\n                  d=\"M189.092 32.587h.249V17.91h1.947l7.254 11.611h.476l-.089-3.128V17.91h1.422v14.428h-1.615l-7.589-12.173h-.477l.09 3.13v9.043h-1.668v.25h.249-.249v.248h2.165v-9.55l-.082-2.88-.249.008v.248h.082v-.248l-.21.132 7.661 12.29H200.848V17.413H198.431v8.986l.083 2.88.249-.006v-.25h-.083v.25l.211-.132-7.327-11.728H188.844v15.423h.248v-.249zM267.104 74.876h4.642V43.778h-4.642v31.098zm41.808-19.896l-5.321 13.483h-.159L297.91 54.98h-5l8.281 18.844-4.721 10.482h4.843l12.761-29.326h-5.162zm-26.323 16.364c-1.522 0-3.642-.76-3.642-2.641 0-2.4 2.642-3.32 4.921-3.32 2.042 0 3 .44 4.241 1.04-.361 2.88-2.841 4.92-5.52 4.92zm.56-17.044c-3.361 0-6.841 1.48-8.281 4.761l4.119 1.72c.881-1.72 2.52-2.28 4.241-2.28 2.401 0 4.841 1.44 4.881 4.001v.32c-.841-.48-2.639-1.2-4.841-1.2-4.44 0-8.963 2.44-8.963 7 0 4.162 3.642 6.843 7.722 6.843 3.122 0 4.841-1.4 5.923-3.04h.159v2.4h4.48V62.9c0-5.52-4.119-8.601-9.44-8.601zm-28.687 4.466h-6.602v-10.66h6.602c3.47 0 5.44 2.873 5.44 5.33 0 2.41-1.97 5.33-5.44 5.33zm-.119-14.988h-11.122v31.098h4.639V63.094h6.483c5.144 0 10.201-3.725 10.201-9.658s-5.057-9.658-10.201-9.658zm-60.65 27.571c-3.206 0-5.891-2.684-5.891-6.372 0-3.727 2.685-6.452 5.891-6.452 3.166 0 5.651 2.726 5.651 6.452 0 3.688-2.485 6.372-5.651 6.372zm5.33-14.628h-.16c-1.042-1.242-3.046-2.364-5.571-2.364-5.29 0-10.139 4.649-10.139 10.62 0 5.931 4.849 10.54 10.139 10.54 2.525 0 4.529-1.122 5.571-2.404h.16v1.523c0 4.048-2.164 6.212-5.65 6.212-2.846 0-4.609-2.045-5.331-3.768l-4.047 1.683c1.162 2.806 4.248 6.252 9.378 6.252 5.45 0 10.059-3.206 10.059-11.02V54.997h-4.409v1.723zm7.614 18.155h4.649V43.777h-4.649v31.099zm11.502-10.26c-.12-4.088 3.166-6.17 5.531-6.17 1.844 0 3.406.92 3.926 2.244l-9.457 3.927zm14.428-3.526c-.881-2.365-3.568-6.733-9.058-6.733-5.45 0-9.978 4.288-9.978 10.58 0 5.931 4.488 10.58 10.499 10.58 4.85 0 7.656-2.966 8.818-4.689l-3.607-2.405c-1.202 1.764-2.846 2.926-5.211 2.926-2.364 0-4.047-1.082-5.13-3.205l14.147-5.852-.48-1.202zM119.86 57.603v4.489h10.74c-.321 2.525-1.163 4.368-2.445 5.65-1.563 1.564-4.007 3.287-8.295 3.287-6.613 0-11.783-5.33-11.783-11.943 0-6.612 5.17-11.943 11.783-11.943 3.566 0 6.171 1.403 8.095 3.207l3.165-3.166c-2.684-2.565-6.252-4.529-11.26-4.529-9.058 0-16.672 7.374-16.672 16.431 0 9.058 7.614 16.431 16.672 16.431 4.889 0 8.576-1.602 11.461-4.609 2.965-2.965 3.888-7.133 3.888-10.499 0-1.043-.08-2.004-.241-2.806H119.86zm27.559 13.746c-3.207 0-5.972-2.645-5.972-6.412 0-3.807 2.765-6.412 5.972-6.412 3.205 0 5.971 2.605 5.971 6.412 0 3.767-2.766 6.412-5.971 6.412zm0-16.992c-5.852 0-10.621 4.449-10.621 10.58 0 6.092 4.769 10.58 10.621 10.58 5.85 0 10.62-4.488 10.62-10.58 0-6.131-4.77-10.58-10.62-10.58zm23.167 16.992c-3.205 0-5.971-2.645-5.971-6.412 0-3.807 2.766-6.412 5.971-6.412 3.206 0 5.971 2.605 5.971 6.412 0 3.767-2.765 6.412-5.971 6.412zm0-16.992c-5.851 0-10.619 4.449-10.619 10.58 0 6.092 4.768 10.58 10.619 10.58s10.62-4.488 10.62-10.58c0-6.131-4.769-10.58-10.62-10.58z\"\n                />\n                <path\n                  fill=\"url(#paint0_linear_3_178167)\"\n                  d=\"M27.238 80.82l-.185-.177c-.724-.766-1.151-1.956-1.151-3.496v.363-55.015-.013.377c0-1.667.498-2.924 1.333-3.677l30.82 30.82L27.238 80.82zm-1.336-58.34zm.01-.408l.001-.006v.006zm.001-.017v-.003.003z\"\n                />\n                <path\n                  fill=\"url(#paint1_linear_3_178167)\"\n                  d=\"M68.327 60.643l.234-.133 12.172-6.916c1.16-.66 1.933-1.46 2.32-2.306-.385.847-1.16 1.648-2.32 2.307L68.56 60.511l-.234.132zm.003-.364L58.055 50.002 68.33 39.727l12.404 7.047c1.575.895 2.46 2.048 2.607 3.227v.005c-.148 1.175-1.032 2.33-2.607 3.225L68.33 60.278\"\n                />\n                <path\n                  fill=\"url(#paint2_linear_3_178167)\"\n                  d=\"M29.435 81.993c-.861 0-1.612-.28-2.198-.808v-.001c.587.529 1.339.81 2.2.81a4.73 4.73 0 00-.002 0zm0-.364c-.86 0-1.611-.28-2.197-.809l30.817-30.818L68.33 60.279 32.222 80.794c-.998.567-1.945.835-2.786.835zm-2.206-.45a3.364 3.364 0 01-.16-.157l.16.156z\"\n                />\n                <path\n                  fill=\"url(#paint3_linear_3_178167)\"\n                  d=\"M58.055 50.002l-30.82-30.82c.585-.527 1.336-.807 2.196-.807.843 0 1.79.269 2.791.836L68.33 39.727 58.055 50.002zm10.506-10.507L32.222 18.848c-1-.567-1.948-.837-2.791-.837h-.011.015c.841 0 1.788.268 2.787.836l36.34 20.648z\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M29.664 81.987c.782-.044 1.648-.313 2.558-.83l36.105-20.514-36.105 20.515c-.91.516-1.776.785-2.558.83zm-2.427-.802l-.008-.007a.068.068 0 01.008.007zm-.168-.163l-.016-.016.015.016z\"\n                />\n                <path\n                  fill=\"url(#paint4_linear_3_178167)\"\n                  d=\"M68.327 60.643l.234-.133-.234.133z\"\n                />\n                <path\n                  fill=\"url(#paint5_linear_3_178167)\"\n                  d=\"M29.437 81.993c-.861 0-1.614-.28-2.2-.81v.002a.068.068 0 00-.008-.007l-.16-.156-.016-.017.185-.185c.585.529 1.337.81 2.198.809.841 0 1.788-.268 2.786-.835L68.33 60.28l.231.231-.234.133-36.105 20.515c-.91.516-1.776.785-2.558.83a4.73 4.73 0 01-.227.005\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M27.053 81.006c-.724-.766-1.151-1.955-1.151-3.495v-.001c0 1.541.427 2.73 1.15 3.495v.001\"\n                />\n                <path\n                  fill=\"url(#paint6_linear_3_178167)\"\n                  d=\"M27.053 81.005c-.724-.766-1.151-1.954-1.151-3.495v-.362c0 1.54.427 2.729 1.15 3.495l.186.177-.185.185\"\n                />\n                <path\n                  fill=\"url(#paint7_linear_3_178167)\"\n                  d=\"M27.053 81.005l.185-.185-.185.185\"\n                />\n                <path\n                  fill=\"#000\"\n                  d=\"M83.052 51.289a3.08 3.08 0 00.288-1.283v-.002c0 .432-.096.864-.288 1.285z\"\n                />\n                <path\n                  fill=\"url(#paint8_linear_3_178167)\"\n                  d=\"M68.561 60.51l-.231-.231 12.403-7.048c1.575-.895 2.46-2.05 2.607-3.225 0 .431-.096.863-.288 1.282-.386.847-1.159 1.647-2.32 2.306l-12.17 6.916z\"\n                />\n                <path\n                  fill=\"#404040\"\n                  d=\"M83.34 50.002V50c-.001-1.301-.87-2.602-2.607-3.59L68.56 39.496v-.001l12.172 6.915c1.738.988 2.609 2.29 2.607 3.592z\"\n                />\n                <path\n                  fill=\"url(#paint9_linear_3_178167)\"\n                  d=\"M83.34 50c-.148-1.178-1.032-2.331-2.607-3.226l-12.404-7.047.231-.231h.001l12.172 6.915c1.736.988 2.606 2.289 2.607 3.59z\"\n                />\n                <path\n                  fill=\"#404040\"\n                  d=\"M25.902 22.482v-.003.003zm.01-.404v-.006.006zm.001-.012v-.011.011zm0-.014c.144-2.556 1.534-4.032 3.5-4.04-.853.004-1.595.284-2.176.808v-.001l-.007.007c-.061.055-.12.113-.177.174-.653.69-1.065 1.725-1.14 3.052z\"\n                />\n                <path\n                  fill=\"url(#paint10_linear_3_178167)\"\n                  d=\"M25.902 22.86v-.364-.014-.003c0-.137.003-.27.01-.4v-.007l.001-.006v-.011-.003c.075-1.327.487-2.361 1.14-3.052l.182.182c-.835.754-1.333 2.01-1.333 3.677zm1.328-4.034l.007-.007-.007.007z\"\n                />\n                <path\n                  fill=\"url(#paint11_linear_3_178167)\"\n                  d=\"M68.329 39.727L32.223 19.211c-1.002-.567-1.949-.836-2.792-.836-.86 0-1.61.28-2.196.807L27.053 19a3.33 3.33 0 01.177-.174l.007-.006c.58-.524 1.323-.804 2.175-.809H29.43c.844 0 1.791.27 2.792.837l36.34 20.647h-.002l-.231.232z\"\n                />\n                <defs>\n                  <linearGradient\n                    id=\"paint0_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#00A0FF\" />\n                    <stop offset=\".007\" stop-color=\"#00A1FF\" />\n                    <stop offset=\".26\" stop-color=\"#00BEFF\" />\n                    <stop offset=\".512\" stop-color=\"#00D2FF\" />\n                    <stop offset=\".76\" stop-color=\"#00DFFF\" />\n                    <stop offset=\"1\" stop-color=\"#00E3FF\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint1_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FFE000\" />\n                    <stop offset=\".409\" stop-color=\"#FFBD00\" />\n                    <stop offset=\".775\" stop-color=\"orange\" />\n                    <stop offset=\"1\" stop-color=\"#FF9C00\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint2_linear_3_178167\"\n                    x1=\"62.853\"\n                    x2=\"6.24\"\n                    y1=\"55.712\"\n                    y2=\"112.324\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FF3A44\" />\n                    <stop offset=\"1\" stop-color=\"#C31162\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint3_linear_3_178167\"\n                    x1=\"19.246\"\n                    x2=\"44.526\"\n                    y1=\".687\"\n                    y2=\"25.967\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#32A071\" />\n                    <stop offset=\".069\" stop-color=\"#2DA771\" />\n                    <stop offset=\".476\" stop-color=\"#15CF74\" />\n                    <stop offset=\".801\" stop-color=\"#06E775\" />\n                    <stop offset=\"1\" stop-color=\"#00F076\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint4_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.004\"\n                    y2=\"50.004\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#CCB300\" />\n                    <stop offset=\".409\" stop-color=\"#CC9700\" />\n                    <stop offset=\".775\" stop-color=\"#CC8400\" />\n                    <stop offset=\"1\" stop-color=\"#CC7D00\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint5_linear_3_178167\"\n                    x1=\"62.853\"\n                    x2=\"6.24\"\n                    y1=\"55.712\"\n                    y2=\"112.324\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#CC2E36\" />\n                    <stop offset=\"1\" stop-color=\"#9C0E4E\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint6_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#008DE0\" />\n                    <stop offset=\".007\" stop-color=\"#008DE0\" />\n                    <stop offset=\".26\" stop-color=\"#00A7E0\" />\n                    <stop offset=\".512\" stop-color=\"#00B8E0\" />\n                    <stop offset=\".76\" stop-color=\"#00C4E0\" />\n                    <stop offset=\"1\" stop-color=\"#00C7E0\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint7_linear_3_178167\"\n                    x1=\"62.854\"\n                    x2=\"6.242\"\n                    y1=\"55.712\"\n                    y2=\"112.327\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#E0333C\" />\n                    <stop offset=\"1\" stop-color=\"#AB0F56\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint8_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.067\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#E0C500\" />\n                    <stop offset=\".409\" stop-color=\"#E0A600\" />\n                    <stop offset=\".775\" stop-color=\"#E09100\" />\n                    <stop offset=\"1\" stop-color=\"#E08900\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint9_linear_3_178167\"\n                    x1=\"85.259\"\n                    x2=\"25.068\"\n                    y1=\"50.003\"\n                    y2=\"50.003\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#FFE840\" />\n                    <stop offset=\".409\" stop-color=\"#FFCE40\" />\n                    <stop offset=\".775\" stop-color=\"#FFBC40\" />\n                    <stop offset=\"1\" stop-color=\"#FFB540\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint10_linear_3_178167\"\n                    x1=\"55.322\"\n                    x2=\"13.575\"\n                    y1=\"21.915\"\n                    y2=\"63.662\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#40B8FF\" />\n                    <stop offset=\".007\" stop-color=\"#40B9FF\" />\n                    <stop offset=\".26\" stop-color=\"#40CEFF\" />\n                    <stop offset=\".512\" stop-color=\"#40DDFF\" />\n                    <stop offset=\".76\" stop-color=\"#40E7FF\" />\n                    <stop offset=\"1\" stop-color=\"#40EAFF\" />\n                  </linearGradient>\n                  <linearGradient\n                    id=\"paint11_linear_3_178167\"\n                    x1=\"19.246\"\n                    x2=\"44.526\"\n                    y1=\".687\"\n                    y2=\"25.967\"\n                    gradientUnits=\"userSpaceOnUse\"\n                  >\n                    <stop stop-color=\"#65B895\" />\n                    <stop offset=\".069\" stop-color=\"#62BD95\" />\n                    <stop offset=\".476\" stop-color=\"#50DB97\" />\n                    <stop offset=\".801\" stop-color=\"#44ED98\" />\n                    <stop offset=\"1\" stop-color=\"#40F498\" />\n                  </linearGradient>\n                </defs>\n              </svg>\n            </a>\n            <a href=\"javascript:void()\" class=\"mt-0 block sm:mt-3\">\n              <svg class=\"w-32\" fill=\"none\" viewBox=\"0 0 300 100\">\n                <g clip-path=\"url(#clip0_3_178097)\">\n                  <path\n                    fill=\"#A6A6A6\"\n                    d=\"M275.749 0h-251.5c-.917 0-1.823 0-2.737.005-.765.005-1.524.02-2.297.032-1.679.02-3.354.167-5.01.442-1.654.28-3.256.808-4.752 1.567a16.094 16.094 0 00-4.047 2.947 15.646 15.646 0 00-2.945 4.053 16.503 16.503 0 00-1.563 4.758 32.483 32.483 0 00-.448 5.005c-.023.766-.026 1.535-.038 2.302v57.786c.012.776.015 1.528.038 2.304.02 1.678.17 3.351.448 5.005a16.468 16.468 0 001.563 4.76 15.52 15.52 0 002.945 4.037 15.687 15.687 0 004.047 2.946 16.754 16.754 0 004.752 1.578 33.64 33.64 0 005.01.441c.773.017 1.532.027 2.297.027.914.005 1.82.005 2.737.005h251.5c.899 0 1.812 0 2.71-.005.762 0 1.543-.01 2.305-.027a33.196 33.196 0 005-.442 17.011 17.011 0 004.77-1.577 15.678 15.678 0 004.043-2.946 15.95 15.95 0 002.954-4.036 16.509 16.509 0 001.548-4.76c.279-1.655.434-3.328.464-5.006.01-.776.01-1.528.01-2.304.019-.909.019-1.812.019-2.735V23.84c0-.915 0-1.823-.019-2.729 0-.767 0-1.536-.01-2.302a33.726 33.726 0 00-.464-5.005 16.53 16.53 0 00-1.548-4.758 16.163 16.163 0 00-6.997-7 16.915 16.915 0 00-4.77-1.568 32.618 32.618 0 00-5-.441c-.762-.013-1.543-.027-2.305-.032C277.561 0 276.648 0 275.749 0z\"\n                  />\n                  <path\n                    fill=\"#000\"\n                    d=\"M21.524 97.813c-.762 0-1.505-.01-2.26-.027a31.713 31.713 0 01-4.673-.408 14.71 14.71 0 01-4.142-1.37 13.517 13.517 0 01-3.493-2.541 13.304 13.304 0 01-2.551-3.492 14.305 14.305 0 01-1.357-4.142 31.033 31.033 0 01-.417-4.688c-.016-.527-.036-2.283-.036-2.283V21.111s.022-1.729.036-2.236c.02-1.569.158-3.133.414-4.68a14.389 14.389 0 011.359-4.156 13.433 13.433 0 012.538-3.495 13.913 13.913 0 013.506-2.556 14.558 14.558 0 014.133-1.36c1.55-.253 3.118-.39 4.689-.41l2.256-.03h256.921l2.283.031a30.98 30.98 0 014.646.407c1.452.246 2.86.708 4.177 1.37a13.982 13.982 0 016.037 6.05 14.367 14.367 0 011.338 4.122c.26 1.56.405 3.136.435 4.718.007.707.007 1.468.007 2.225.02.937.02 1.83.02 2.73v52.321c0 .908 0 1.794-.02 2.688 0 .813 0 1.558-.01 2.324a31.846 31.846 0 01-.427 4.634 14.35 14.35 0 01-1.35 4.175 13.708 13.708 0 01-2.539 3.464 13.523 13.523 0 01-3.498 2.556 14.656 14.656 0 01-4.17 1.375 31.378 31.378 0 01-4.673.408 98.51 98.51 0 01-2.244.026l-2.71.005-254.225-.004z\"\n                  />\n                  <path\n                    fill=\"#fff\"\n                    d=\"M62.334 50.75a12.37 12.37 0 015.892-10.38 12.665 12.665 0 00-9.978-5.394c-4.198-.44-8.268 2.512-10.407 2.512-2.181 0-5.475-2.468-9.022-2.395a13.288 13.288 0 00-11.182 6.82c-4.835 8.37-1.229 20.673 3.403 27.44 2.317 3.313 5.026 7.014 8.57 6.883 3.467-.144 4.762-2.211 8.948-2.211 4.147 0 5.362 2.211 8.977 2.128 3.721-.06 6.066-3.328 8.301-6.673a27.405 27.405 0 003.796-7.731 11.954 11.954 0 01-7.298-10.998zM55.505 30.528a12.18 12.18 0 002.786-8.727 12.394 12.394 0 00-8.018 4.15 11.59 11.59 0 00-2.86 8.403 10.246 10.246 0 008.092-3.826zM106.168 67.85H94.334l-2.841 8.39H86.48L97.69 45.195h5.207l11.209 31.045h-5.098l-2.839-8.39zM95.56 63.976h9.38l-4.624-13.618h-.129L95.56 63.977zM138.311 64.924c0 7.034-3.764 11.553-9.445 11.553a7.671 7.671 0 01-7.122-3.96h-.108v11.21h-4.646V53.606h4.498v3.765h.085a8.027 8.027 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM163.223 64.924c0 7.034-3.764 11.553-9.445 11.553a7.673 7.673 0 01-7.122-3.96h-.107v11.21h-4.646V53.606h4.497v3.765h.085a8.028 8.028 0 017.207-4.001c5.745 0 9.531 4.54 9.531 11.555zm-4.775 0c0-4.583-2.368-7.595-5.981-7.595-3.55 0-5.938 3.076-5.938 7.595 0 4.56 2.388 7.615 5.938 7.615 3.613 0 5.981-2.991 5.981-7.615zM179.688 67.59c.345 3.079 3.335 5.1 7.422 5.1 3.916 0 6.734-2.021 6.734-4.797 0-2.41-1.7-3.853-5.723-4.841l-4.023-.97c-5.701-1.377-8.348-4.043-8.348-8.369 0-5.356 4.668-9.035 11.297-9.035 6.56 0 11.057 3.679 11.208 9.035h-4.69c-.281-3.098-2.842-4.968-6.584-4.968-3.743 0-6.304 1.892-6.304 4.646 0 2.195 1.636 3.486 5.637 4.475l3.421.84c6.369 1.506 9.016 4.065 9.016 8.606 0 5.808-4.627 9.446-11.985 9.446-6.885 0-11.533-3.553-11.834-9.168h4.756zM208.778 48.252v5.356h4.304v3.68h-4.304v12.477c0 1.939.862 2.842 2.754 2.842a14.48 14.48 0 001.528-.108v3.658c-.851.159-1.715.23-2.581.215-4.582 0-6.369-1.722-6.369-6.111V57.287h-3.291v-3.68h3.291v-5.355h4.668zM215.575 64.926c0-7.121 4.194-11.596 10.735-11.596 6.562 0 10.737 4.475 10.737 11.596 0 7.141-4.153 11.597-10.737 11.597-6.583 0-10.735-4.456-10.735-11.597zm16.738 0c0-4.885-2.239-7.768-6.003-7.768-3.765 0-6.001 2.905-6.001 7.768 0 4.905 2.236 7.766 6.001 7.766 3.764 0 6.003-2.86 6.003-7.766zM240.877 53.605h4.432v3.853h.107a5.402 5.402 0 015.444-4.09 7.157 7.157 0 011.592.174v4.346a6.493 6.493 0 00-2.087-.281 4.685 4.685 0 00-4.637 3.215 4.69 4.69 0 00-.205 1.992V76.24h-4.646V53.605zM273.873 69.594c-.625 4.11-4.627 6.929-9.746 6.929-6.585 0-10.672-4.412-10.672-11.49 0-7.099 4.109-11.703 10.477-11.703 6.262 0 10.2 4.301 10.2 11.164v1.592h-15.987v.28a5.902 5.902 0 003.647 5.979 5.891 5.891 0 002.442.433 5.122 5.122 0 005.227-3.184h4.412zm-15.706-6.755h11.316a5.45 5.45 0 00-1.52-4.085 5.451 5.451 0 00-4.031-1.66 5.731 5.731 0 00-5.765 5.745zM94.978 21.828a6.599 6.599 0 017.019 7.412c0 4.766-2.576 7.505-7.02 7.505H89.59V21.828h5.388zm-3.072 12.808h2.813a4.689 4.689 0 004.92-5.365 4.702 4.702 0 00-4.92-5.335h-2.813v10.7zM104.614 31.113a5.334 5.334 0 017.467-5.385 5.328 5.328 0 012.902 3.194c.235.705.32 1.452.249 2.191a5.336 5.336 0 01-9.259 4.102 5.334 5.334 0 01-1.359-4.102zm8.333 0c0-2.44-1.097-3.867-3.02-3.867-1.932 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.923 0 3.02-1.426 3.02-3.875zM129.345 36.745h-2.304l-2.327-8.29h-.176l-2.317 8.29h-2.282l-3.103-11.257h2.253l2.017 8.59h.166l2.314-8.59h2.132l2.314 8.59h.176l2.007-8.59h2.221l-3.091 11.257zM135.046 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.582 2.582 0 00-2.688 2.853v6.586h-2.222V25.487zM148.147 21.093h2.221v15.652h-2.221V21.093zM153.457 31.11a5.34 5.34 0 011.362-4.095 5.343 5.343 0 013.947-1.747 5.33 5.33 0 015.061 3.65 5.34 5.34 0 01.249 2.192 5.336 5.336 0 11-10.619 0zm8.332 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.017 1.427-3.017 3.867 0 2.46 1.086 3.875 3.017 3.875 1.924 0 3.02-1.425 3.02-3.875zM166.415 33.563c0-2.026 1.508-3.194 4.187-3.36l3.049-.176v-.972c0-1.189-.786-1.86-2.305-1.86-1.24 0-2.099.455-2.346 1.251h-2.151c.227-1.933 2.046-3.174 4.6-3.174 2.822 0 4.414 1.405 4.414 3.783v7.692h-2.139v-1.582h-.176a3.78 3.78 0 01-3.381 1.767 3.398 3.398 0 01-3.752-3.369zm7.236-.962v-.94l-2.749.175c-1.55.104-2.254.631-2.254 1.624 0 1.013.879 1.602 2.088 1.602a2.654 2.654 0 002.915-2.46zM178.783 31.112c0-3.557 1.828-5.811 4.673-5.811a3.712 3.712 0 013.452 1.975h.166v-6.183h2.221v15.652h-2.128v-1.778h-.176a3.909 3.909 0 01-3.535 1.964c-2.864 0-4.673-2.254-4.673-5.82zm2.295 0c0 2.387 1.125 3.824 3.008 3.824 1.872 0 3.029-1.457 3.029-3.815 0-2.346-1.169-3.824-3.029-3.824-1.871 0-3.008 1.446-3.008 3.815zM198.487 31.113a5.34 5.34 0 013.151-5.384 5.336 5.336 0 017.219 3.193c.234.705.319 1.452.248 2.191a5.335 5.335 0 01-5.309 5.851 5.333 5.333 0 01-5.309-5.85zm8.333 0c0-2.44-1.096-3.867-3.02-3.867-1.931 0-3.018 1.427-3.018 3.867 0 2.46 1.087 3.876 3.018 3.876 1.924 0 3.02-1.426 3.02-3.875zM212.086 25.487h2.139v1.788h.166a3.368 3.368 0 013.359-2.006 3.658 3.658 0 013.771 2.565c.163.525.206 1.08.126 1.623v7.287h-2.222v-6.73c0-1.808-.786-2.708-2.429-2.708a2.59 2.59 0 00-2 .809 2.59 2.59 0 00-.688 2.044v6.586h-2.222V25.487zM234.2 22.685v2.854h2.439v1.871H234.2V33.2c0 1.18.486 1.696 1.592 1.696.283-.001.566-.019.847-.052v1.85c-.399.072-.803.11-1.208.114-2.471 0-3.455-.869-3.455-3.04V27.41h-1.787V25.54h1.787v-2.854h2.224zM239.674 21.093h2.202v6.204h.176a3.462 3.462 0 013.432-2.017 3.711 3.711 0 013.738 2.586c.164.52.212 1.07.139 1.611v7.268h-2.224v-6.72c0-1.798-.837-2.709-2.407-2.709a2.626 2.626 0 00-2.688 1.728c-.13.36-.18.745-.146 1.126v6.575h-2.222V21.093zM262.316 33.704a4.57 4.57 0 01-4.878 3.257 5.11 5.11 0 01-5.026-3.618 5.131 5.131 0 01-.175-2.193 5.192 5.192 0 015.191-5.881c3.132 0 5.022 2.14 5.022 5.675v.775h-7.949v.124a2.977 2.977 0 002.998 3.225 2.695 2.695 0 002.678-1.364h2.139zm-7.815-3.628h5.686a2.723 2.723 0 00-.74-2.072 2.725 2.725 0 00-2.031-.845 2.88 2.88 0 00-2.915 2.917z\"\n                  />\n                </g>\n                <defs>\n                  <clipPath id=\"clip0_3_178097\">\n                    <path\n                      fill=\"#fff\"\n                      d=\"M0 0h299.16v100H0z\"\n                      transform=\"translate(.412)\"\n                    />\n                  </clipPath>\n                </defs>\n              </svg>\n            </a>\n          </div>\n        </div>\n      </div>\n      <div class=\"mt-10 py-10 border-t md:text-center\">\n        <p>© 2022 Float UI Inc. All rights reserved.</p>\n      </div>\n    </div>\n  </footer>\n</div>"}]}}
 slug: /footers
 id: a4987573-531e-4840-a29c-181aeccbae3c
 created_at: 1670156447413
diff --git a/componentsDB/footers/footers-3477ba81914f.mdx b/componentsDB/footers/footers-3477ba81914f.mdx
index 960e5a1..bacd788 100644
--- a/componentsDB/footers/footers-3477ba81914f.mdx
+++ b/componentsDB/footers/footers-3477ba81914f.mdx
@@ -3,7 +3,7 @@ title: Footer with Newsletter
 category: Marketing
 paid: false
 isActive: true
-ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form @submit.prevent class=\"flex items-center gap-x-3 md:justify-end\">\n            <div class=\"relative\">\n              <svg class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth=\"1.5\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n        <div v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"space-y-4 text-gray-600\">\n          <h4 class=\"text-gray-800 font-semibold sm:pb-2\">\n            {{ item.label }}\n          </h4>\n          <ul>\n            <li v-for=\"(el, elIdx) in item.items\" :key=\"elIdx\">\n              <a :href=\"el.href\" class=\"hover:text-gray-800 duration-150\">\n                {{ el.name }}\n              </a>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n        <p class=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n      ]\n    };\n  }\n};\n</script>","label":"App.vue"}],"vueCss":[]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-600\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"hover:text-gray-800 duration-150\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p className=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-600\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"hover:text-gray-800 duration-150\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p className=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","label":"App.jsx"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n  ];\n</script>\n\n<footer class=\"pt-10\">\n  <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n    <div class=\"justify-between items-center gap-12 md:flex\">\n      <div class=\"flex-1 max-w-lg\">\n        <h3 class=\"text-2xl font-bold\">\n          Get our beautiful newsletter straight to your inbox.\n        </h3>\n      </div>\n      <div class=\"flex-1 mt-6 md:mt-0\">\n        <form on:submit|preventDefault>\n          <div class=\"relative\">\n            <svg class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n            </svg>\n            <input\n              type=\"email\"\n              required\n              placeholder=\"Enter your email\"\n              class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n            />\n          </div>\n          <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n            Subscribe\n          </button>\n        </form>\n      </div>\n    </div>\n    <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n      {#each footerNavs as item}\n        <ul class=\"space-y-4 text-gray-600\">\n          <h4 class=\"text-gray-800 font-semibold sm:pb-2\">\n            {item.label}\n          </h4>\n          {#each item.items as el}\n            <li>\n              <a href={el.href} class=\"hover:text-gray-800 duration-150\">\n                {el.name}\n              </a>\n            </li>\n          {/each}\n        </ul>\n      {/each}\n    </div>\n    <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n      <p class=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n      <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n      </div>\n    </div>\n</footer>"}]},"html":{"htmlTail":[{"code":"<div\n  x-data=\"{\n  footerNavs: [\n  {\n    label: 'Resources',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'contact'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Support'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Documentation'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Pricing'\n        },\n    ],\n},\n{\n    label: 'About',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About US'\n        },\n    ]\n},\n{\n    label: 'Explore',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Showcase'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Roadmap'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Languages'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n    ]\n},\n{\n    label: 'Company',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Partners'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n    ],\n}\n  ]\n}\"\n>\n  <footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form\n            @submit.prevent=\"null\"\n            class=\"flex items-center gap-x-3 md:justify-end\"\n          >\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button\n              class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\"\n            >\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div\n        class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4 text-gray-600\">\n            <h4\n              class=\"text-gray-800 font-semibold sm:pb-2\"\n              x-text=\"item.label\"\n            ></h4>\n            <template x-for=\"(el, elIdx) in item.items\" :key=\"elIdx\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"hover:text-gray-800 duration-150\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n      <div\n        class=\"mt-10 py-10 border-t items-center justify-between sm:flex\"\n      >\n        <p class=\"text-gray-600\">\n          © 2022 Float UI Inc. All rights reserved.\n        </p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</div>","label":"index.html"}]}}
+ltr: {"vue":{"vueTail":[{"code":"<template>\n  <footer class=\"pt-10\">\n    <div class=\" px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form @submit.prevent class=\"flex items-center gap-x-3 md:justify-end\">\n            <div class=\"relative\">\n              <svg class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth=\"1.5\" stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n        <div v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"space-y-4 text-gray-600\">\n          <h4 class=\"text-gray-800 font-semibold sm:pb-2\">\n            {{ item.label }}\n          </h4>\n          <ul>\n            <li v-for=\"(el, elIdx) in item.items\" :key=\"elIdx\">\n              <a :href=\"el.href\" class=\"hover:text-gray-800 duration-150\">\n                {{ el.name }}\n              </a>\n            </li>\n          </ul>\n        </div>\n      </div>\n      <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n        <p class=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n      ]\n    };\n  }\n};\n</script>","label":"App.vue"}],"vueCss":[]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10\">\n            <div className=\" px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-600\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"hover:text-gray-800 duration-150\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p className=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[],"jsxTail":[{"code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n    ]\n\n    return (\n        <footer className=\"pt-10\">\n            <div className=\" px-4 md:px-8\">\n                <div className=\"justify-between items-center gap-12 md:flex\">\n                    <div className=\"flex-1 max-w-lg\">\n                        <h3 className=\"text-2xl font-bold\">\n                            Get our beautiful newsletter straight to your inbox.\n                        </h3>\n                    </div>\n                    <div className=\"flex-1 mt-6 md:mt-0\">\n                        <form onSubmit={(e) => e.preventDefault()} className=\"flex items-center gap-x-3 md:justify-end\">\n                            <div className=\"relative\">\n                                <svg className=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                                    <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n                                </svg>\n                                <input\n                                    type=\"email\"\n                                    required\n                                    placeholder=\"Enter your email\"\n                                    className=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n                                />\n                            </div>\n                            <button className=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n                                Subscribe\n                            </button>\n                        </form>\n                    </div>\n                </div>\n                <div className=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4 text-gray-600\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-semibold sm:pb-2\">\n                                    {item.label}\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a\n                                                href={el.href}\n                                                className=\"hover:text-gray-800 duration-150\"\n\n                                            >\n                                                {el.name}\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p className=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n                    <div className=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                        <a href=\"javascript:void()\">\n                            <svg className=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n                        </a>\n                    </div>\n                </div>\n            </div>\n        </footer>\n    )\n}","label":"App.jsx"}]},"svelte":{"svelteTail":[{"label":"App.svelte","code":"<script>\n  let footerNavs = [\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Documentation'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        },\n        {\n            label: \"Explore\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Showcase'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Roadmap'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Languages'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n            ]\n        },\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        }\n  ];\n</script>\n\n<footer class=\"pt-10\">\n  <div class=\" px-4 md:px-8\">\n    <div class=\"justify-between items-center gap-12 md:flex\">\n      <div class=\"flex-1 max-w-lg\">\n        <h3 class=\"text-2xl font-bold\">\n          Get our beautiful newsletter straight to your inbox.\n        </h3>\n      </div>\n      <div class=\"flex-1 mt-6 md:mt-0\">\n        <form on:submit|preventDefault>\n          <div class=\"relative\">\n            <svg class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\" xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" strokeWidth={1.5} stroke=\"currentColor\">\n                <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\" />\n            </svg>\n            <input\n              type=\"email\"\n              required\n              placeholder=\"Enter your email\"\n              class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n            />\n          </div>\n          <button class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\">\n            Subscribe\n          </button>\n        </form>\n      </div>\n    </div>\n    <div class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\">\n      {#each footerNavs as item}\n        <ul class=\"space-y-4 text-gray-600\">\n          <h4 class=\"text-gray-800 font-semibold sm:pb-2\">\n            {item.label}\n          </h4>\n          {#each item.items as el}\n            <li>\n              <a href={el.href} class=\"hover:text-gray-800 duration-150\">\n                {el.name}\n              </a>\n            </li>\n          {/each}\n        </ul>\n      {/each}\n    </div>\n    <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n      <p class=\"text-gray-600\">© 2022 Float UI Inc. All rights reserved.</p>\n      <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n          <a href=\"javascript:void()\">\n              <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n          </a>\n      </div>\n    </div>\n</footer>"}]},"html":{"htmlTail":[{"code":"<div\n  x-data=\"{\n  footerNavs: [\n  {\n    label: 'Resources',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'contact'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Support'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Documentation'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Pricing'\n        },\n    ],\n},\n{\n    label: 'About',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About US'\n        },\n    ]\n},\n{\n    label: 'Explore',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Showcase'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Roadmap'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Languages'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Blog'\n        },\n    ]\n},\n{\n    label: 'Company',\n    items: [\n        {\n            href: 'javascript:void()',\n            name: 'Partners'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Team'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Careers'\n        },\n    ],\n}\n  ]\n}\"\n>\n  <footer class=\"pt-10\">\n    <div class=\" px-4 md:px-8\">\n      <div class=\"justify-between items-center gap-12 md:flex\">\n        <div class=\"flex-1 max-w-lg\">\n          <h3 class=\"text-2xl font-bold\">\n            Get our beautiful newsletter straight to your inbox.\n          </h3>\n        </div>\n        <div class=\"flex-1 mt-6 md:mt-0\">\n          <form\n            @submit.prevent=\"null\"\n            class=\"flex items-center gap-x-3 md:justify-end\"\n          >\n            <div class=\"relative\">\n              <svg\n                class=\"w-6 h-6 text-gray-400 absolute left-3 inset-y-0 my-auto\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                strokeWidth=\"{1.5}\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  d=\"M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75\"\n                />\n              </svg>\n              <input\n                type=\"email\"\n                required\n                placeholder=\"Enter your email\"\n                class=\"w-full pl-12 pr-3 py-2 text-gray-500 bg-white outline-none border focus:border-indigo-600 shadow-sm rounded-lg\"\n              />\n            </div>\n            <button\n              class=\"block w-auto py-3 px-4 font-medium text-sm text-center text-white bg-indigo-600 hover:bg-indigo-500 active:bg-indigo-700 active:shadow-none rounded-lg shadow\"\n            >\n              Subscribe\n            </button>\n          </form>\n        </div>\n      </div>\n      <div\n        class=\"flex-1 mt-16 space-y-6 justify-between sm:flex md:space-y-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4 text-gray-600\">\n            <h4\n              class=\"text-gray-800 font-semibold sm:pb-2\"\n              x-text=\"item.label\"\n            ></h4>\n            <template x-for=\"(el, elIdx) in item.items\" :key=\"elIdx\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"hover:text-gray-800 duration-150\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n      <div\n        class=\"mt-10 py-10 border-t items-center justify-between sm:flex\"\n      >\n        <p class=\"text-gray-600\">\n          © 2022 Float UI Inc. All rights reserved.\n        </p>\n        <div class=\"flex items-center gap-x-6 text-gray-400 mt-6\">\n          <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#a)\"><path fill=\"currentColor\" d=\"M48 24C48 10.745 37.255 0 24 0S0 10.745 0 24c0 11.979 8.776 21.908 20.25 23.708v-16.77h-6.094V24h6.094v-5.288c0-6.014 3.583-9.337 9.065-9.337 2.625 0 5.372.469 5.372.469v5.906h-3.026c-2.981 0-3.911 1.85-3.911 3.75V24h6.656l-1.064 6.938H27.75v16.77C39.224 45.908 48 35.978 48 24z\" /></g><defs><clipPath id=\"a\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_80)\"><path fill=\"currentColor\" d=\"M15.1 43.5c18.11 0 28.017-15.006 28.017-28.016 0-.422-.01-.853-.029-1.275A19.998 19.998 0 0048 9.11c-1.795.798-3.7 1.32-5.652 1.546a9.9 9.9 0 004.33-5.445 19.794 19.794 0 01-6.251 2.39 9.86 9.86 0 00-16.788 8.979A27.97 27.97 0 013.346 6.299 9.859 9.859 0 006.393 19.44a9.86 9.86 0 01-4.462-1.228v.122a9.844 9.844 0 007.901 9.656 9.788 9.788 0 01-4.442.169 9.867 9.867 0 009.195 6.843A19.75 19.75 0 010 39.078 27.937 27.937 0 0015.1 43.5z\" /></g><defs><clipPath id=\"clip0_17_80\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"none\" viewBox=\"0 0 48 48\"><g fill=\"currentColor\" clip-path=\"url(#clip0_910_44)\"><path fill-rule=\"evenodd\" d=\"M24 1A24.086 24.086 0 008.454 6.693 23.834 23.834 0 00.319 21.044a23.754 23.754 0 003.153 16.172 23.98 23.98 0 0012.938 10.29c1.192.221 1.641-.518 1.641-1.146 0-.628-.024-2.45-.032-4.442-6.676 1.443-8.087-2.817-8.087-2.817-1.089-2.766-2.663-3.493-2.663-3.493-2.178-1.478.163-1.45.163-1.45 2.413.17 3.68 2.461 3.68 2.461 2.138 3.648 5.616 2.593 6.983 1.976.215-1.545.838-2.596 1.526-3.193-5.333-.6-10.937-2.647-10.937-11.791a9.213 9.213 0 012.472-6.406c-.246-.6-1.069-3.026.234-6.322 0 0 2.015-.64 6.602 2.446a22.904 22.904 0 0112.017 0c4.583-3.086 6.594-2.446 6.594-2.446 1.307 3.288.484 5.714.238 6.322a9.194 9.194 0 012.476 6.414c0 9.163-5.615 11.183-10.957 11.772.859.742 1.626 2.193 1.626 4.421 0 3.193-.028 5.762-.028 6.548 0 .636.433 1.38 1.65 1.146a23.98 23.98 0 0012.938-10.291 23.754 23.754 0 003.151-16.175A23.834 23.834 0 0039.56 6.69 24.086 24.086 0 0024.009 1H24z\" clip-rule=\"evenodd\" /><path d=\"M9.089 35.264c-.052.119-.243.154-.398.071-.155-.083-.27-.237-.214-.36.056-.122.242-.154.397-.07.155.082.274.24.215.359zM10.063 36.343a.4.4 0 01-.493-.11c-.155-.167-.187-.396-.068-.499.12-.102.334-.055.489.11.155.167.19.396.072.499zM11.008 37.714c-.147.103-.397 0-.536-.206a.395.395 0 010-.569c.147-.098.397 0 .537.202.139.202.143.47 0 .573zM12.292 39.042c-.131.146-.397.106-.616-.091-.219-.198-.27-.467-.139-.609.131-.142.397-.102.624.091.226.194.27.466.131.609zM14.092 39.816c-.06.186-.33.269-.6.19-.27-.08-.449-.3-.397-.49.051-.19.326-.277.6-.19.274.087.449.297.397.49zM16.056 39.95c0 .194-.223.36-.509.364-.286.004-.52-.154-.52-.348 0-.193.222-.36.508-.363.286-.004.52.15.52.347zM17.884 39.646c.036.194-.163.395-.45.443-.285.047-.536-.067-.572-.257-.035-.19.171-.395.45-.447.278-.05.536.068.572.261z\" /></g><defs><clipPath id=\"clip0_910_44\"><path fill=\"#fff\" d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        <a href=\"javascript:void()\">\n            <svg class=\"w-6 h-6 hover:text-gray-500 duration-150\" fill=\"currentColor\" viewBox=\"0 0 48 48\"><g clip-path=\"url(#clip0_17_63)\"><path d=\"M24 4.322c6.413 0 7.172.028 9.694.14 2.343.104 3.61.497 4.453.825 1.116.432 1.922.957 2.756 1.791.844.844 1.36 1.64 1.79 2.756.329.844.723 2.12.826 4.454.112 2.53.14 3.29.14 9.693 0 6.413-.028 7.172-.14 9.694-.103 2.344-.497 3.61-.825 4.453-.431 1.116-.957 1.922-1.79 2.756-.845.844-1.642 1.36-2.757 1.791-.844.328-2.119.722-4.453.825-2.532.112-3.29.14-9.694.14-6.413 0-7.172-.028-9.694-.14-2.343-.103-3.61-.497-4.453-.825-1.115-.431-1.922-.956-2.756-1.79-.844-.844-1.36-1.641-1.79-2.757-.329-.844-.723-2.119-.826-4.453-.112-2.531-.14-3.29-.14-9.694 0-6.412.028-7.172.14-9.694.103-2.343.497-3.609.825-4.453.431-1.115.957-1.921 1.79-2.756.845-.844 1.642-1.36 2.757-1.79.844-.329 2.119-.722 4.453-.825 2.522-.113 3.281-.141 9.694-.141zM24 0c-6.516 0-7.331.028-9.89.14-2.55.113-4.304.526-5.822 1.116-1.585.619-2.926 1.435-4.257 2.775-1.34 1.332-2.156 2.672-2.775 4.247C.666 9.806.253 11.55.141 14.1.028 16.669 0 17.484 0 24s.028 7.331.14 9.89c.113 2.55.526 4.304 1.116 5.822.619 1.585 1.435 2.925 2.775 4.257a11.732 11.732 0 004.247 2.765c1.528.591 3.272 1.003 5.822 1.116 2.56.112 3.375.14 9.89.14 6.516 0 7.332-.028 9.891-.14 2.55-.113 4.303-.525 5.822-1.116a11.732 11.732 0 004.247-2.765 11.732 11.732 0 002.766-4.247c.59-1.528 1.003-3.272 1.115-5.822.113-2.56.14-3.375.14-9.89 0-6.516-.027-7.332-.14-9.891-.112-2.55-.525-4.303-1.115-5.822-.591-1.594-1.407-2.935-2.747-4.266a11.732 11.732 0 00-4.247-2.765C38.194.675 36.45.262 33.9.15 31.331.028 30.516 0 24 0z\" /><path d=\"M24 11.672c-6.806 0-12.328 5.522-12.328 12.328 0 6.806 5.522 12.328 12.328 12.328 6.806 0 12.328-5.522 12.328-12.328 0-6.806-5.522-12.328-12.328-12.328zm0 20.325a7.998 7.998 0 010-15.994 7.998 7.998 0 010 15.994zM39.694 11.184a2.879 2.879 0 11-2.878-2.878 2.885 2.885 0 012.878 2.878z\" /></g><defs><clipPath id=\"clip0_17_63\"><path d=\"M0 0h48v48H0z\" /></clipPath></defs></svg>\n        </a>\n        </div>\n      </div>\n    </div>\n  </footer>\n</div>","label":"index.html"}]}}
 slug: /footers
 id: 7aeee21e-9a06-4725-a391-3477ba81914f
 created_at: 1670155621546
diff --git a/componentsDB/footers/footers-4f697cf07807.mdx b/componentsDB/footers/footers-4f697cf07807.mdx
index d92e312..a434cad 100644
--- a/componentsDB/footers/footers-4f697cf07807.mdx
+++ b/componentsDB/footers/footers-4f697cf07807.mdx
@@ -3,7 +3,7 @@ title: Footer with description and title
 category: Marketing
 paid: false
 isActive: true
-ltr: {"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n                <div className=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                    <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                    <p>\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <div className=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                        <a href=\"javascript:void(0)\" className=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                            Let's get started\n                        </a>\n                        <a href=\"javascript:void(0)\" className=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                            Get access\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                            </svg>\n                        </a>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                    <ul className=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                        {\n                            footerNavs.map((item, idx) => (\n                                <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                    <a key={idx} href={item.href}>\n                                        {item.name}\n                                    </a>\n                                </li>\n                            ))\n                        }\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}"}]},"vue":{"vueCss":[],"vueTail":[{"code":"<template>\n  <div>\n    <footer class=\"pt-10\">\n      <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n        <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n          <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n          <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n            <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n              Let's get started\n            </a>\n            <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                Get access\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                    <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                </svg>\n            </a>\n          </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n          <p>© 2022 Float UI Inc. All rights reserved.</p>\n          <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n            <li v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"text-gray-800 hover:text-gray-500 duration-150\">\n              <a :href=\"item.href\">{{ item.name }}</a>\n            </li>\n          </ul>\n        </div>\n      </div>\n    </footer>\n  </div>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        { href: 'javascript:void()', name: 'Terms' },\n        { href: 'javascript:void()', name: 'License' },\n        { href: 'javascript:void()', name: 'Privacy' },\n        { href: 'javascript:void()', name: 'About us' }\n      ]\n    };\n  }\n}\n</script>","label":"App.vue"}]},"html":{"htmlTail":[{"label":"index.html","code":"<div x-data=\"{ footerNavs: [\n    { href: 'javascript:void()', name: 'Terms' },\n    { href: 'javascript:void()', name: 'License' },\n    { href: 'javascript:void()', name: 'Privacy' },\n    { href: 'javascript:void()', name: 'About us' }\n]}\">\n    <footer class=\"pt-10\">\n        <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n            <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n                <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n                <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                    <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                        Let's get started\n                    </a>\n                    <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                        Get access\n                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                            <path fill-rule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clip-rule=\"evenodd\" />\n                        </svg>\n                    </a>\n                </div>\n            </div>\n            <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                <p>© 2022 Float UI Inc. All rights reserved.</p>\n                <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                    <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n                        <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                            <a x-bind:href=\"item.href\" x-text=\"item.name\"></a>\n                        </li>\n                    </template>\n                </ul>\n            </div>\n        </div>\n    </footer>\n</div>"}]},"svelte":{"svelteTail":[{"code":"<script>\n    const footerNavs = [\n        { href: 'javascript:void()', name: 'Terms' },\n        { href: 'javascript:void()', name: 'License' },\n        { href: 'javascript:void()', name: 'Privacy' },\n        { href: 'javascript:void()', name: 'About us' }\n    ];\n</script>\n\n<footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n        <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n            <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n            <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n            <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                    Let's get started\n                </a>\n                <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                    Get access\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                        <path fill-rule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clip-rule=\"evenodd\" />\n                    </svg>\n                </a>\n            </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n            <p>© 2022 Float UI Inc. All rights reserved.</p>\n            <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                {#each footerNavs as item (item.name)}\n                    <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                        <a href={item.href}>{item.name}</a>\n                    </li>\n                {/each}\n            </ul>\n        </div>\n    </div>\n</footer>","label":"App.svelte"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n                <div className=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                    <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                    <p>\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <div className=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                        <a href=\"javascript:void(0)\" className=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                            Let's get started\n                        </a>\n                        <a href=\"javascript:void(0)\" className=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                            Get access\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                            </svg>\n                        </a>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                    <ul className=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                        {\n                            footerNavs.map((item, idx) => (\n                                <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                    <a key={idx} href={item.href}>\n                                        {item.name}\n                                    </a>\n                                </li>\n                            ))\n                        }\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}"}
+ltr: {"react":{"jsxCss":[],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\" px-4 text-gray-600 md:px-8\">\n                <div className=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                    <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                    <p>\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <div className=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                        <a href=\"javascript:void(0)\" className=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                            Let's get started\n                        </a>\n                        <a href=\"javascript:void(0)\" className=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                            Get access\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                            </svg>\n                        </a>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                    <ul className=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                        {\n                            footerNavs.map((item, idx) => (\n                                <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                    <a key={idx} href={item.href}>\n                                        {item.name}\n                                    </a>\n                                </li>\n                            ))\n                        }\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}"}]},"vue":{"vueCss":[],"vueTail":[{"code":"<template>\n  <div>\n    <footer class=\"pt-10\">\n      <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n        <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n          <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n          <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n            <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n              Let's get started\n            </a>\n            <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                Get access\n                <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                    <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                </svg>\n            </a>\n          </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n          <p>© 2022 Float UI Inc. All rights reserved.</p>\n          <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n            <li v-for=\"(item, idx) in footerNavs\" :key=\"idx\" class=\"text-gray-800 hover:text-gray-500 duration-150\">\n              <a :href=\"item.href\">{{ item.name }}</a>\n            </li>\n          </ul>\n        </div>\n      </div>\n    </footer>\n  </div>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        { href: 'javascript:void()', name: 'Terms' },\n        { href: 'javascript:void()', name: 'License' },\n        { href: 'javascript:void()', name: 'Privacy' },\n        { href: 'javascript:void()', name: 'About us' }\n      ]\n    };\n  }\n}\n</script>","label":"App.vue"}]},"html":{"htmlTail":[{"label":"index.html","code":"<div x-data=\"{ footerNavs: [\n    { href: 'javascript:void()', name: 'Terms' },\n    { href: 'javascript:void()', name: 'License' },\n    { href: 'javascript:void()', name: 'Privacy' },\n    { href: 'javascript:void()', name: 'About us' }\n]}\">\n    <footer class=\"pt-10\">\n        <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n            <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n                <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n                <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                    <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                        Let's get started\n                    </a>\n                    <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                        Get access\n                        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                            <path fill-rule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clip-rule=\"evenodd\" />\n                        </svg>\n                    </a>\n                </div>\n            </div>\n            <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                <p>© 2022 Float UI Inc. All rights reserved.</p>\n                <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                    <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n                        <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                            <a x-bind:href=\"item.href\" x-text=\"item.name\"></a>\n                        </li>\n                    </template>\n                </ul>\n            </div>\n        </div>\n    </footer>\n</div>"}]},"svelte":{"svelteTail":[{"code":"<script>\n    const footerNavs = [\n        { href: 'javascript:void()', name: 'Terms' },\n        { href: 'javascript:void()', name: 'License' },\n        { href: 'javascript:void()', name: 'Privacy' },\n        { href: 'javascript:void()', name: 'About us' }\n    ];\n</script>\n\n<footer class=\"pt-10\">\n    <div class=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n        <div class=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n            <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32 sm:mx-auto\" />\n            <p>Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.</p>\n            <div class=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                <a href=\"javascript:void(0)\" class=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                    Let's get started\n                </a>\n                <a href=\"javascript:void(0)\" class=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                    Get access\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" class=\"w-5 h-5\">\n                        <path fill-rule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clip-rule=\"evenodd\" />\n                    </svg>\n                </a>\n            </div>\n        </div>\n        <div class=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n            <p>© 2022 Float UI Inc. All rights reserved.</p>\n            <ul class=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                {#each footerNavs as item (item.name)}\n                    <li class=\"text-gray-800 hover:text-gray-500 duration-150\">\n                        <a href={item.href}>{item.name}</a>\n                    </li>\n                {/each}\n            </ul>\n        </div>\n    </div>\n</footer>","label":"App.svelte"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            href: 'javascript:void()',\n            name: 'Terms'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'License'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'Privacy'\n        },\n        {\n            href: 'javascript:void()',\n            name: 'About us'\n        }\n    ]\n    return (\n        <footer className=\"pt-10\">\n            <div className=\"max-w-screen-xl mx-auto px-4 text-gray-600 md:px-8\">\n                <div className=\"space-y-6 sm:max-w-md sm:mx-auto sm:text-center\">\n                    <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32 sm:mx-auto\" />\n                    <p>\n                        Nulla auctor metus vitae lectus iaculis, vel euismod massa efficitur.\n                    </p>\n                    <div className=\"items-center gap-x-3 space-y-3 sm:flex sm:justify-center sm:space-y-0\">\n                        <a href=\"javascript:void(0)\" className=\"block py-2 px-4 text-center text-white font-medium bg-indigo-600 duration-150 hover:bg-indigo-500 active:bg-indigo-700 rounded-lg shadow-lg hover:shadow-none\">\n                            Let's get started\n                        </a>\n                        <a href=\"javascript:void(0)\" className=\"flex items-center justify-center gap-x-2 py-2 px-4 text-gray-700 hover:text-gray-500 font-medium duration-150 active:bg-gray-100 border rounded-lg md:inline-flex\">\n                            Get access\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" className=\"w-5 h-5\">\n                                <path fillRule=\"evenodd\" d=\"M2 10a.75.75 0 01.75-.75h12.59l-2.1-1.95a.75.75 0 111.02-1.1l3.5 3.25a.75.75 0 010 1.1l-3.5 3.25a.75.75 0 11-1.02-1.1l2.1-1.95H2.75A.75.75 0 012 10z\" clipRule=\"evenodd\" />\n                            </svg>\n                        </a>\n                    </div>\n                </div>\n                <div className=\"mt-10 py-10 border-t items-center justify-between sm:flex\">\n                    <p>© 2022 Float UI Inc. All rights reserved.</p>\n                    <ul className=\"flex flex-wrap items-center gap-4 mt-6 sm:text-sm sm:mt-0\">\n                        {\n                            footerNavs.map((item, idx) => (\n                                <li className=\"text-gray-800 hover:text-gray-500 duration-150\">\n                                    <a key={idx} href={item.href}>\n                                        {item.name}\n                                    </a>\n                                </li>\n                            ))\n                        }\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}"}
 slug: /footers
 id: dad2c486-a5f0-4f92-8e7b-4f697cf07807
 created_at: 1670156556401
diff --git a/componentsDB/footers/footers-7adb1d10aa04.mdx b/componentsDB/footers/footers-7adb1d10aa04.mdx
index e8f9d56..6c42472 100644
--- a/componentsDB/footers/footers-7adb1d10aa04.mdx
+++ b/componentsDB/footers/footers-7adb1d10aa04.mdx
@@ -3,7 +3,7 @@ title: Secondary Footer
 category: Marketing
 paid: false
 isActive: true
-ltr: {"svelte":{"svelteTail":[{"code":"<script>\n  let footerNavs = [\n    {\n      label: \"Company\",\n      items: [\n        { href: 'javascript:void(0)', name: 'Partners' },\n        { href: 'javascript:void(0)', name: 'Blog' },\n        { href: 'javascript:void(0)', name: 'Team' },\n        { href: 'javascript:void(0)', name: 'Careers' },\n      ],\n    },\n    {\n      label: \"Resources\",\n      items: [\n        { href: 'javascript:void(0)', name: 'contact' },\n        { href: 'javascript:void(0)', name: 'Support' },\n        { href: 'javascript:void(0)', name: 'Docs' },\n        { href: 'javascript:void(0)', name: 'Pricing' },\n      ],\n    },\n    {\n      label: \"About\",\n      items: [\n        { href: 'javascript:void(0)', name: 'Terms' },\n        { href: 'javascript:void(0)', name: 'License' },\n        { href: 'javascript:void(0)', name: 'Privacy' },\n        { href: 'javascript:void(0)', name: 'About US' },\n      ],\n    },\n  ];\n\n  function handleFormSubmit(event) {\n    event.preventDefault();\n    // Handle the form submission here\n  }\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n  <div class=\"gap-6 justify-between md:flex\">\n    <div class=\"flex-1\">\n      <div class=\"max-w-xs\">\n        <!-- Place for SVG -->\n        <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" alt=\"Logo\"/>\n        <p class=\"leading-relaxed mt-2 text-[15px]\">\n          Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n        </p>\n      </div>\n      <form on:submit={handleFormSubmit}>\n        <label class=\"block pt-4 pb-2\">Stay up to date</label>\n        <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n          <input type=\"email\" placeholder=\"Enter your email\" class=\"w-full p-2.5 outline-none\"/>\n          <button class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\">\n            Subscribe\n          </button>\n        </div>\n      </form>\n    </div>\n    <div class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n      {#each footerNavs as nav, index}\n        <ul class=\"space-y-4\">\n          <h4 class=\"text-gray-800 font-medium\">{nav.label}</h4>\n          {#each nav.items as item, idx}\n            <li>\n              <a href={item.href} class=\"hover:underline hover:text-indigo-600\">{item.name}</a>\n            </li>\n          {/each}\n        </ul>\n      {/each}\n    </div>\n  </div>\n  <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>","label":"App.svelte"}]},"vue":{"vueTail":[{"label":"App.vue","code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n    <div class=\"gap-6 justify-between md:flex\">\n      <div class=\"flex-1\">\n        <div class=\"max-w-xs\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"leading-relaxed mt-2 text-[15px]\">\n            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n          </p>\n        </div>\n        <form @submit.prevent>\n          <label class=\"block pt-4 pb-2\">Stay up to date</label>\n          <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n            <input\n              type=\"email\"\n              placeholder=\"Enter your email\"\n              class=\"w-full p-2.5 outline-none\"\n            />\n            <button\n              class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n            >\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n        <ul\n          v-for=\"(item, index) in footerNavs\"\n          :key=\"index\"\n          class=\"space-y-4\"\n        >\n          <h4 class=\"text-gray-800 font-medium\">{{ item.label }}</h4>\n          <li\n            v-for=\"(el, idx) in item.items\"\n            :key=\"idx\"\n          >\n            <a\n              :href=\"el.href\"\n              class=\"hover:underline hover:text-indigo-600\"\n            >\n              {{ el.name }}\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n          label: \"Company\",\n          items: [\n            { href: 'javascript:void()', name: 'Partners' },\n            { href: 'javascript:void()', name: 'Blog' },\n            { href: 'javascript:void()', name: 'Team' },\n            { href: 'javascript:void()', name: 'Careers' },\n          ],\n        },\n        {\n          label: \"Resources\",\n          items: [\n            { href: 'javascript:void()', name: 'contact' },\n            { href: 'javascript:void()', name: 'Support' },\n            { href: 'javascript:void()', name: 'Docs' },\n            { href: 'javascript:void()', name: 'Pricing' },\n          ],\n        },\n        {\n          label: \"About\",\n          items: [\n            { href: 'javascript:void()', name: 'Terms' },\n            { href: 'javascript:void()', name: 'License' },\n            { href: 'javascript:void()', name: 'Privacy' },\n            { href: 'javascript:void()', name: 'About US' },\n          ],\n        },\n      ],\n    };\n  },\n};\n</script>\n\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-secondary\">\n    <div class=\"footer-container\">\n      <div class=\"newsletter\">\n        <div class=\"brand\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p>\n            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n          </p>\n        </div>\n        <form class=\"form\">\n          <label>\n            Stay up to date\n          </label>\n          <div class=\"form-field\">\n            <input type=\"email\" placeholder=\"Enter your email\"/>\n            <button class=\"btn\">\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div class=\"items-container\">\n        <ul class=\"ul-list\" v-for=\"item in footerNavs\" :key=\"item.id\">\n          <h4>\n            {{ item.label }}\n          </h4>\n          <li v-for=\"item in item.items\" :key=\"item.id\">\n            <a href=\"{{item.href}}\" class=\"link\">\n              {{ item.name }}\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          label: \"Company\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'Partners'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Blog'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Team'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Careers'\n            },\n          ],\n        },\n        {\n          label: \"Resources\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'contact'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Support'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Docs'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Pricing'\n            },\n          ],\n        },\n        {\n          label: \"About\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'Terms'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'License'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Privacy'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'About US'\n            },\n          ]\n        }\n      ]\n    }\n  },\n}\n</script>"},{"label":"style.css","code":".footer-secondary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-secondary .footer-container {\n  gap: 1.5rem;\n  justify-content: space-between;\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container {\n    display: flex;\n  }\n}\n.footer-secondary .footer-container .newsletter {\n  flex: 1;\n}\n.footer-secondary .footer-container .newsletter .brand {\n  max-width: 20rem;\n}\n.footer-secondary .footer-container .newsletter .brand img {\n  width: 8rem;\n}\n.footer-secondary .footer-container .newsletter .brand p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-secondary .footer-container .newsletter .form label {\n  display: block;\n  padding-top: 1rem;\n  padding-bottom: 0.5rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field {\n  max-width: 24rem;\n  display: flex;\n  align-items: center;\n  border: solid 1px #e5e7eb;\n  border-radius: 0.375rem;\n  padding: 0.25rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field input {\n  width: 100%;\n  padding: 0.625rem;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn {\n  padding: 0.625rem;\n  border-radius: 0.375rem;\n  box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;\n  color: #FFF;\n  background-color: #4f46e5;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn:focus {\n  box-shadow: none;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .newsletter .form .form-field .btn {\n    padding: 0.625rem 1.25rem 0.625rem 1.25rem;\n  }\n}\n.footer-secondary .footer-container .items-container {\n  flex: 1;\n  margin-top: 2.5rem;\n}\n.footer-secondary .footer-container .items-container > * + * {\n  margin-top: 1.5rem;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .items-container {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container .items-container {\n    margin-top: 0px;\n  }\n  .footer-secondary .footer-container .items-container > * + * {\n    margin-top: 0px;\n  }\n}\n.footer-secondary .footer-container .items-container .ul-list > * + * {\n  margin-top: 1rem;\n}\n.footer-secondary .footer-container .items-container .ul-list h4 {\n  color: #1f2937;\n  font-weight: 500;\n}\n.footer-secondary .footer-container .items-container .ul-list li .link:hover {\n  text-decoration: underline;\n  color: #4f46e5;\n}\n.footer-secondary .copyright-slmedia {\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n  border-top: solid 1px #e5e7eb;\n}\n.footer-secondary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-secondary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-secondary .copyright-slmedia .copyright, .footer-secondary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}"}]},"html":{"htmlTail":[{"label":"index.html","code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\"\n  >\n    <div class=\"gap-6 justify-between md:flex\">\n      <div class=\"flex-1\">\n        <div class=\"max-w-xs\">\n          <!-- SVG Logo placement -->\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"leading-relaxed mt-2 text-[15px]\">\n            Lorem Ipsum has been the industry's standard dummy text ever\n            since the 1500s.\n          </p>\n        </div>\n        <form x-on:submit.prevent=\"handleSubmit\">\n          <label class=\"block pt-4 pb-2\"> Stay up to date </label>\n          <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n            <input\n              type=\"email\"\n              placeholder=\"Enter your email\"\n              class=\"w-full p-2.5 outline-none\"\n            />\n            <button\n              class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n            >\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div\n        class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4\">\n            <h4 class=\"text-gray-800 font-medium\" x-text=\"item.label\"></h4>\n            <template x-for=\"(el, idx2) in item.items\" :key=\"idx2\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"hover:underline hover:text-indigo-600\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n    </div>\n    <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n\n  <style>\n    .svg-icon path,\n    .svg-icon polygon,\n    .svg-icon rect {\n      fill: currentColor;\n    }\n  </style>\n\n  <script>\n    function footerComponent() {\n      return {\n        footerNavs: [\n          {\n            label: \"Company\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"Partners\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Blog\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Team\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Careers\",\n              },\n            ],\n          },\n          {\n            label: \"Resources\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"contact\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Support\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Docs\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Pricing\",\n              },\n            ],\n          },\n          {\n            label: \"About\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"Terms\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"License\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Privacy\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"About US\",\n              },\n            ],\n          },\n        ],\n      };\n    }\n  </script>\n</div>"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n            <div className=\"gap-6 justify-between md:flex\">\n                <div className=\"flex-1\">\n                    <div className=\"max-w-xs\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"leading-relaxed mt-2 text-[15px]\">\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form \n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label className=\"block pt-4 pb-2\">\n                            Stay up to date\n                        </label>\n                        <div className=\"max-w-sm flex items-center border rounded-md p-1\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                                className=\"w-full p-2.5 outline-none\"\n                            />\n                            <button\n                                className=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-medium\">\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a \n                                                href={el.href}\n                                                className=\"hover:underline hover:text-indigo-600\"\n                                            \n                                            >\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"footer-secondary\">\n            <div className=\"footer-container\">\n                <div className=\"newsletter\">\n                    <div className=\"brand\">\n                        <img src=\"https://www.floatui.com/logo.svg\" />\n                        <p>\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form\n                        className=\"form\"\n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label>\n                            Stay up to date\n                        </label>\n                        <div className=\"form-field\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                            />\n                            <button\n                                className=\"btn\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"items-container\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"ul-list\"\n                                key={idx}\n                            >\n                                <h4>\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li\n                                            key={idx}>\n                                            <a className=\"link\" href={el.href}>\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-secondary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-secondary .footer-container {\n  gap: 1.5rem;\n  justify-content: space-between;\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container {\n    display: flex;\n  }\n}\n.footer-secondary .footer-container .newsletter {\n  flex: 1;\n}\n.footer-secondary .footer-container .newsletter .brand {\n  max-width: 20rem;\n}\n.footer-secondary .footer-container .newsletter .brand img {\n  width: 8rem;\n}\n.footer-secondary .footer-container .newsletter .brand p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-secondary .footer-container .newsletter .form label {\n  display: block;\n  padding-top: 1rem;\n  padding-bottom: 0.5rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field {\n  max-width: 24rem;\n  display: flex;\n  align-items: center;\n  border: solid 1px #e5e7eb;\n  border-radius: 0.375rem;\n  padding: 0.25rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field input {\n  width: 100%;\n  padding: 0.625rem;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn {\n  padding: 0.625rem;\n  border-radius: 0.375rem;\n  box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;\n  color: #FFF;\n  background-color: #4f46e5;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn:focus {\n  box-shadow: none;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .newsletter .form .form-field .btn {\n    padding: 0.625rem 1.25rem 0.625rem 1.25rem;\n  }\n}\n.footer-secondary .footer-container .items-container {\n  flex: 1;\n  margin-top: 2.5rem;\n}\n.footer-secondary .footer-container .items-container > * + * {\n  margin-top: 1.5rem;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .items-container {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container .items-container {\n    margin-top: 0px;\n  }\n  .footer-secondary .footer-container .items-container > * + * {\n    margin-top: 0px;\n  }\n}\n.footer-secondary .footer-container .items-container .ul-list > * + * {\n  margin-top: 1rem;\n}\n.footer-secondary .footer-container .items-container .ul-list h4 {\n  color: #1f2937;\n  font-weight: 500;\n}\n.footer-secondary .footer-container .items-container .ul-list li .link:hover {\n  text-decoration: underline;\n  color: #4f46e5;\n}\n.footer-secondary .copyright-slmedia {\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n  border-top: solid 1px #e5e7eb;\n}\n.footer-secondary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-secondary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-secondary .copyright-slmedia .copyright, .footer-secondary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5 max-w-screen-xl mx-auto md:px-8\">\n            <div className=\"gap-6 justify-between md:flex\">\n                <div className=\"flex-1\">\n                    <div className=\"max-w-xs\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"leading-relaxed mt-2 text-[15px]\">\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form \n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label className=\"block pt-4 pb-2\">\n                            Stay up to date\n                        </label>\n                        <div className=\"max-w-sm flex items-center border rounded-md p-1\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                                className=\"w-full p-2.5 outline-none\"\n                            />\n                            <button\n                                className=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-medium\">\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a \n                                                href={el.href}\n                                                className=\"hover:underline hover:text-indigo-600\"\n                                            \n                                            >\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n"}]}}
+ltr: {"svelte":{"svelteTail":[{"code":"<script>\n  let footerNavs = [\n    {\n      label: \"Company\",\n      items: [\n        { href: 'javascript:void(0)', name: 'Partners' },\n        { href: 'javascript:void(0)', name: 'Blog' },\n        { href: 'javascript:void(0)', name: 'Team' },\n        { href: 'javascript:void(0)', name: 'Careers' },\n      ],\n    },\n    {\n      label: \"Resources\",\n      items: [\n        { href: 'javascript:void(0)', name: 'contact' },\n        { href: 'javascript:void(0)', name: 'Support' },\n        { href: 'javascript:void(0)', name: 'Docs' },\n        { href: 'javascript:void(0)', name: 'Pricing' },\n      ],\n    },\n    {\n      label: \"About\",\n      items: [\n        { href: 'javascript:void(0)', name: 'Terms' },\n        { href: 'javascript:void(0)', name: 'License' },\n        { href: 'javascript:void(0)', name: 'Privacy' },\n        { href: 'javascript:void(0)', name: 'About US' },\n      ],\n    },\n  ];\n\n  function handleFormSubmit(event) {\n    event.preventDefault();\n    // Handle the form submission here\n  }\n</script>\n\n<footer class=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n  <div class=\"gap-6 justify-between md:flex\">\n    <div class=\"flex-1\">\n      <div class=\"max-w-xs\">\n        <!-- Place for SVG -->\n        <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" alt=\"Logo\"/>\n        <p class=\"leading-relaxed mt-2 text-[15px]\">\n          Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n        </p>\n      </div>\n      <form on:submit={handleFormSubmit}>\n        <label class=\"block pt-4 pb-2\">Stay up to date</label>\n        <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n          <input type=\"email\" placeholder=\"Enter your email\" class=\"w-full p-2.5 outline-none\"/>\n          <button class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\">\n            Subscribe\n          </button>\n        </div>\n      </form>\n    </div>\n    <div class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n      {#each footerNavs as nav, index}\n        <ul class=\"space-y-4\">\n          <h4 class=\"text-gray-800 font-medium\">{nav.label}</h4>\n          {#each nav.items as item, idx}\n            <li>\n              <a href={item.href} class=\"hover:underline hover:text-indigo-600\">{item.name}</a>\n            </li>\n          {/each}\n        </ul>\n      {/each}\n    </div>\n  </div>\n  <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n    <div class=\"mt-4 sm:mt-0\">\n      &copy; 2022 Float UI All rights reserved.\n    </div>\n    <div class=\"mt-6 sm:mt-0\">\n      <ul class=\"flex items-center space-x-4\">\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-400\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-700\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-blue-500\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n\n        <li\n          class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n        >\n          <a href=\"javascript:void()\">\n            <svg\n              class=\"svg-icon w-6 h-6 text-red-600\"\n              viewBox=\"0 0 20 20\"\n            >\n              <path\n                fill=\"none\"\n                d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n              ></path>\n            </svg>\n          </a>\n        </li>\n      </ul>\n    </div>\n  </div>\n</footer>\n\n<style>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n      fill: currentColor;\n  }\n</style>","label":"App.svelte"}]},"vue":{"vueTail":[{"label":"App.vue","code":"<template>\n  <footer class=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n    <div class=\"gap-6 justify-between md:flex\">\n      <div class=\"flex-1\">\n        <div class=\"max-w-xs\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"leading-relaxed mt-2 text-[15px]\">\n            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n          </p>\n        </div>\n        <form @submit.prevent>\n          <label class=\"block pt-4 pb-2\">Stay up to date</label>\n          <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n            <input\n              type=\"email\"\n              placeholder=\"Enter your email\"\n              class=\"w-full p-2.5 outline-none\"\n            />\n            <button\n              class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n            >\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n        <ul\n          v-for=\"(item, index) in footerNavs\"\n          :key=\"index\"\n          class=\"space-y-4\"\n        >\n          <h4 class=\"text-gray-800 font-medium\">{{ item.label }}</h4>\n          <li\n            v-for=\"(el, idx) in item.items\"\n            :key=\"idx\"\n          >\n            <a\n              :href=\"el.href\"\n              class=\"hover:underline hover:text-indigo-600\"\n            >\n              {{ el.name }}\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data() {\n    return {\n      footerNavs: [\n        {\n          label: \"Company\",\n          items: [\n            { href: 'javascript:void()', name: 'Partners' },\n            { href: 'javascript:void()', name: 'Blog' },\n            { href: 'javascript:void()', name: 'Team' },\n            { href: 'javascript:void()', name: 'Careers' },\n          ],\n        },\n        {\n          label: \"Resources\",\n          items: [\n            { href: 'javascript:void()', name: 'contact' },\n            { href: 'javascript:void()', name: 'Support' },\n            { href: 'javascript:void()', name: 'Docs' },\n            { href: 'javascript:void()', name: 'Pricing' },\n          ],\n        },\n        {\n          label: \"About\",\n          items: [\n            { href: 'javascript:void()', name: 'Terms' },\n            { href: 'javascript:void()', name: 'License' },\n            { href: 'javascript:void()', name: 'Privacy' },\n            { href: 'javascript:void()', name: 'About US' },\n          ],\n        },\n      ],\n    };\n  },\n};\n</script>\n\n<style scoped>\n  .svg-icon path,\n  .svg-icon polygon,\n  .svg-icon rect {\n    fill: currentColor;\n  }\n</style>\n"}],"vueCss":[{"label":"App.vue","code":"<template>\n  <footer class=\"footer-secondary\">\n    <div class=\"footer-container\">\n      <div class=\"newsletter\">\n        <div class=\"brand\">\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p>\n            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n          </p>\n        </div>\n        <form class=\"form\">\n          <label>\n            Stay up to date\n          </label>\n          <div class=\"form-field\">\n            <input type=\"email\" placeholder=\"Enter your email\"/>\n            <button class=\"btn\">\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div class=\"items-container\">\n        <ul class=\"ul-list\" v-for=\"item in footerNavs\" :key=\"item.id\">\n          <h4>\n            {{ item.label }}\n          </h4>\n          <li v-for=\"item in item.items\" :key=\"item.id\">\n            <a href=\"{{item.href}}\" class=\"link\">\n              {{ item.name }}\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n    <div class=\"copyright-slmedia\">\n      <div class=\"copyright\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"sl-media\">\n        <ul class=\"sl-media-list\">\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\">\n                </path>\n              </svg>\n            </a>\n          </li>\n\n          <li class=\"sl-media-icon\">\n            <a href=\"javascript:void()\">\n              <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                <path fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\">\n                </path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n</template>\n\n<script>\nexport default {\n  data: function () {\n    return {\n      footerNavs: [\n        {\n          label: \"Company\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'Partners'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Blog'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Team'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Careers'\n            },\n          ],\n        },\n        {\n          label: \"Resources\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'contact'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Support'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Docs'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Pricing'\n            },\n          ],\n        },\n        {\n          label: \"About\",\n          items: [\n            {\n              href: 'javascript:void()',\n              name: 'Terms'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'License'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'Privacy'\n            },\n            {\n              href: 'javascript:void()',\n              name: 'About US'\n            },\n          ]\n        }\n      ]\n    }\n  },\n}\n</script>"},{"label":"style.css","code":".footer-secondary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-secondary .footer-container {\n  gap: 1.5rem;\n  justify-content: space-between;\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container {\n    display: flex;\n  }\n}\n.footer-secondary .footer-container .newsletter {\n  flex: 1;\n}\n.footer-secondary .footer-container .newsletter .brand {\n  max-width: 20rem;\n}\n.footer-secondary .footer-container .newsletter .brand img {\n  width: 8rem;\n}\n.footer-secondary .footer-container .newsletter .brand p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-secondary .footer-container .newsletter .form label {\n  display: block;\n  padding-top: 1rem;\n  padding-bottom: 0.5rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field {\n  max-width: 24rem;\n  display: flex;\n  align-items: center;\n  border: solid 1px #e5e7eb;\n  border-radius: 0.375rem;\n  padding: 0.25rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field input {\n  width: 100%;\n  padding: 0.625rem;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn {\n  padding: 0.625rem;\n  border-radius: 0.375rem;\n  box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;\n  color: #FFF;\n  background-color: #4f46e5;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn:focus {\n  box-shadow: none;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .newsletter .form .form-field .btn {\n    padding: 0.625rem 1.25rem 0.625rem 1.25rem;\n  }\n}\n.footer-secondary .footer-container .items-container {\n  flex: 1;\n  margin-top: 2.5rem;\n}\n.footer-secondary .footer-container .items-container > * + * {\n  margin-top: 1.5rem;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .items-container {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container .items-container {\n    margin-top: 0px;\n  }\n  .footer-secondary .footer-container .items-container > * + * {\n    margin-top: 0px;\n  }\n}\n.footer-secondary .footer-container .items-container .ul-list > * + * {\n  margin-top: 1rem;\n}\n.footer-secondary .footer-container .items-container .ul-list h4 {\n  color: #1f2937;\n  font-weight: 500;\n}\n.footer-secondary .footer-container .items-container .ul-list li .link:hover {\n  text-decoration: underline;\n  color: #4f46e5;\n}\n.footer-secondary .copyright-slmedia {\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n  border-top: solid 1px #e5e7eb;\n}\n.footer-secondary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-secondary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-secondary .copyright-slmedia .copyright, .footer-secondary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}"}]},"html":{"htmlTail":[{"label":"index.html","code":"<div x-data=\"footerComponent()\">\n  <footer\n    class=\"text-gray-500 bg-white px-4 py-5  md:px-8\"\n  >\n    <div class=\"gap-6 justify-between md:flex\">\n      <div class=\"flex-1\">\n        <div class=\"max-w-xs\">\n          <!-- SVG Logo placement -->\n          <img src=\"https://www.floatui.com/logo.svg\" class=\"w-32\" />\n          <p class=\"leading-relaxed mt-2 text-[15px]\">\n            Lorem Ipsum has been the industry's standard dummy text ever\n            since the 1500s.\n          </p>\n        </div>\n        <form x-on:submit.prevent=\"handleSubmit\">\n          <label class=\"block pt-4 pb-2\"> Stay up to date </label>\n          <div class=\"max-w-sm flex items-center border rounded-md p-1\">\n            <input\n              type=\"email\"\n              placeholder=\"Enter your email\"\n              class=\"w-full p-2.5 outline-none\"\n            />\n            <button\n              class=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n            >\n              Subscribe\n            </button>\n          </div>\n        </form>\n      </div>\n      <div\n        class=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\"\n      >\n        <template x-for=\"(item, idx) in footerNavs\" :key=\"idx\">\n          <ul class=\"space-y-4\">\n            <h4 class=\"text-gray-800 font-medium\" x-text=\"item.label\"></h4>\n            <template x-for=\"(el, idx2) in item.items\" :key=\"idx2\">\n              <li>\n                <a\n                  :href=\"el.href\"\n                  class=\"hover:underline hover:text-indigo-600\"\n                  x-text=\"el.name\"\n                ></a>\n              </li>\n            </template>\n          </ul>\n        </template>\n      </div>\n    </div>\n    <div class=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n      <div class=\"mt-4 sm:mt-0\">\n        &copy; 2022 Float UI All rights reserved.\n      </div>\n      <div class=\"mt-6 sm:mt-0\">\n        <ul class=\"flex items-center space-x-4\">\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-400\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-700\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-blue-500\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n\n          <li\n            class=\"w-10 h-10 border rounded-full flex items-center justify-center\"\n          >\n            <a href=\"javascript:void()\">\n              <svg\n                class=\"svg-icon w-6 h-6 text-red-600\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fill=\"none\"\n                  d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"\n                ></path>\n              </svg>\n            </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  </footer>\n\n  <style>\n    .svg-icon path,\n    .svg-icon polygon,\n    .svg-icon rect {\n      fill: currentColor;\n    }\n  </style>\n\n  <script>\n    function footerComponent() {\n      return {\n        footerNavs: [\n          {\n            label: \"Company\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"Partners\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Blog\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Team\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Careers\",\n              },\n            ],\n          },\n          {\n            label: \"Resources\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"contact\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Support\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Docs\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Pricing\",\n              },\n            ],\n          },\n          {\n            label: \"About\",\n            items: [\n              {\n                href: \"javascript:void()\",\n                name: \"Terms\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"License\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"Privacy\",\n              },\n              {\n                href: \"javascript:void()\",\n                name: \"About US\",\n              },\n            ],\n          },\n        ],\n      };\n    }\n  </script>\n</div>"}]},"preview":"function App() {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"gap-6 justify-between md:flex\">\n                <div className=\"flex-1\">\n                    <div className=\"max-w-xs\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"leading-relaxed mt-2 text-[15px]\">\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form \n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label className=\"block pt-4 pb-2\">\n                            Stay up to date\n                        </label>\n                        <div className=\"max-w-sm flex items-center border rounded-md p-1\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                                className=\"w-full p-2.5 outline-none\"\n                            />\n                            <button\n                                className=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-medium\">\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a \n                                                href={el.href}\n                                                className=\"hover:underline hover:text-indigo-600\"\n                                            \n                                            >\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg className=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}","react":{"jsxCss":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"footer-secondary\">\n            <div className=\"footer-container\">\n                <div className=\"newsletter\">\n                    <div className=\"brand\">\n                        <img src=\"https://www.floatui.com/logo.svg\" />\n                        <p>\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form\n                        className=\"form\"\n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label>\n                            Stay up to date\n                        </label>\n                        <div className=\"form-field\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                            />\n                            <button\n                                className=\"btn\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"items-container\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"ul-list\"\n                                key={idx}\n                            >\n                                <h4>\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li\n                                            key={idx}>\n                                            <a className=\"link\" href={el.href}>\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"copyright-slmedia\">\n                <div className=\"copyright\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"sl-media\">\n                    <ul className=\"sl-media-list\">\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-1\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-2\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-3\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"sl-media-icon\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon svg-icon-4\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n        </footer>\n    )\n}\n"},{"code":".footer-secondary {\n  color: #6b7280;\n  background-color: #FFF;\n  padding: 1.25rem 1rem 1.25rem 1rem;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n}\n.footer-secondary .footer-container {\n  gap: 1.5rem;\n  justify-content: space-between;\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container {\n    display: flex;\n  }\n}\n.footer-secondary .footer-container .newsletter {\n  flex: 1;\n}\n.footer-secondary .footer-container .newsletter .brand {\n  max-width: 20rem;\n}\n.footer-secondary .footer-container .newsletter .brand img {\n  width: 8rem;\n}\n.footer-secondary .footer-container .newsletter .brand p {\n  line-height: 1.625;\n  margin-top: 0.5rem;\n  font-size: 15px;\n}\n.footer-secondary .footer-container .newsletter .form label {\n  display: block;\n  padding-top: 1rem;\n  padding-bottom: 0.5rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field {\n  max-width: 24rem;\n  display: flex;\n  align-items: center;\n  border: solid 1px #e5e7eb;\n  border-radius: 0.375rem;\n  padding: 0.25rem;\n}\n.footer-secondary .footer-container .newsletter .form .form-field input {\n  width: 100%;\n  padding: 0.625rem;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn {\n  padding: 0.625rem;\n  border-radius: 0.375rem;\n  box-shadow: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;\n  color: #FFF;\n  background-color: #4f46e5;\n  outline: none;\n}\n.footer-secondary .footer-container .newsletter .form .form-field .btn:focus {\n  box-shadow: none;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .newsletter .form .form-field .btn {\n    padding: 0.625rem 1.25rem 0.625rem 1.25rem;\n  }\n}\n.footer-secondary .footer-container .items-container {\n  flex: 1;\n  margin-top: 2.5rem;\n}\n.footer-secondary .footer-container .items-container > * + * {\n  margin-top: 1.5rem;\n}\n@media (min-width: 640px) {\n  .footer-secondary .footer-container .items-container {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n}\n@media (min-width: 768px) {\n  .footer-secondary .footer-container .items-container {\n    margin-top: 0px;\n  }\n  .footer-secondary .footer-container .items-container > * + * {\n    margin-top: 0px;\n  }\n}\n.footer-secondary .footer-container .items-container .ul-list > * + * {\n  margin-top: 1rem;\n}\n.footer-secondary .footer-container .items-container .ul-list h4 {\n  color: #1f2937;\n  font-weight: 500;\n}\n.footer-secondary .footer-container .items-container .ul-list li .link:hover {\n  text-decoration: underline;\n  color: #4f46e5;\n}\n.footer-secondary .copyright-slmedia {\n  margin-top: 2rem;\n  padding-top: 1.5rem;\n  padding-bottom: 1.5rem;\n  border-top: solid 1px #e5e7eb;\n}\n.footer-secondary .copyright-slmedia .copyright {\n  margin-top: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media {\n  margin-top: 1.5rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list {\n  display: flex;\n  align-items: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list > * + * {\n  margin-left: 1rem;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon {\n  width: 2.5rem;\n  height: 2.5rem;\n  border: solid 1px #e5e7eb;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n  color: black;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon path, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon polygon, .footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon rect {\n  fill: currentColor;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-1 {\n  color: #60a5fa;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-2 {\n  color: #1d4ed8;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-3 {\n  color: #3b82f6;\n}\n.footer-secondary .copyright-slmedia .sl-media .sl-media-list .sl-media-icon .svg-icon-4 {\n  color: #dc2626;\n}\n@media (min-width: 640px) {\n  .footer-secondary .copyright-slmedia {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .footer-secondary .copyright-slmedia .copyright, .footer-secondary .copyright-slmedia .sl-media {\n    margin-top: 0px;\n  }\n}\n","label":"style.css"}],"jsxTail":[{"label":"App.jsx","code":"export default () => {\n\n    const footerNavs = [\n        {\n            label: \"Company\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Partners'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Blog'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Team'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Careers'\n                },\n            ],\n        },\n        {\n            label: \"Resources\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'contact'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Support'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Docs'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Pricing'\n                },\n            ],\n        },\n        {\n            label: \"About\",\n            items: [\n                {\n                    href: 'javascript:void()',\n                    name: 'Terms'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'License'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'Privacy'\n                },\n                {\n                    href: 'javascript:void()',\n                    name: 'About US'\n                },\n            ]\n        }\n    ]\n\n    return (\n        <footer className=\"text-gray-500 bg-white px-4 py-5  md:px-8\">\n            <div className=\"gap-6 justify-between md:flex\">\n                <div className=\"flex-1\">\n                    <div className=\"max-w-xs\">\n                        <img src=\"https://www.floatui.com/logo.svg\" className=\"w-32\" />\n                        <p className=\"leading-relaxed mt-2 text-[15px]\">\n                            Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.\n                        </p>\n                    </div>\n                    <form \n                        onSubmit={(e) => e.preventDefault()}\n                    >\n                        <label className=\"block pt-4 pb-2\">\n                            Stay up to date\n                        </label>\n                        <div className=\"max-w-sm flex items-center border rounded-md p-1\">\n                            <input \n                                type=\"email\"\n                                placeholder=\"Enter your email\"\n                                className=\"w-full p-2.5 outline-none\"\n                            />\n                            <button\n                                className=\"p-2.5 rounded-md text-white bg-indigo-600 outline-none shadow-md focus:shadow-none sm:px-5\"\n                            >\n                                Subscribe\n                            </button>\n                        </div>\n                    </form>\n                </div>\n                <div className=\"flex-1 mt-10 space-y-6 items-center justify-between sm:flex md:space-y-0 md:mt-0\">\n                    {\n                        footerNavs.map((item, idx) => (\n                            <ul\n                                className=\"space-y-4\"\n                                key={idx}\n                            >\n                                <h4 className=\"text-gray-800 font-medium\">\n                                    { item.label }\n                                </h4>\n                                {\n                                    item.items.map(((el, idx) => (\n                                        <li key={idx}>\n                                            <a \n                                                href={el.href}\n                                                className=\"hover:underline hover:text-indigo-600\"\n                                            \n                                            >\n                                                { el.name }\n                                            </a>\n                                        </li>\n                                    )))\n                                }\n                            </ul>\n                        ))\n                    }\n                </div>\n            </div>\n            <div className=\"mt-8 py-6 border-t items-center justify-between sm:flex\">\n                <div className=\"mt-4 sm:mt-0\">\n                    &copy; 2022 Float UI All rights reserved.\n                </div>\n                <div className=\"mt-6 sm:mt-0\">\n                    <ul className=\"flex items-center space-x-4\">\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-400\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-700\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M11.344,5.71c0-0.73,0.074-1.122,1.199-1.122h1.502V1.871h-2.404c-2.886,0-3.903,1.36-3.903,3.646v1.765h-1.8V10h1.8v8.128h3.601V10h2.403l0.32-2.718h-2.724L11.344,5.71z\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-blue-500\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M10,2.531c-4.125,0-7.469,3.344-7.469,7.469c0,4.125,3.344,7.469,7.469,7.469c4.125,0,7.469-3.344,7.469-7.469C17.469,5.875,14.125,2.531,10,2.531 M10,3.776c1.48,0,2.84,0.519,3.908,1.384c-1.009,0.811-2.111,1.512-3.298,2.066C9.914,6.072,9.077,5.017,8.14,4.059C8.728,3.876,9.352,3.776,10,3.776 M6.903,4.606c0.962,0.93,1.82,1.969,2.53,3.112C7.707,8.364,5.849,8.734,3.902,8.75C4.264,6.976,5.382,5.481,6.903,4.606 M3.776,10c2.219,0,4.338-0.418,6.29-1.175c0.209,0.404,0.405,0.813,0.579,1.236c-2.147,0.805-3.953,2.294-5.177,4.195C4.421,13.143,3.776,11.648,3.776,10 M10,16.224c-1.337,0-2.572-0.426-3.586-1.143c1.079-1.748,2.709-3.119,4.659-3.853c0.483,1.488,0.755,3.071,0.784,4.714C11.271,16.125,10.646,16.224,10,16.224 M13.075,15.407c-0.072-1.577-0.342-3.103-0.806-4.542c0.673-0.154,1.369-0.243,2.087-0.243c0.621,0,1.22,0.085,1.807,0.203C15.902,12.791,14.728,14.465,13.075,15.407 M14.356,9.378c-0.868,0-1.708,0.116-2.515,0.313c-0.188-0.464-0.396-0.917-0.621-1.359c1.294-0.612,2.492-1.387,3.587-2.284c0.798,0.97,1.302,2.187,1.395,3.517C15.602,9.455,14.99,9.378,14.356,9.378\"></path>\n                                </svg>\n                            </a>\n                        </li>\n\n                        <li className=\"w-10 h-10 border rounded-full flex items-center justify-center\">\n                            <a href=\"javascript:void()\">\n                                <svg class=\"svg-icon w-6 h-6 text-red-600\" viewBox=\"0 0 20 20\">\n                                    <path fill=\"none\" d=\"M9.797,2.214C9.466,2.256,9.134,2.297,8.802,2.338C8.178,2.493,7.498,2.64,6.993,2.935C5.646,3.723,4.712,4.643,4.087,6.139C3.985,6.381,3.982,6.615,3.909,6.884c-0.48,1.744,0.37,3.548,1.402,4.173c0.198,0.119,0.649,0.332,0.815,0.049c0.092-0.156,0.071-0.364,0.128-0.546c0.037-0.12,0.154-0.347,0.127-0.496c-0.046-0.255-0.319-0.416-0.434-0.62C5.715,9.027,5.703,8.658,5.59,8.101c0.009-0.075,0.017-0.149,0.026-0.224C5.65,7.254,5.755,6.805,5.948,6.362c0.564-1.301,1.47-2.025,2.931-2.458c0.327-0.097,1.25-0.252,1.734-0.149c0.289,0.05,0.577,0.099,0.866,0.149c1.048,0.33,1.811,0.938,2.218,1.888c0.256,0.591,0.33,1.725,0.154,2.483c-0.085,0.36-0.072,0.667-0.179,0.993c-0.397,1.206-0.979,2.323-2.295,2.633c-0.868,0.205-1.519-0.324-1.733-0.869c-0.06-0.151-0.161-0.418-0.101-0.671c0.229-0.978,0.56-1.854,0.815-2.831c0.243-0.931-0.218-1.665-0.943-1.837C8.513,5.478,7.816,6.312,7.579,6.858C7.39,7.292,7.276,8.093,7.426,8.672c0.047,0.183,0.269,0.674,0.23,0.844c-0.174,0.755-0.372,1.568-0.587,2.31c-0.223,0.771-0.344,1.562-0.56,2.311c-0.1,0.342-0.096,0.709-0.179,1.066v0.521c-0.075,0.33-0.019,0.916,0.051,1.242c0.045,0.209-0.027,0.467,0.076,0.621c0.002,0.111,0.017,0.135,0.052,0.199c0.319-0.01,0.758-0.848,0.917-1.094c0.304-0.467,0.584-0.967,0.816-1.514c0.208-0.494,0.241-1.039,0.408-1.566c0.12-0.379,0.292-0.824,0.331-1.24h0.025c0.066,0.229,0.306,0.395,0.485,0.52c0.56,0.4,1.525,0.77,2.573,0.523c1.188-0.281,2.133-0.838,2.755-1.664c0.457-0.609,0.804-1.313,1.07-2.112c0.131-0.392,0.158-0.826,0.256-1.241c0.241-1.043-0.082-2.298-0.384-2.981C14.847,3.35,12.902,2.17,9.797,2.214\"></path>\n                                </svg>\n                            </a>\n                        </li>\n                    </ul>\n                </div>\n            </div>\n            <style jsx>{`\n                .svg-icon path,\n                .svg-icon polygon,\n                .svg-icon rect {\n                    fill: currentColor;\n                }\n            `}</style>\n        </footer>\n    )\n}\n"}]}}
 slug: /footers
 id: 1c67ebb7-7094-4405-bc05-7adb1d10aa04
 created_at: 2