<!-- Default -->
<div class="book u-animate-pulse">
<p class="book_img">
<img src="../../images/book-loading-1.gif" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
████████████████████ ███████ ██████████ ██████ ███████ ██████████
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
███ █████ ███████
</div>
</div>
<!-- Book Placeholder 2 -->
<div class="book u-animate-pulse">
<p class="book_img">
<img src="../../images/book-loading-2.gif" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
█████████ ████ ███████ ██████████ ██████ ███████ ██████████
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
████████ ██
</div>
</div>
<!-- Book Placeholder 3 -->
<div class="book u-animate-pulse">
<p class="book_img">
<img src="../../images/book-loading-5.gif" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
█████████ ███████████ ███████ ██████████
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
██████████ █████████████
</div>
</div>
<!-- Book Placeholder 4 -->
<div class="book u-animate-pulse">
<p class="book_img">
<img src="../../images/book-loading-3.gif" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
██████████████ █████████████
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
████████ ███████
</div>
</div>
<!-- Book Placeholder 5 -->
<div class="book u-animate-pulse">
<p class="book_img">
<img src="../../images/book-loading-2.gif" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
████████████████████ █████████████ ██████████
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
████ █████████████████████
</div>
</div>
<div class="book u-animate-pulse">
<p class="book_img">
<img src="{{ path img }}" alt="">
</p>
<div class="book_title u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
{{ characterOne }}
</div>
<div class="book_subtitle u-ff-mono u-c-fade" style="letter-spacing: -0.1rem">
{{ characterTwo }}
</div>
</div>
/* Default */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/images/book-loading-1.gif",
"characterOne": "████████████████████ ███████ ██████████ ██████ ███████ ██████████",
"characterTwo": "███ █████ ███████"
}
/* Book Placeholder 2 */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/images/book-loading-2.gif",
"characterOne": "█████████ ████ ███████ ██████████ ██████ ███████ ██████████",
"characterTwo": "████████ ██"
}
/* Book Placeholder 3 */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/images/book-loading-5.gif",
"characterOne": "█████████ ███████████ ███████ ██████████",
"characterTwo": "██████████ █████████████"
}
/* Book Placeholder 4 */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/images/book-loading-3.gif",
"characterOne": "██████████████ █████████████",
"characterTwo": "████████ ███████"
}
/* Book Placeholder 5 */
{
"label": "Lorem ipsum",
"labelLong": "Lorem ipsum dolor sit amet",
"htmlText": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus at laoreet. Sed congue sollicitudin lacus vitae porttitor. Integer convallis maximus odio.</p>",
"htmlTextMedium": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt.</p>",
"htmlTextShort": "<p>Integer varius tincidunt purus at laoreet. Sed congue sollicitudin.</p>",
"text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius tincidunt purus. Integer convallis maximus odio.",
"url": "#",
"videoUrl": "https://www.youtube.com/embed/roS6oFjCDhc",
"img": "/images/book-loading-2.gif",
"characterOne": "████████████████████ █████████████ ██████████",
"characterTwo": "████ █████████████████████"
}
There are no notes for this item.