fix: footer position

Closes #1439
HEIGE-PCloud · Feb 20, 2025 · cee30bd · cee30bd
1 parent 1a5a232
commit cee30bd
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -897,6 +897,14 @@ html.dark {
   max-height: 100%;
 }
 
+.tw-min-h-full {
+  min-height: 100%;
+}
+
+.tw-min-h-screen {
+  min-height: 100vh;
+}
+
 .tw-w-full {
   width: 100%;
 }
@@ -905,6 +913,10 @@ html.dark {
   max-width: 100%;
 }
 
+.tw-flex-1 {
+  flex: 1 1 0%;
+}
+
 .tw-translate-y-\[-2px\] {
   --tw-translate-y: -2px;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
@@ -30,12 +30,12 @@
             By default, instant.page preloads 65 ms after hovering a link and when a mobile user starts touching their display. There are other options.
             Preloading links as soon as they’re visible. On small mobile devices (such as smartphones) if you want your pages to be instant in more situations you can preload links as soon as they’re visible.
 */}}
-<body data-instant-intensity="viewport">
+<body data-instant-intensity="viewport" class="tw-flex tw-min-h-screen tw-flex-col">
     {{- partial "theme.html" . -}}
     <div id="back-to-top"></div>
     <div id="mask"></div>
     {{- partial "header.html" . -}}
-    <main class="tw-mx-4">
+    <main class="tw-mx-4 tw-flex-1">
         {{- block "content" . }}{{ end -}}
     </main>
     {{- partial "footer.html" . -}}