From 1a76946f6009f809dcfa09c8cf2f586992833b91 Mon Sep 17 00:00:00 2001
From: Leilukin <contact@leilukin.com>
Date: Sun, 23 Jun 2024 18:01:04 +0800
Subject: [PATCH] Use custom element for content wrapper

---
 src/_includes/global/content.njk | 4 ++--
 src/assets/css/content.css       | 6 +++---
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/_includes/global/content.njk b/src/_includes/global/content.njk
index 3011f51f..1ff43683 100644
--- a/src/_includes/global/content.njk
+++ b/src/_includes/global/content.njk
@@ -37,7 +37,7 @@
     {% endif %}
 </header>
 
-<div class="content__wrapper">
+<content-wrapper>
     {% if toc %}
         {% include "global/toc.njk" %}
     {% endif %}
@@ -84,7 +84,7 @@
     {% endif %}
 
     {% block shrineInfo %}{% endblock %}
-</div>
+</content-wrapper>
 
 <style>
     .breadcrumbs {
diff --git a/src/assets/css/content.css b/src/assets/css/content.css
index 70558bc0..5bfe0b0a 100644
--- a/src/assets/css/content.css
+++ b/src/assets/css/content.css
@@ -1,10 +1,10 @@
 /* MAIN CONTENT */
-.content__wrapper,
+content-wrapper,
 .content--divided {
     display: grid;
 }
 
-.content__wrapper,
+content-wrapper,
 .content--divided {
     gap: 1rem;
 }
@@ -58,7 +58,7 @@
 
 /* Desktop main content layout */
 @media only screen and (min-width: 60rem) {
-    .content__wrapper {
+    content-wrapper {
         padding: 0 var(--sz-main-padding);
         grid-template-areas: 'leftbar content rightbar';
         grid-template-columns: minmax(0, 18vw) minmax(min(60ch, 40vw), 2.5fr) minmax(0, 18vw);