From 030c2f0f9a60de640965e97cd52d2c46e6adaa3a Mon Sep 17 00:00:00 2001
From: Leilukin <contact@leilukin.com>
Date: Sat, 13 Apr 2024 16:52:07 +0800
Subject: [PATCH] Adjust main layout order and width

---
 src/assets/css/main.css | 32 ++++++++++++++++----------------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/assets/css/main.css b/src/assets/css/main.css
index 32ab1382..48db3475 100644
--- a/src/assets/css/main.css
+++ b/src/assets/css/main.css
@@ -259,7 +259,7 @@ article:not(.divided-article),
 }
 
 article, .content-container {
-    order: 1;
+    order: 2;
 }
 
 .sidebar--sticky {
@@ -275,7 +275,7 @@ article, .content-container {
 }
 
 .left-sidebar {
-    order: 2;
+    order: 1;
 }
 
 .right-sidebar {
@@ -290,11 +290,21 @@ article, .content-container {
 /* Tablet main content layout */
 @media only screen and (min-width: 43.75rem) {
     main {
+        width: 43.75rem;
+    }
+}
+
+/* Desktop main content layout */
+@media only screen and (min-width: 60rem) {
+    main {
+        width: 60rem;
+        display: flex;
         flex-direction: row;
+        justify-content: center;
     }
 
     aside {
-        width: 10rem;
+        width: 12rem;
     }
 
     article, .content-container {
@@ -311,23 +321,13 @@ article, .content-container {
     }
 }
 
-/* Desktop main content layout */
-@media only screen and (min-width: 60rem) {
+@media only screen and (min-width: 80rem) {
     main {
-        width: 60rem;
-        display: flex;
-        flex-direction: row;
-        justify-content: center;
+        width: 75rem;
     }
 
     aside {
-        width: 12rem;
-    }
-}
-
-@media only screen and (min-width: 65rem) {
-    main {
-        width: 65rem;
+        width: 15rem;
     }
 }