2024.06.18 Fix problems caused by missing <!DOCTYPE>. Take flex l…

…ayout.

.github/workflows/pagine.yml

@@ -32,7 +32,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Install Pagine
-        run: go install github.com/webpagine/pagine/v2/cmd/pagine@latest
+        run: go install github.com/webpagine/pagine/v2/cmd/pagine@v2.1.0
 
       - name: Checkout
         uses: actions/checkout@v4

mainpage.html

@@ -1,7 +1,5 @@
-<div style="text-align: center">
-
-<div style="min-height: 100%">
-<div style="block-size: 15%"></div>
+<div style="height: 100vh; display: flex; flex-direction: column; align-items: center; gap: 1vh; text-align: center">
+<div style="height: 15vh"></div>
 
 <img src="/assets/img/pagine_icon.svg" width="200" alt="logo"/>
 <p style="font-size: 200%">Quickly build web content with frames from templates.<br/>Just in milliseconds.</p>
@@ -11,7 +9,7 @@
 <a class="button" target="_blank" href="https://github.com/webpagine/pagine">VIEW SOURCE CODE</a>
 </div>
 
-<div style="block-size: 10%"></div>
+<div style="height: 10vh"></div>
 <a target="_blank" href="https://github.com/webpagine/pagine/stargazers"><img alt="GitHub Repo stars" height="30" src="https://img.shields.io/github/stars/webpagine/pagine"></a>
 </div>
 
@@ -61,11 +59,11 @@ <h1>Build what you want.</h1>
 Content, appearance and metadata are separated, which keeps the directories clear.
 </section>
 
-<section>
+<section style="text-align: center">
 <h1>Leave footprints on your journey.</h1>
 <div style="min-height: 5%"></div>
 <a class="button button-filled" target="_blank" href="https://github.com/webpagine/get-started">GET STARTED WITH PAGINE</a>
 <div style="min-height: 10%"></div>
 </section>
 
-</div>
+<div style="height: 10vh"></div>