Use custom element for content wrapper

This commit is contained in:
Helen Chong 2024-06-23 18:01:04 +08:00
parent 6b0edb047a
commit 5b49f2d4b4
2 changed files with 5 additions and 5 deletions

View File

@ -37,7 +37,7 @@
{% endif %} {% endif %}
</header> </header>
<div class="content__wrapper"> <content-wrapper>
{% if toc %} {% if toc %}
{% include "global/toc.njk" %} {% include "global/toc.njk" %}
{% endif %} {% endif %}
@ -84,7 +84,7 @@
{% endif %} {% endif %}
{% block shrineInfo %}{% endblock %} {% block shrineInfo %}{% endblock %}
</div> </content-wrapper>
<style> <style>
.breadcrumbs { .breadcrumbs {

View File

@ -1,10 +1,10 @@
/* MAIN CONTENT */ /* MAIN CONTENT */
.content__wrapper, content-wrapper,
.content--divided { .content--divided {
display: grid; display: grid;
} }
.content__wrapper, content-wrapper,
.content--divided { .content--divided {
gap: 1rem; gap: 1rem;
} }
@ -58,7 +58,7 @@
/* Desktop main content layout */ /* Desktop main content layout */
@media only screen and (min-width: 60rem) { @media only screen and (min-width: 60rem) {
.content__wrapper { content-wrapper {
padding: 0 var(--sz-main-padding); padding: 0 var(--sz-main-padding);
grid-template-areas: 'leftbar content rightbar'; grid-template-areas: 'leftbar content rightbar';
grid-template-columns: minmax(0, 18vw) minmax(min(60ch, 40vw), 2.5fr) minmax(0, 18vw); grid-template-columns: minmax(0, 18vw) minmax(min(60ch, 40vw), 2.5fr) minmax(0, 18vw);