498 lines
29 KiB
HTML
498 lines
29 KiB
HTML
<div class="row row-cols-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-6 align-items-stretch g-3 text-center">
|
|
<div class="col">
|
|
<a href="shop.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">shopping_basket</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Shop</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="portfolio.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">cases</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Portfolio</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="blog.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">newsmode</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Blog</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="events-grid.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">event</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Events</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="rs-demos.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">web_stories</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Sliders</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="forms.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">forms_add_on</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Form Templates</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="contact.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">forward_to_inbox</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Contact Forms</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="modal-onload.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">settings_overscan</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Modal onLoad</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="side-panel.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">right_panel_open</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Side Panel</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="animations.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">animation</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Animations</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="buttons.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">smart_button</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Buttons</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="carousel.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">view_carousel</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Carousel</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="charts.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">monitoring</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Charts</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="clients.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">interests</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Clients</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="columns-grids.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">browse</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Columns</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="counters.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">avg_pace</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Counters</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="read-more.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">more</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Read More<span class="visually-hidden"> Element</span></h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-datatable.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">table_view</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Data Tables</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-datepicker.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">date_range</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Date Picker</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="dividers.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">commit</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Dividers</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="featured-boxes.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">lightbulb</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Icon Boxes</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="gallery.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">gallery_thumbnail</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Gallery</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="headings-dropcaps.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">format_h1</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Headings</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="icon-lists.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">checklist</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Icon Lists</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="gradients.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">gradient</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Gradients</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="lightbox.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">photo_size_select_small</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Lightbox</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="item-overlays.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">low_density</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Overlays</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="form-fields.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">input</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Form Fields</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-uploads.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">upload</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">File Uploads</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="lists-cards.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">list_alt</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Lists & Cards</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="maps.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">location_on</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Maps</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="media-embeds.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">media_link</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Media Embeds</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="modal-popovers.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">add_box</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Modal Boxes</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="notifications.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">notifications</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Notifications</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="navigation.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">menu</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Navigations</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="pagination-progress.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">123</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Pagination</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="progress-skills.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">percent</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Progress Bars</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="shape-dividers.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">draw_abstract</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Shape Dividers</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-range-slider.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">tune</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Range Slider</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-ratings.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">star_half</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Star Ratings</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="pricing.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">currency_exchange</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Pricing</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="process-steps.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">steppers</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Process Steps</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="promo-boxes.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">pages</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Promo Boxes</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="quotes-blockquotes.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">format_quote</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Blockquotes</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="responsive.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">devices</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Responsive</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="sections.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">full_coverage</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Sections</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="social-icons.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">share</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Social Icons</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="hover-animations.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">touch_app</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Hover Animations</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-select-picker.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">view_list</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Select Picker</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="component-select-box.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">view_column</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Select Boxes</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="style-boxes.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">warning</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Alerts</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="styled-icons.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">shapes</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Styled Icons</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="tables.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">table</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Tables</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="tabs.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">tab</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Tabs</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="testimonials-twitter.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">social_leaderboard</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Testimonials</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="thumbnails-slider.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">image</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Thumbnails</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="toggles-accordions.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">top_panel_open</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Toggles</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="lazy-loading.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">pending</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Lazy Loading</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="component-radios-switches.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">toggle_off</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Radios & Switches</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="flip-cards.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">cached</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Flip Cards</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="cascading-images.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">photo_library</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Cascading Images</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="image-compare.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">compare</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Before/After</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="video-facade.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">smart_display</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Video Facade</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="gdpr.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">privacy_tip</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">GDPR</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col">
|
|
<a href="cart-quantity.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">exposure</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Cart Quantity</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="circle-stack.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">fiber_smart_record</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Circle Stack</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="image-sliders.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">wallpaper_slideshow</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Image Sliders</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="ticker.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">air</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Ticker</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="ajax-button.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">sim_card_download</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">AJAX Button</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="conditional.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">question_exchange</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Conditional</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="code-highlighter.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">code_blocks</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Code Highlighter</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="custom-cursor.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">ads_click</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Custom Cursor</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="hover-parallax.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">open_with</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Hover Parallax</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="color-mode-switcher.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">dark_mode</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Mode Switcher</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="adaptive-scheme.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">contrast</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Adaptive Scheme</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="image-hotspot.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">photo_filter</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Image Hotspots</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="portfolio-filter-styles.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<i class="material-symbols-outlined">filter_list</i>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Filters</h5>
|
|
</a>
|
|
</div>
|
|
<div class="col">
|
|
<a href="preloaders.html" style="background-color: var(--cnvs-contrast-bg-offset);" class="d-block grid-inner text-contrast-900 h-text-color all-ts h-nobg border border-transparent h-border-contrast-900 py-5 px-3 rounded">
|
|
<div class="position-relative fs-2">
|
|
|
|
<div class="css3-spinner position-absolute">
|
|
<div class="css3-spinner-bounce1" style="--cnvs-loader-color: var(--cnvs-contrast-900);"></div>
|
|
<div class="css3-spinner-bounce2" style="--cnvs-loader-color: var(--cnvs-contrast-900);"></div>
|
|
<div class="css3-spinner-bounce3" style="--cnvs-loader-color: var(--cnvs-contrast-900);"></div>
|
|
</div>
|
|
</div>
|
|
<h5 class="fs-6 fw-medium mt-3 mb-0">Preloaders</h5>
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Page Sub-Menu -->
|
|
<!-- Go to Top -->
|
|
<!-- Responsive Heights -->
|
|
<!-- Countdowns -->
|
|
<!-- Twitter Feed -->
|
|
<!-- Instagram Photos -->
|
|
<!-- Flickr -->
|
|
<!-- Dribbble -->
|
|
<!-- Subscription Form -->
|
|
<!-- NavTree -->
|
|
</div> |