chore: update docs and style (#269)

assets/css/_core/_base.scss

@@ -24,7 +24,7 @@ html {
 ::selection {
   background-color: $selection-color;
 
-  .dark & {
+  [theme=dark] & {
     background-color: $selection-color-dark;
   }
 }
@@ -35,7 +35,7 @@ body {
   overflow-wrap: break-word;
   scrollbar-color: auto;
 
-  &.dark {
+  &[theme=dark] {
     color: $global-font-color-dark;
     background-color: $global-background-color-dark;
   }

assets/css/_core/_media.scss

@@ -2,14 +2,6 @@
   .page {
     width: 56%;
   }
-
-  #header-desktop .header-wrapper {
-    padding: 0 8vw;
-  }
-
-  .search-dropdown.desktop {
-    right: 8vw;
-  }
 }
 
 @media only screen and (max-width: 1200px) {
@@ -18,11 +10,11 @@
   }
 
   #header-desktop .header-wrapper {
-    padding: 0 4vw;
+    padding-right: 1rem;
   }
 
   .search-dropdown.desktop {
-    right: 4vw;
+    right: 1rem;
   }
 }
 
@@ -38,6 +30,10 @@
   .page {
     width: 80%;
   }
+
+  #header-desktop .header-wrapper {
+    padding-left: 1rem;
+  }
 }
 
 @media only screen and (max-width: 680px) {