fix responsiveness
This commit is contained in:
@@ -1,12 +1,12 @@
|
||||
<div class="relative isolate overflow-hidden bg-transparent">
|
||||
<div class="px-6 lg:pt-32 mt-12 pt-24 lg:pb-24 pb-12 sm:px-6 lg:px-8">
|
||||
<div class="mx-auto max-w-4xl text-center">
|
||||
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-3xl fade-in">A Secure & Sovereign Infrastructure Layer for Web 4</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Our unique technology enables a system which can scale to a planetary level, can store data which can never be corrupted nor lost, is compatible with AI, Cloud, Web2, Web3 and Edge IT workloads, has the potential to recover from unforeseen events, and provide 100% uptime. .</p>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-medium text-gray-200 fade-in">ThreeFold can be used by any Web2, Web3, AI, or Edge IT workload.
|
||||
<h2 class="text-balance font-normal tracking-tight text-white lg:text-6xl text-4xl fade-in">A Secure & Sovereign Infrastructure Layer for Web 4</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-2xl text-lg font-light text-gray-200 fade-in">Our unique technology enables a system which can scale to a planetary level, can store data which can never be corrupted nor lost, is compatible with AI, Cloud, Web2, Web3 and Edge IT workloads, has the potential to recover from unforeseen events, and provide 100% uptime. .</p>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-2xl text-lg font-medium text-gray-200 fade-in">ThreeFold can be used by any Web2, Web3, AI, or Edge IT workload.
|
||||
</p>
|
||||
<div class="mt-12 flex items-center justify-center gap-x-6">
|
||||
<a href="https://docs.threefold.io" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-sm font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2">Dive Deeper - Read our docs</a>
|
||||
<a href="https://docs.threefold.io" class="fade-in rounded-2xl bg-white px-4 py-2.5 text-md font-semibold text-black shadow-sm hover:bg-gray-200 hover:text-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-offset-2">Dive Deeper</a>
|
||||
f
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<div class="bg-transparent pt-12 pb-6">
|
||||
<div class="mx-auto max-w-7xl px-6 lg:max-w-7xl lg:px-8">
|
||||
<div class="mx-auto max-w-2xl px-6 lg:max-w-7xl lg:px-8">
|
||||
<h2 class="mx-auto fade-in text-left lg:text-5xl text-2xl leading-snug font-normal tracking-tight text-white">What We’ve Built</h2>
|
||||
<p class="text-left mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">
|
||||
<h2 class="mx-auto fade-in text-left lg:text-5xl text-4xl leading-snug font-normal tracking-tight text-white">What We’ve Built</h2>
|
||||
<p class="text-left mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">
|
||||
At ThreeFold, we've created products that embody innovation, authenticity, and simplicity. Each solution is crafted to empower individuals and communities, blending cutting-edge technology with practical usability.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<section class="pb-32 bg-transparent">
|
||||
<section class="lg:pb-24 pb-12 pt-12 bg-transparent">
|
||||
<div class="max-w-6xl mx-8 md:mx-10 lg:mx-20 xl:mx-auto">
|
||||
<div class="mx-auto max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none">
|
||||
<div class="mx-auto max-w-2xl lg:max-w-none">
|
||||
<dl class="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
ZERO-OS V3
|
||||
</dt>
|
||||
@@ -23,7 +23,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
MYCELIUM NETWORK
|
||||
</dt>
|
||||
@@ -34,7 +34,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
QUANTUM SAFE STORAGE
|
||||
</dt>
|
||||
@@ -47,7 +47,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 2ND ROW-->
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
TF CHAIN
|
||||
</dt>
|
||||
@@ -58,7 +58,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
3NODES
|
||||
</dt>
|
||||
@@ -69,7 +69,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
GATEWAY NODES
|
||||
</dt>
|
||||
@@ -82,7 +82,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 3RD ROW-->
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
TF DASHBOARD
|
||||
</dt>
|
||||
@@ -93,7 +93,7 @@
|
||||
</p>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
TF DAO
|
||||
</dt>
|
||||
@@ -105,7 +105,7 @@
|
||||
</dd>
|
||||
</div>
|
||||
|
||||
<div class="fade-in-box flex flex-col p-8 rounded rounded-2xl bg-white/5">
|
||||
<div class="fade-in-box flex flex-col p-8 rounded-2xl bg-white/5">
|
||||
<dt class="flex items-center gap-x-3 text-base/7 rounded-2xl font-semibold text-white">
|
||||
TF CONNECT APP
|
||||
</dt>
|
||||
|
||||
@@ -1,37 +1,37 @@
|
||||
<div class="bg-transparent">
|
||||
<div class="mx-auto grid max-w-2xl grid-cols-1 items-center gap-x-16 gap-y-16 px-8 pt-12 mt-12 pb-24 lg:max-w-7xl lg:grid-cols-2 lg:px-8">
|
||||
<div class="max-w-3xl px-0 lg:px-16 pb-12">
|
||||
<h2 class="fade-in text-balance lg:text-4xl text-2xl leading-snug font-normal tracking-tight text-white sm:text-5xl">What You Can Do With It
|
||||
<div class="max-w-3xl px-0 lg:px-16 lg:pb-10 pb-4">
|
||||
<h2 class="fade-in text-balance lg:text-5xl text-4xl leading-snug font-normal tracking-tight text-white sm:text-5xl">What You Can Do With It
|
||||
</h2>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">Today, ThreeFold is primarily focused on empowering developers to create innovative cloud solutions.</p>
|
||||
<p class="mx-auto mt-4 mb-6 max-w-3xl text-pretty lg:text-xl text-base font-light text-gray-200 fade-in">On 12-12-24, we will unveil exciting news about how Web4 will soon become accessible to everyone, opening up endless possibilities for all users.</p>
|
||||
<a href="/action" class="border border-white px-6 py-2 fade-in lg:text-3xl text-2xl rounded-2xl tracking-normal font-medium text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>12.12.24</a>
|
||||
<p class="mx-auto mt-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">Today, ThreeFold is primarily focused on empowering developers to create innovative cloud solutions.</p>
|
||||
<p class="mx-auto mt-4 mb-6 max-w-3xl text-pretty lg:text-xl text-lg font-light text-gray-200 fade-in">On 12-12-24, we will unveil exciting news about how Web4 will soon become accessible to everyone, opening up endless possibilities for all users.</p>
|
||||
<a href="/action" class="mt-4 border border-white px-6 py-2 fade-in lg:text-3xl text-2xl rounded-2xl tracking-normal font-medium text-white hover:text-gray-400 blinking-effect"><span aria-hidden="true">→ </span>12.12.24</a>
|
||||
</div>
|
||||
<div class="lg:px-16 fade-in"> <!-- Added padding to the right side for more spacing -->
|
||||
<dl class="fade-in grid grid-cols-1 mx-auto gap-x-8 sm:grid-cols-2 gap-y-10">
|
||||
<dl class="fade-in grid grid-cols-1 mx-auto gap-x-8 sm:grid-cols-2 lg:gap-y-10 gap-y-6">
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Communicate securely</dt>
|
||||
<dd class="mt-1 font-light text-gray-400 text-sm mb-4">Experience end-to-end encrypted communication in the shortest possible path, ensuring messages remain private and unalterable—even during disasters.</dd>
|
||||
<dd class="mt-1 font-light text-gray-300 text-sm mb-4">Experience end-to-end encrypted communication in the shortest possible path, ensuring messages remain private and unalterable—even during disasters.</dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Store effortlessly</dt>
|
||||
<dd class="mt-1 ont-light text-gray-400 text-sm mb-4">Securely share and store information with ease, scaling seamlessly from personal use to billions of users. </dd>
|
||||
<dd class="mt-1 ont-light text-gray-300 text-sm mb-4">Securely share and store information with ease, scaling seamlessly from personal use to billions of users. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Restore authenticity</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Determine which information can be trusted, bringing clarity and confidence back to the digital space. </dd>
|
||||
<dd class="font-light text-gray-300 text-sm mb-4">Determine which information can be trusted, bringing clarity and confidence back to the digital space. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Unlock limitless insights</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Discover, analyze, and find information with no boundaries, aided by a powerful personal AI assistant. </dd>
|
||||
<dd class="font-light text-gray-300 text-sm mb-4">Discover, analyze, and find information with no boundaries, aided by a powerful personal AI assistant. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Streamline your interactions</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Keep track of all your connections and simplify your life with an AI that optimizes your daily tasks and interactions. </dd>
|
||||
<dd class="font-light text-gray-300 text-sm mb-4">Keep track of all your connections and simplify your life with an AI that optimizes your daily tasks and interactions. </dd>
|
||||
</div>
|
||||
<div class="">
|
||||
<dt class="font-medium text-gray-200">Take control of your digital presence</dt>
|
||||
<dd class="font-light text-gray-400 text-sm mb-4">Own and manage your data, identity, and interactions across platforms, ensuring transparency and sovereignty in the digital world.</dd>
|
||||
<dd class="font-light text-gray-300 text-sm mb-4">Own and manage your data, identity, and interactions across platforms, ensuring transparency and sovereignty in the digital world.</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user