<div class="editor text">
<blockquote>
<p>This should be a blockquote.</p>
</blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique.</p>
<figure>
<figure class="image image--fluid ">
<picture class="image__picture">
<source srcset="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20150%20100%22%3E%3C%2Fsvg%3E" data-srcset="//via.placeholder.com/150x100 150w, //via.placeholder.com/300x200 300w, //via.placeholder.com/600x400 600w" media="(min-width: 1024px)" />
<source srcset="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20125%20100%22%3E%3C%2Fsvg%3E" data-srcset="//via.placeholder.com/125x100 125w, //via.placeholder.com/250x200 250w, //via.placeholder.com/500x400 500w" media="(min-width: 768px)" />
<img loading="lazy" src="data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%3E%3C%2Fsvg%3E" data-srcset="//via.placeholder.com/300x300 300w, //via.placeholder.com/500x500 500w, //via.placeholder.com/1000x1000 1000w, //via.placeholder.com/100x100 100w, //via.placeholder.com/200x200 200w" data-sizes="auto" alt="" class="image__img lazyload">
</picture>
</figure>
</figure>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique.</p>
</div>
<div class="editor text">
<blockquote>
<p>This should be a blockquote.</p>
</blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique.</p>
<figure>
{% include '@image' with { modifier: 'image--fluid', media: ['(min-width: 1024px)', '(min-width: 768px)'], data: article.thumbnail|srcset('100x100', ['150x100', '125x100']) } %}
</figure>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora iure, sequi maiores. Quae, unde accusantium, repellat labore adipisci dicta, cupiditate, laboriosam qui accusamus laudantium illum nisi nemo. Error, voluptatem, similique.</p>
</div>
{
"language": "en-US"
}
.editor {
img {
max-width: 100%;
height: auto;
}
/* WordPress Core */
.alignnone {
margin: 5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
display: block;
margin: 5px auto 5px auto;
}
.alignright {
float: right;
margin: 5px 0 20px 20px;
}
.alignleft {
float: left;
margin: 5px 20px 20px 0;
}
a img.alignright {
float: right;
margin: 5px 0 20px 20px;
}
a img.alignnone {
margin: 5px 20px 20px 0;
}
a img.alignleft {
float: left;
margin: 5px 20px 20px 0;
}
a img.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.wp-caption {
padding: 5px 3px 10px;
text-align: center;
}
.wp-caption.alignnone {
margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
margin: 5px 20px 20px 0;
}
.wp-caption.alignright {
margin: 5px 0 20px 20px;
}
.wp-caption img {
border: 0 none;
height: auto;
margin: 0;
max-width: 100%;
padding: 0;
width: auto;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
margin: 0;
padding: 0 4px 5px;
}
}
import './editor.scss';