www_mycelium/templates/partials/heroapps.html
sasha-astiadi a0f1aa044e edit
2024-05-06 11:59:44 +02:00

100 lines
7.6 KiB
HTML

<div class="max-w-screen-xl px-4 py-8 mx-auto space-y-12 lg:space-y-20 lg:py-24 lg:pb-12 lg:px-6">
<!-- Row -->
<div class="items-center gap-8 lg:grid lg:grid-cols-2 xl:gap-16">
<div class="lg:col-span-1">
<h2>Do Anything. Do Everything.</h2>
<p>From secure file sharing to encrypted communication, your Hero comes equipped with all the essential skills and capabilities needed to enhance the flexibility and security of your digital life.</p>
<!-- List in Two Columns -->
<ul role="list" class="grid grid-cols-2 gap-x-4 gap-y-4 pt-8 border-t border-gray-200 my-7 dark:border-gray-700">
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Communication<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Chat, hold meetings, and video conferencing.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Finance <//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Use wallet features to transact and manage assets.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Collaborate <//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Engage in projects and tasks with your network.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Develop & Expand<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Create tools or decentralized applications.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Creativity<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Generate videos, documents, and other contents.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Filesharing<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Directly send data and files without central servers.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Organization<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Securely store and organize data.</p>
</div>
</li>
<li class="flex items-center space-x-3">
<!-- Icon -->
<svg class="flex-shrink-0 w-5 h-5 text-purple-500 dark:text-purple-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
</svg>
<div class="flex flex-col">
<h5>Browser<//h5>
<p class="text-sm font-light text-gray-500 dark:text-gray-400">Browse information securely without tracking.</p>
</div>
</li>
</ul>
<div class="pt-6 mt-6 space-y-4 border-t border-gray-200 dark:border-gray-700">
<div>
<a href onclick="hero.md"><h5><u>See Xperiences</u></h5></a>
</div>
</div>
</div>
<img class="hidden w-full mb-4 rounded-lg lg:mb-0 lg:flex" src="images/hero5.png" alt="dashboard feature image">
</div>
</div>
<!-- End block -->