No results found for ""
Getting Started
Layout
Components
Content
Form
Helpers
<button data-modal-id="modal1" class="modal-button outset-neomo">MODAL Button</button>
<div data-modal-id="modal1" class="modal">
<div class="modal-content--md outset-neomo">
<span class="modal-close">&times;</span>
<p>You can insert any type of content with this modal class.</p>
</div>
</div>
You can insert any type of content with this modal class.
<button data-modal-id="modal3" class="modal-button outset-neomo">Small Card MODAL</button>
<div data-modal-id="modal3" class="modal">
<div class="modal-content--sm outset-neomo">
<span class="modal-close">&times;</span>
<header class="card-header">
<p class="card-header-title">Modal Card</p>
</header>
<div class="column size-10 text-center ml-10" style="margin: 0 auto">
<div class="card-image">
<img
src="https://images.unsplash.com/photo-1593642634315-48f5414c3ad9?ixid=MnwxMjA3fDF8MHxlZGl0b3JpYWwtZmVlZHwxfHx8ZW58MHx8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60"
alt="Placeholder image"
style="border-radius: 0"
/>
</div>
<div class="card-content">
<p class="font-size-4 profile-link text-left m-0">
<img
class="img-profile p-0"
src="https://images.unsplash.com/profile-1609856653329-a9e174ff28b6image?auto=format&amp;fit=crop&amp;w=32&amp;h=32&amp;q=60&amp;crop=faces&amp;bg=fff"
width="32"
height="32"
role="presentation"
alt="Go to Julian Steenbergen's profile"
/>
Julian Steenbergen
</p>
<p class="text-left">
I'm actually a musician, but photography is just too fun. It brings me
joy, inspiration and peace. Happy to support the community here with
my work! ✨
</p>
<p class="text-left">
<i class="fas fa-calendar-week"></i>
Published on May 9, 2021
</p>
<p class="text-left">
<i class="fas fa-shield-alt"></i>
Free to use under the Unsplash License
</p>
</div>
</div>
</div>
</div>
Modal Card
Julian Steenbergen
I'm actually a musician, but photography is just too fun. It brings me joy, inspiration and peace. Happy to support the community here with my work! ✨
Published on May 9, 2021
Free to use under the Unsplash License
<button data-modal-id="modal2" class="modal-button outset-neomo">Middle Card MODAL</button>
<div data-modal-id="modal2" class="modal">
<div class="modal-content--md outset-neomo">
<span class="modal-close">&times;</span>
<header class="card-header">
<p class="card-header-title">Modal Card</p>
</header>
<div class="column size-10 text-center ml-10" style="margin: 0 auto">
<div class="card-image">
<img
src="https://images.unsplash.com/photo-1593642634524-b40b5baae6bb?ixid=MnwxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1189&q=80"
alt="Placeholder image"
style="border-radius: 0"
/>
</div>
<div class="card-content">
<p class="font-size-4 profile-link text-left m-0">
<img
class="img-profile p-0"
src="https://images.unsplash.com/profile-1609856653329-a9e174ff28b6image?auto=format&amp;fit=crop&amp;w=32&amp;h=32&amp;q=60&amp;crop=faces&amp;bg=fff"
width="32"
height="32"
role="presentation"
alt="Go to Julian Steenbergen's profile"
/>
Julian Steenbergen
</p>
<p class="text-left">
I'm actually a musician, but photography is just too fun. It brings me
joy, inspiration and peace. Happy to support the community here with
my work! ✨
</p>
<p class="text-left">
<i class="fas fa-calendar-week"></i>
Published on May 9, 2021
</p>
<p class="text-left">
<i class="fas fa-shield-alt"></i>
Free to use under the Unsplash License
</p>
</div>
</div>
</div>
</div>
Modal Card
Julian Steenbergen
I'm actually a musician, but photography is just too fun. It brings me joy, inspiration and peace. Happy to support the community here with my work! ✨
Published on May 9, 2021
Free to use under the Unsplash License