add all components
This commit is contained in:
50
templates/shortcodes/accordion.html
Normal file
50
templates/shortcodes/accordion.html
Normal file
@@ -0,0 +1,50 @@
|
||||
{% set question = question | default(value="") %}
|
||||
{% set id_accordion = id_accordion | default(value="") %}
|
||||
{% set description = description | default(value="") %}
|
||||
{% set link = link | default(value="") %}
|
||||
{% set text_link = text_link | default(value="") %}
|
||||
|
||||
<div class="rounded-lg overflow-hidden my-2 border border-gray-500">
|
||||
<input type="checkbox" id="{{ id_accordion }}" class="peer hidden">
|
||||
<label for="{{ id_accordion }}" class="accordion flex items-center justify-between p-4 cursor-pointer transition-colors">
|
||||
<span class="text-lg font-medium ">{{ question }}</span>
|
||||
<svg class="w-6 h-6 transition-transform peer-checked:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
|
||||
</svg>
|
||||
</label>
|
||||
<div class="max-h-0 overflow-hidden transition-all duration-300 peer-checked:max-h-screen">
|
||||
<div class="p-4 flex">
|
||||
{% if description %}
|
||||
<p class="text-lg">{{ description }}
|
||||
{% if link %}
|
||||
<a class="ml-1 font-semibold"href="{{ link }}" target="_blank">{{ text_link }}</a> </p>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
.accordion:hover {
|
||||
background-color: rgb(255 255 255 / 5%) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
34
templates/shortcodes/cta.html
Normal file
34
templates/shortcodes/cta.html
Normal file
@@ -0,0 +1,34 @@
|
||||
{% set title_1 = title_1 | default(value="") %}
|
||||
{% set title_2 = title_2 | default(value="") %}
|
||||
{% set title_3 = title_3 | default(value="") %}
|
||||
{% set button_text_1 = button_text_1 | default(value="") %}
|
||||
{% set button_link_1 = button_link_1 | default(value="") %}
|
||||
{% set button_text_2 = button_text_2 | default(value="") %}
|
||||
{% set button_link_2 = button_link_2 | default(value="") %}
|
||||
{% set button_text_3 = button_text_3 | default(value="") %}
|
||||
{% set button_link_3 = button_link_3 | default(value="") %}
|
||||
{% set button_text_4 = button_text_4 | default(value="") %}
|
||||
{% set button_link_4 = button_link_4 | default(value="") %}
|
||||
|
||||
<div class="bg-transparent pt-12 pb-12">
|
||||
<div class="border border-gray-600 mx-auto rounded-md bg-black/5 max-w-7xl px-6 py-12 lg:flex lg:items-center lg:justify-between lg:px-20">
|
||||
<h2 class="lg:text-balance max-w-xl leading-tight items-start lg:text-left text-center fade-in">
|
||||
{{ title_1 }} <br>{{ title_2 }}<br> {{ title_3 }}
|
||||
</h2>
|
||||
<div class="mt-10 flex items-center 0 gap-x-6 lg:mt-0 lg:shrink-0 flex-wrap justify-center lg:justify-start">
|
||||
<a href="{{ button_link_1 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
|
||||
{{ button_text_1 }}
|
||||
</a>
|
||||
<a href="{{ button_link_2 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
|
||||
{{ button_text_2 }}
|
||||
</a>
|
||||
<a href="{{ button_link_3 }}" target="_blank" class="bg-theme text-theme rounded-md text-sm px-4 py-2 font-semibold shadow-sm">
|
||||
{{ button_text_3 }}
|
||||
</a>
|
||||
{% if button_link_4 %}
|
||||
<a href="{{ button_link_4 }}" class="fade-in text-sm/6 font-semibold text-white">{{ button_text_4 }}<span aria-hidden="true">→</span></a>
|
||||
{% endif%}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -6,9 +6,9 @@
|
||||
<div class="relative isolate overflow-hidden px-6 py-24 sm:py-32 lg:px-8">
|
||||
<img src="{{ image_BG }}" alt="" class="absolute inset-0 -z-10 h-full w-full object-cover">
|
||||
|
||||
<div class="absolute -bottom-8 -left-96 -z-10 transform-gpu blur-3xl sm:-bottom-64 sm:-left-40 lg:-bottom-32 lg:left-8 xl:-left-10" aria-hidden="true">
|
||||
{# <div class="absolute -bottom-8 -left-96 -z-10 transform-gpu blur-3xl sm:-bottom-64 sm:-left-40 lg:-bottom-32 lg:left-8 xl:-left-10" aria-hidden="true">
|
||||
<div class="aspect-[1266/975] w-[79.125rem] bg-gradient-to-tr from-[#ff4694] to-[#776fff] opacity-20" style="clip-path: polygon(74.1% 44.1%, 100% 61.6%, 97.5% 26.9%, 85.5% 0.1%, 80.7% 2%, 72.5% 32.5%, 60.2% 62.4%, 52.4% 68.1%, 47.5% 58.3%, 45.2% 34.5%, 27.5% 76.7%, 0.1% 64.9%, 17.9% 100%, 27.6% 76.8%, 76.1% 97.7%, 74.1% 44.1%)"></div>
|
||||
</div>
|
||||
</div> #}
|
||||
<div class="mx-auto max-w-2xl text-center">
|
||||
<br>
|
||||
<br>
|
||||
@@ -17,7 +17,7 @@
|
||||
{% if subtitle %}
|
||||
<h5>{{ subtitle }}</h5>
|
||||
{% endif %}
|
||||
<h1 class="pt-30">{{ title }}</h1>
|
||||
<p class="mt-6 text-lg leading-8 text-gray-300">{{ description }}</p>
|
||||
<h1 class="text-white pt-30">{{ title }}</h1>
|
||||
<p class="mt-6 text-lg leading-8 text-white">{{ description }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
60
templates/shortcodes/hero_side.html
Normal file
60
templates/shortcodes/hero_side.html
Normal file
@@ -0,0 +1,60 @@
|
||||
{% set title = title | default(value="") %}
|
||||
{% set image_src = image_src | default(value="") %}
|
||||
{% set image_alt = image_alt | default(value="") %}
|
||||
{% set description_1 = description_1 | default(value="") %}
|
||||
{% set description_2 = description_2 | default(value="") %}
|
||||
|
||||
|
||||
|
||||
<section class="flex items-center justify-center isolate overflow-hidden py-24 lg:py-24">
|
||||
<div class="mt-10 lg:mt-1 max-w-7xl mx-auto px-6 lg:px-16 flex flex-col-reverse lg:flex-row items-center ">
|
||||
|
||||
<!-- Left Content -->
|
||||
<div class="w-full lg:w-1/2 lg:text-left">
|
||||
<h1 class="fade-in">{{ title }}</h1>
|
||||
<p class="mx-auto mt-6 fade-in">{{ description_1 }}
|
||||
<br><br>{{ description_2 }}</p>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Right Image -->
|
||||
<div class="w-full lg:w-1/2 flex justify-center">
|
||||
<img src="{{ image_src }}" alt="{{ image_alt }}" class="blinking-effect w-full max-w-md lg:max-w-lg h-auto">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
|
||||
/* Apply the blinking animation to the link */
|
||||
.blinking-effect {
|
||||
animation: blink 2s infinite; /* Adjust the speed here (1.5s for slow blinking) */
|
||||
}
|
||||
|
||||
/* Define the fade-in animation */
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Apply the fade-in animation to elements with the 'fade-in' class */
|
||||
.fade-in {
|
||||
animation: fadeIn 4s ease-in-out forwards; /* Adjust the duration (2s) to make it slower or faster */
|
||||
}
|
||||
|
||||
/* Optional: Delay the animation for a more staggered effect */
|
||||
h2 {
|
||||
animation-delay: 0.5s; /* Delay for header */
|
||||
}
|
||||
|
||||
p {
|
||||
animation-delay: 1s; /* Delay for paragraphs */
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
113
templates/shortcodes/image_card.html
Normal file
113
templates/shortcodes/image_card.html
Normal file
@@ -0,0 +1,113 @@
|
||||
{% set image_src = image_src | default(value="") %}
|
||||
{% set image_alt = image_alt | default(value="") %}
|
||||
{% set title = title | default(value="") %}
|
||||
{% set card_link = card_link | default(value="") %}
|
||||
{% set tooltip = tooltip | default(value="") %}
|
||||
{% set target = target | default(value="") %}
|
||||
{% set header = header | default(value="") %}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href="{{ card_link }}" class="flex-1 mx-2 mb-8" target="{{ target }}">
|
||||
|
||||
<div class="tooltip">
|
||||
{% if tooltip %}
|
||||
<span class="tooltiptext">{{ tooltip }}</span>
|
||||
{% endif %}
|
||||
|
||||
<div class="fade-in-box flex flex-col p-6 rounded-2xl border border-gray-100 bg-black/5">
|
||||
{% if header %}
|
||||
<h2 class="text-2xl text-center flex justify-center items-center">{{ header }}</h2>
|
||||
{% endif %}
|
||||
|
||||
{% if image_src %}
|
||||
<img class="fade-in blinking-effect relative mx-auto mb-4" width="60%" src="{{ image_src }}" alt="{{ image_alt }}">
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% if title %}
|
||||
<div class="flex justify-center my-4 items-center gap-x-3 lg:text-xl text-lg font-semibold">
|
||||
{{ title }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
<style>
|
||||
/* Fade-in animation for the grid items */
|
||||
.fade-in-box {
|
||||
opacity: 0;
|
||||
animation: fadeIn 0.6s ease-in-out forwards;
|
||||
}
|
||||
|
||||
/* Fading in each grid item with a slight delay */
|
||||
.fade-in-box:nth-child(1) { animation-delay: 0s; }
|
||||
.fade-in-box:nth-child(2) { animation-delay: 0.2s; }
|
||||
.fade-in-box:nth-child(3) { animation-delay: 0.4s; }
|
||||
.fade-in-box:nth-child(4) { animation-delay: 0.6s; }
|
||||
.fade-in-box:nth-child(5) { animation-delay: 0.8s; }
|
||||
.fade-in-box:nth-child(6) { animation-delay: 1s; }
|
||||
.fade-in-box:nth-child(7) { animation-delay: 1.2s; }
|
||||
.fade-in-box:nth-child(8) { animation-delay: 1.4s; }
|
||||
.fade-in-box:nth-child(9) { animation-delay: 1.6s; }
|
||||
.fade-in-box:nth-child(10) { animation-delay: 1.8s; }
|
||||
.fade-in-box:nth-child(11) { animation-delay: 2s; }
|
||||
.fade-in-box:nth-child(12) { animation-delay: 2.2s; }
|
||||
|
||||
@keyframes fadeIn {
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tooltip container */
|
||||
|
||||
.tooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Tooltip text */
|
||||
.tooltip .tooltiptext {
|
||||
font-size: 12px;
|
||||
visibility: hidden;
|
||||
background-color: rgb(26 26 26 / 70%);
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 5px 10px;
|
||||
border-radius: 4px;
|
||||
|
||||
/* Position the tooltip text - see examples below! */
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 0px;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Show the tooltip text when you mouse over the tooltip container */
|
||||
.tooltip:hover .tooltiptext {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.tooltip .tooltiptext {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: -7px !important;
|
||||
right: 0px !important;
|
||||
top: 0px !important;
|
||||
left: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -2,19 +2,18 @@
|
||||
<section aria-labelledby="features-heading" class="mx-auto max-w-7xl py-12 lg:py-24 sm:px-2 lg:px-8">
|
||||
<div class="mx-auto max-w-2xl px-4 lg:max-w-none lg:px-0">
|
||||
<div class="max-w-3xl">
|
||||
<h2 id="features-heading">Technical Specifications</h2>
|
||||
<p class="mt-4">Dive into the technical details that empower our revolutionary cloud platform, Offering Compute (GPU, CPU), Storage and Network.</p>
|
||||
<h2 id="features-heading">Multi Tabs</h2>
|
||||
<p class="mt-4">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus duis convallis tempus leo eu aenean.</p>
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
<div class="-mx-4 flex overflow-x-auto sm:mx-0">
|
||||
<div class="flex-auto border-b border-gray-200 px-4 sm:px-0">
|
||||
<div class="-mb-px flex space-x-2 lg:space-x-10" aria-orientation="horizontal" role="tablist">
|
||||
<!-- Current: "border-indigo-400 text-indigo-400", Default: "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700" -->
|
||||
<button id="features-tab-1" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-1" role="tab" type="button">3Nodes</button>
|
||||
<button id="features-tab-2" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-2" role="tab" type="button">Zero-OS</button>
|
||||
<button id="features-tab-3" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-3" role="tab" type="button">Mycelium</button>
|
||||
<button id="features-tab-4" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-50 hover:text-gray-300" aria-controls="features-panel-4" role="tab" type="button">QSS</button>
|
||||
<button id="features-tab-1" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-1" role="tab" type="button">Tab1</button>
|
||||
<button id="features-tab-2" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-2" role="tab" type="button">Tab2</button>
|
||||
<button id="features-tab-3" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-3" role="tab" type="button">Tab3</button>
|
||||
<button id="features-tab-4" class="whitespace-nowrap border-b-2 border-transparent py-6 text-base font-medium text-gray-400 hover:text-gray-300" aria-controls="features-panel-4" role="tab" type="button">Tab4</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -22,21 +21,21 @@
|
||||
<div id="features-panel-1" class="space-y-6 pt-4" aria-labelledby="features-tab-1" role="tabpanel" tabindex="0">
|
||||
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
|
||||
<div class="mt-6 lg:col-span-7 lg:mt-0">
|
||||
<h3 class="">3Nodes</h3>
|
||||
<p class="mt-2 ">3Nodes are the hardware building blocks of our stack and are installed in data centres, offices or homes.
|
||||
<h3 class="">Tab1</h3>
|
||||
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
|
||||
</p>
|
||||
<dl class="mt-6 space-y-4">
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Plug & Play</h5>
|
||||
<p class="text-base">Simply connect your certified node to the internet.</p>
|
||||
<h5 class="text-lg mb-0">• Title1</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Peer-to-peer</h5>
|
||||
<p class="text-base">Consumes up to 10x less energy for certain workloads.</p>
|
||||
<h5 class="text-lg mb-0">• Title2</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Scalable</h5>
|
||||
<p class="text-base">Nodes can be deployed on any level providing unlimited scalability.</p>
|
||||
<h5 class="text-lg mb-0">• Title3</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
@@ -50,20 +49,21 @@
|
||||
<div id="features-panel-2" class="space-y-6 pt-4" aria-labelledby="features-tab-2" role="tabpanel" tabindex="0">
|
||||
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
|
||||
<div class="mt-6 lg:col-span-7 lg:mt-0">
|
||||
<h3>Zero-OS</h3>
|
||||
<p class="mt-2 text-base text-gray-50">Zero-OS is a bare-metal, stateless, and efficient operating system designed to host AI, Web2, and Web3 workloads in a more sovereign manner, without compromising on security, control, and monitoring.</p>
|
||||
<h3 class="">Tab2</h3>
|
||||
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
|
||||
</p>
|
||||
<dl class="mt-6 space-y-4">
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• CORE-0</h5>
|
||||
<p class="mt-2 text-base text-gray-100">First process launched on the Zero-OS. This process kicks off all activities on the node and allows the full OS to be booted over the network maintening full integrity and hacking surfaces </p>
|
||||
<h5 class="text-lg mb-0">• Title1</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Hardware Support</h5>
|
||||
<p class="mt-2 text-base text-gray-100">Support for INTEL, AMD or ARM Based CPUs. Support any amount of GPU/CPU/Memory</p>
|
||||
<h5 class="text-lg mb-0">• Title2</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Kernel</h5>
|
||||
<p class="mt-2 text-base text-gray-100">Zero-OS uses the well known Linux Kernel because it has device drivers for almost any hardware that exists.</p>
|
||||
<h5 class="text-lg mb-0">• Title3</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
@@ -77,22 +77,21 @@
|
||||
<div id="features-panel-3" class="space-y-6 pt-4" aria-labelledby="features-tab-3" role="tabpanel" tabindex="0">
|
||||
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
|
||||
<div class="mt-6 lg:col-span-7 lg:mt-0">
|
||||
<h3>Mycelium</h3>
|
||||
<p class="mt-2 text-base text-gray-50">
|
||||
Mycelium is the culmination of a decade-long quest for a more efficient network system, enabling faster and more reliable communication between machines and people.
|
||||
<h3 class="">Tab3</h3>
|
||||
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
|
||||
</p>
|
||||
<dl class="mt-6 space-y-4">
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Shortest Path Route</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">Mycelium optimizes data transmission by identifying and utilizing the fastest and most direct routes.</dd>
|
||||
<h5 class="text-lg mb-0">• Title1</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• End-to-End Encrypted</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">All data is secured with end-to-end encryption, ensuring protection against interception.</dd>
|
||||
<h5 class="text-lg mb-0">• Title2</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Ultra Compatible</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">Mycelium seamlessly integrates with any existing internet connection, including peer-to-peer networks.</dd>
|
||||
<h5 class="text-lg mb-0">• Title3</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
@@ -106,21 +105,21 @@
|
||||
<div id="features-panel-4" class="space-y-6 pt-4" aria-labelledby="features-tab-4" role="tabpanel" tabindex="0">
|
||||
<div class="flex flex-col-reverse lg:grid lg:grid-cols-12 lg:gap-x-8">
|
||||
<div class="mt-6 lg:col-span-7 lg:mt-0">
|
||||
<h3>QSS</h3>
|
||||
<p class="mt-2 text-base text-gray-100">A decentralized, globally distributed data storage system that is up to 10 times more efficient in terms of power and hardware usage. It is highly reliable, ensuring that data cannot be lost or corrupted. Additionally, it is safe, private, and scalable.
|
||||
<h3 class="">Tab4</h3>
|
||||
<p class="mt-2 ">Lorem ipsum dolor sit amet consectetur adipiscing elit. Ex sapien vitae pellentesque sem placerat in id. Pretium tellus
|
||||
</p>
|
||||
<dl class="mt-6 space-y-4">
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Always Consistent</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">It employs advanced storage algorithms that fragment files into multiple pieces distributed across numerous nodes and sites.</dd>
|
||||
<h5 class="text-lg mb-0">• Title1</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Self-healing</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">The storage layer is equipped with automatic data integrity checks that promptly detect and correct any corruption, ensuring continuous data health..</dd>
|
||||
<h5 class="text-lg mb-0">• Title2</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="text-lg mb-0">• Ultra Secure</h5>
|
||||
<dd class="mt-2 text-base text-gray-100">With its sophisticated encryption and redundancy protocols, data remains secure, protected from loss, and impervious to corruption.</dd>
|
||||
<h5 class="text-lg mb-0">• Title3</h5>
|
||||
<p class="text-base">Lorem ipsum dolor sit amet consectetur adipiscing elit</p>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user