change theme switcher

assets/css/dark.css

@@ -28,10 +28,7 @@
 
 --post-info-color: grey;
 
---switcher-color: #333;
+--switcher-color: #fff;
---switcher-bg-color: #fff;
---switcher-border-color: #333333
---switcher-border-radius: 5px;
 
 --svg-color: #ccc;
 --svg-state-color:#ff5858;

assets/css/light.css

@@ -30,10 +30,7 @@
 
     --post-info-color: grey;
 
-    --switcher-color: #fff;
+    --switcher-color: #333;
-    --switcher-bg-color: #333; 
-    --switcher-border-color: #eeeeee;
-    --switcher-border-radius: 5px;
 
     --svg-color: #333;
     --svg-state-color: #a31d1d;

assets/css/main.css

@@ -234,6 +234,12 @@ header h2 {
     margin-top: 1em;
 }
 
+.header-top-left {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
 .site-title {
     display: inline;
     white-space: nowrap;
@@ -258,7 +264,7 @@ header nav a {
 /* Social icons */
 .social-icons {
     display: inline;
-    margin: 1em 0 0 3em;
+    margin: 1em 0 0 1em;
     padding: 0;
     list-style-type: none;
 }
@@ -733,12 +739,9 @@ ul.language-select > li, ul.footer-menu > li {
 
 .theme-switcher {
     color: var(--switcher-color);
-    background: var(--switcher-bg-color);
+    /* padding: 0.5em 1em; */
-    padding: 0.5em 1em;
+    margin: 1em 0 0 1.5em;
-    font-size: 16px;
+    cursor: pointer;
-    border: 1px solid var(--switcher-border-color);
-    border-radius: var(--switcher-border-radius);
-    margin-bottom: 1em;
 }
 
 .h-card {

layouts/partials/header.html

@@ -1,10 +1,11 @@
 <div class="header-top">
     <div class="header-top-left">
         {{ partial "site-title.html" . }}
+        {{ partial "theme-switcher.html" . }}  
         {{ partial "social.html" . }}
     </div>
     <div class="header-top-right">
-        {{ partial "theme-switcher.html" . }}  
+        
     </div>
 </div>