refactor style using scss

layouts/partials/footer.html

@@ -1,12 +1,12 @@
-<footer class="row row-mob al-c-mob col-rev-mob sm-2-mob jc-bt mtb-2">
-  <p class="c-tag">
+<footer class="flex sm:flex-col-reverse justify-between items-center">
+  <p class="mt-0 text-sm">
     {{ .Site.Copyright }} |
-    <a href="https://github.com/mivinci/hugo-theme-minima" target="_blank" rel="noopener noreferrer">Minima</a> on
-    <a href="https://gohugo.io" target="_blank" rel="noopener noreferrer">Hugo</a>
+    <a href="https://github.com/mivinci/hugo-theme-minima" target="_blank" rel="noopener noreferrer">MINIMA</a> ON
+    <a href="https://gohugo.io" target="_blank" rel="noopener noreferrer">HUGO</a>
   </p>
-  <p class="row">
+  <p class="flex items-center mt-0">
     {{ range $_, $key := .Site.Params.Social }}
-      <a class="icon mx-0_4" href="{{ $key.url }}" title="{{ $key.name }}">
+      <a class="icon mx-2" href="{{ $key.url }}" title="{{ $key.name }}">
       {{ if $key.svg }}
         {{ $key.svg | safeHTML }}
       {{ else }}

layouts/partials/header.html

@@ -1,12 +1,16 @@
 <header>
-  <h1 class="row gap-1 nowrap">
-    <div id="theme-switcher" class="btn lg-1"></div>
-    {{ .Site.Title }}
-  </h1>
-  <nav class="row">
-  {{ range .Site.Menus.main }}
-    <a class="mr-1" href="{{ .URL }}">{{ .Name }}</a>
-  {{ end }}
+  <div class="flex justify-between items-center">
+    <h1 class="mb-5 flex items-center
+    whitespace-nowrap overflow-x-auto overflow-y-hidden">
+      {{ .Site.Title }}
+    </h1>
+    <div id="theme-switcher" class="text-4xl ml-4 cursor-pointer">{{ index .Site.Params.switch 1 }}</div>
+  </div>
+  <nav class="mb-5 flex items-center
+    whitespace-nowrap overflow-x-auto overflow-y-hidden">
+    {{ range .Site.Menus.main }}
+    <a class="mr-3" href="{{ .URL }}">{{ .Name }}</a>
+    {{ end }}
   </nav>
   <hr>
 </header>

layouts/partials/ovo.html

@@ -1,5 +1,5 @@
-<div id="ovo_thread" class="mt-2">
-  <div class="col ai-c">评论插件加载中 OvO</div>
+<div id="ovo_thread" class="my-6">
+  <div class="flex flex-col items-center">评论插件加载中 OvO</div>
 </div>
 <link rel="stylesheet" href="//unpkg.com/@ovojs/ovo/dist/style.css">
 <script type="text/javascript">

layouts/partials/paginator.html

@@ -1,12 +1,12 @@
 {{ $page := $.Paginator }}
 {{ if gt $page.TotalPages 1 }}
-<div class="mt-2">
+<div class="my-5 flex justify-between">
   {{ if $page.HasPrev }}
-  <a href="{{ $page.Prev.URL }}" class="mr-2">← Newer</a>
+  <a href="{{ $page.Prev.URL }}">← Newer</a>
   {{ end }}
 
   {{ if $page.HasNext }}
-  <a href="{{ $page.Next.URL }}" class="ml-2">Older →</a>
+  <a href="{{ $page.Next.URL }}">Older →</a>
   {{ end }}
 </div>
 {{ end }}

layouts/partials/toc.html

@@ -1,5 +1,5 @@
-<details class="toc">
-  <summary class="btn">Table of Contents</summary>
+<details class="toc mt-5 mb-4">
+  <summary>Table of Contents</summary>
   <div>
     {{ .TableOfContents }}
   </div>