From 25808e0d08203d2de3491e36781eb10d67879637 Mon Sep 17 00:00:00 2001
From: yourfriendoss <sofija@duck.com>
Date: Tue, 30 Sep 2025 13:24:59 +0300
Subject: [PATCH] improve the site a bit, make it work on mobile and have a
 better user experience with fonts

---
 index.html | 440 +++++++++++++++++++++++++++++------------------------
 1 file changed, 240 insertions(+), 200 deletions(-)

diff --git a/index.html b/index.html
index d909398..a700a1f 100644
--- a/index.html
+++ b/index.html
@@ -1,208 +1,248 @@
-<div id="app">
-    <header
-        style="
-            display: flex;
-            align-items: center;
-            background: linear-gradient(
-                90deg,
-                #b22234 0%,
-                #ffffff 50%,
-                #b22234 100%
-            );
-            padding: 1rem;
-        "
-    >
-        <img
-            src="https://upload.wikimedia.org/wikipedia/commons/8/84/Flag_of_Latvia.svg"
-            alt="Latvian Flag"
-            style="height: 40px; margin-right: 1rem"
-        />
-        <h1 style="margin: 0; font-family: &quot;Segoe UI&quot;, sans-serif">
-            LV Modpaka's serveris
-        </h1>
-    </header>
-    <nav
-        style="display: flex; gap: 1rem; background: #eee; padding: 0.5rem 1rem"
-    >
-        <button
-            v-on:click="page = 'home'"
-            :class="{active: page === 'home'}"
-            style="
-                border: none;
-                background: none;
-                cursor: pointer;
-                font-size: 1rem;
-            "
-        >
-            Mājas
-        </button>
-        <button
-            v-on:click="page = 'docs'"
-            :class="{active: page === 'docs'}"
-            style="
-                border: none;
-                background: none;
-                cursor: pointer;
-                font-size: 1rem;
-            "
-        >
-            Dokumentācija
-        </button>
-    </nav>
-    <main style="padding: 2rem">
-        <section v-if="page === 'home'">
-            <div
-                style="display: flex; align-items: center; margin-bottom: 2rem"
-            >
-                <a href="/LV%20Modpaka.zip" target="_blank">
-                    <h2 style="margin: 0">Lejupielādē šeit!</h2>
-                </a>
-            </div>
-            <h3>Galvanās fīčas</h3>
-            <ul>
-                <li>
-                    <strong>Veiktspējas modifikācijas:</strong> Mēs izmantojam
-                    <em>Sodium</em> un <em>Lithium</em>, lai nodrošinātu
-                    vienmērīgu spēles gaitu, kā arī <em>C2ME</em> un
-                    <em>EntityCulling</em>, lai nodrošinātu ātrdarbību pat tad,
-                    ja spēlē piedalās daudz spēlētāju un ir daudz būvju.
-                </li>
-                <li>
-                    <strong>Tehnoloģijas un automatizācija:</strong>
-                    Modifikācijas, piemēram, <em>CC: Tweaked</em> (programmējami
-                    datori), <em>Simple Copper Pipes</em>,
-                    <em>Large Fluid Tank</em> un <em>Energized Power</em>, ļauj
-                    jums būvēt visdažādākās mašīnas un ierīces.
-                </li>
-                <li>
-                    <strong>Dekorēšana un dzīves kvalitāte:</strong>
-                    <em>Cooking for Blockheads</em> padara virtuves patiesi
-                    lietderīgas, <em>Vanilla Backpacks</em> un
-                    <em>Item Collectors</em> palīdz ar uzglabāšanu, bet
-                    <em>Jade</em> sniedz informāciju par visu, ko tu apskati.
-                </li>
-                <li>
-                    <strong>Pasaule un izpēte:</strong>
-                    <em>Oh The Biomes You'll Go</em> un
-                    <em>Serene Seasons</em> pievieno jaunas biomas un sezonas
-                    izmaiņas, tādējādi pasaule šķiet svaiga un dzīva.
-                </li>
-                <li>
-                    <strong>Jautras papildfunkcijas:</strong> Vēlies sēdēt uz
-                    kāpnēm? <em>Sit!</em> ļauj to darīt.
-                    <em>Mutant Monsters</em> pievieno dažus jaunos savvaļas
-                    mobus, un <em>Xaero's Minimap</em> palīdz tev nekad
-                    neapmaldīties.
-                </li>
-                <li>
-                    <strong>Anti-Grief & Server Tools:</strong>
-                    <em>Anti-Xray</em> un
-                    <em>Convenient MobGriefing</em> nodrošina taisnīgumu un
-                    jautrību visiem.
-                </li>
-            </ul>
-            <h3>Kapēc pievienoties?</h3>
-            <p>
-                Mēs izveidojām šo modpack, lai tas būtu vieta, kur tu vari
-                izpaust savu radošumu ar tehnoloģiju palīdzību, būvēt skaistas
-                bāzes un izpētīt pasauli, kas pastāvīgi mainās. Neatkarīgi no
-                tā, vai tev patīk automatizācija, lauksaimniecība, dekorēšana
-                vai vienkārši atpūta, šeit tu atradīsi kaut ko sev piemērotu.
-                Turklāt mēs cenšamies nodrošināt draudzīgu vidi bez kavēšanās,
-                lai jūs varētu patiesi baudīt spēli kopā ar citiem.
-                Pievienojieties mums un redziet, ko jūs varat uzcelt!
-            </p>
-            <div
+<html>
+    <head>
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet" />
+        <title>LV modpakas serveris</title>
+    </head>
+    <body></body>
+        <div id="app">
+            <header
                 style="
+                    display: flex;
+                    align-items: center;
+                    background: linear-gradient(
+                        90deg,
+                        #b22234 0%,
+                        #ffffff 50%,
+                        #b22234 100%
+                    );
+                    padding: 1rem;
+                "
+            >
+                <img
+                    src="https://upload.wikimedia.org/wikipedia/commons/8/84/Flag_of_Latvia.svg"
+                    alt="Latvian Flag"
+                    style="height: 40px; margin-right: 1rem"
+                />
+                <h1
+                    style="
+                        margin: 0;
+                        font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
+                    "
+                >
+                    LV Modpaka's serveris
+                </h1>
+            </header>
+            <nav
+                style="
+                    display: flex;
+                    gap: 1rem;
+                    background: #eee;
+                    padding: 0.5rem 1rem;
+                    font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
+                "
+            >
+                <button
+                    v-on:click="page = 'home'"
+                    :class="{active: page === 'home'}"
+                    style="
+                        border: none;
+                        background: none;
+                        cursor: pointer;
+                        font-size: 1rem;
+                        font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
+                    "
+                >
+                    Mājas
+                </button>
+                <button
+                    v-on:click="page = 'docs'"
+                    :class="{active: page === 'docs'}"
+                    style="
+                        border: none;
+                        background: none;
+                        cursor: pointer;
+                        font-size: 1rem;
+                        font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
+                    "
+                >
+                    Dokumentācija
+                </button>
+            </nav>
+            <main style="padding: 2rem; font-family: 'Inter', 'Segoe UI', Arial, sans-serif;">
+                <section v-if="page === 'home'">
+                    <div
+                        style="
+                            display: flex;
+                            align-items: center;
+                            margin-bottom: 2rem;
+                        "
+                    >
+                        <a href="/LV%20Modpaka.zip" target="_blank">
+                            <h2 style="margin: 0">Lejupielādē šeit!</h2>
+                        </a>
+                    </div>
+                    <h3>Galvanās fīčas</h3>
+                    <ul>
+                        <li>
+                            <strong>Veiktspējas modifikācijas:</strong> Mēs
+                            izmantojam <em>Sodium</em> un <em>Lithium</em>, lai
+                            nodrošinātu vienmērīgu spēles gaitu, kā arī
+                            <em>C2ME</em> un <em>EntityCulling</em>, lai
+                            nodrošinātu ātrdarbību pat tad, ja spēlē piedalās
+                            daudz spēlētāju un ir daudz būvju.
+                        </li>
+                        <li>
+                            <strong>Tehnoloģijas un automatizācija:</strong>
+                            Modifikācijas, piemēram,
+                            <em>CC: Tweaked</em> (programmējami datori),
+                            <em>Simple Copper Pipes</em>,
+                            <em>Large Fluid Tank</em> un
+                            <em>Energized Power</em>, ļauj jums būvēt
+                            visdažādākās mašīnas un ierīces.
+                        </li>
+                        <li>
+                            <strong>Dekorēšana un dzīves kvalitāte:</strong>
+                            <em>Cooking for Blockheads</em> padara virtuves
+                            patiesi lietderīgas, <em>Vanilla Backpacks</em> un
+                            <em>Item Collectors</em> palīdz ar uzglabāšanu, bet
+                            <em>Jade</em> sniedz informāciju par visu, ko tu
+                            apskati.
+                        </li>
+                        <li>
+                            <strong>Pasaule un izpēte:</strong>
+                            <em>Oh The Biomes You'll Go</em> un
+                            <em>Serene Seasons</em> pievieno jaunas biomas un
+                            sezonas izmaiņas, tādējādi pasaule šķiet svaiga un
+                            dzīva.
+                        </li>
+                        <li>
+                            <strong>Jautras papildfunkcijas:</strong> Vēlies
+                            sēdēt uz kāpnēm? <em>Sit!</em> ļauj to darīt.
+                            <em>Mutant Monsters</em> pievieno dažus jaunos
+                            savvaļas mobus, un <em>Xaero's Minimap</em> palīdz
+                            tev nekad neapmaldīties.
+                        </li>
+                        <li>
+                            <strong>Anti-Grief & Server Tools:</strong>
+                            <em>Anti-Xray</em> un
+                            <em>Convenient MobGriefing</em> nodrošina taisnīgumu
+                            un jautrību visiem.
+                        </li>
+                    </ul>
+                    <h3>Kapēc pievienoties?</h3>
+                    <p>
+                        Mēs izveidojām šo modpack, lai tas būtu vieta, kur tu
+                        vari izpaust savu radošumu ar tehnoloģiju palīdzību,
+                        būvēt skaistas bāzes un izpētīt pasauli, kas pastāvīgi
+                        mainās. Neatkarīgi no tā, vai tev patīk automatizācija,
+                        lauksaimniecība, dekorēšana vai vienkārši atpūta, šeit
+                        tu atradīsi kaut ko sev piemērotu. Turklāt mēs cenšamies
+                        nodrošināt draudzīgu vidi bez kavēšanās, lai jūs varētu
+                        patiesi baudīt spēli kopā ar citiem. Pievienojieties
+                        mums un redziet, ko jūs varat uzcelt!
+                    </p>
+                    <div
+                        style="
                     margin-top: 2rem;
                     border-top: 1px solid #ccc;
                     padding-top: 1rem;
-                "
-            >
-                <strong>labs ass serveris bruh dont fw me</strong>
-            </div>
-        </section>
-        <section v-if="page === 'docs'">
-            <h2>Modu Dokumentācija</h2>
-            <p>Atrodi linkus priekš visiem mūsu modiem šeit:</p>
-            <ul>
-                <li v-for="mod in mods" :key="mod.name">
-                    <a :href="mod.link" target="_blank">{{ mod.name }}</a>
-                </li>
-            </ul>
-        </section>
-    </main>
-</div>
-<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.min.js"></script>
-<script src="/fast-toml.js"></script>
-<script type="module">
-    new Vue({
-        el: "#app",
-        data: {
-            page: "home",
-            mods: [],
-        },
-        created: function () {
-            var self = this;
-            // Fetch index.toml
-            fetch("modpack/index.toml")
-                .then(function (response) {
-                    return response.text();
-                })
-                .then(function (indexTomlText) {
-                    var indexData = TOML.parse(indexTomlText);
-                    // indexData.files is an array of mod file objects
-                    var modFiles = (indexData.files || []).filter(function (f) {
-                        return (
-                            f.file &&
-                            f.file.startsWith("mods/") &&
-                            f.file.endsWith(".pw.toml")
-                        );
-                    });
+      ?          "
+                    >
+                        <strong>labs ass serveris bruh dont fw me</strong>
+                    </div>
+                </section>
+                <section v-if="page === 'docs'">
+                    <h2>Modu Dokumentācija</h2>
+                    <p>Atrodi linkus priekš visiem mūsu modiem šeit:</p>
+                    <ul>
+                        <li v-for="mod in mods" :key="mod.name">
+                            <a :href="mod.link" target="_blank"
+                                >{{ mod.name }}</a
+                            >
+                        </li>
+                    </ul>
+                </section>
+            </main>
+        </div>
+        <script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.min.js"></script>
+        <script src="/fast-toml.js"></script>
+        <script type="module">
+            new Vue({
+                el: "#app",
+                data: {
+                    page: "home",
+                    mods: [],
+                },
+                created: function () {
+                    var self = this;
+                    // Fetch index.toml
+                    fetch("modpack/index.toml")
+                        .then(function (response) {
+                            return response.text();
+                        })
+                        .then(function (indexTomlText) {
+                            var indexData = TOML.parse(indexTomlText);
+                            // indexData.files is an array of mod file objects
+                            var modFiles = (indexData.files || []).filter(
+                                function (f) {
+                                    return (
+                                        f.file &&
+                                        f.file.startsWith("mods/") &&
+                                        f.file.endsWith(".pw.toml")
+                                    );
+                                },
+                            );
 
-                    // For each mod file, fetch and parse its TOML
-                    var modPromises = modFiles.map(function (modFile) {
-                        var modTomlPath = "modpack/" + modFile.file;
-                        return fetch(modTomlPath)
-                            .then(function (response) {
-                                return response.text();
-                            })
-                            .then(function (modTomlText) {
-                                var modData = TOML.parse(modTomlText);
-                                var modrinth =
-                                    modData.update && modData.update.modrinth;
-                                if (modData.side == "server") {
-                                    return null;
-                                }
-                                if (modrinth && modrinth["mod-id"]) {
-                                    return {
-                                        name:
-                                            modData.name || modrinth["mod-id"],
-                                        link:
-                                            "https://modrinth.com/mod/" +
-                                            modrinth["mod-id"],
-                                    };
-                                } else {
-                                    // fallback: just show name, no link
-                                    return {
-                                        name: modData.name || modFile.file,
-                                        link: "#",
-                                    };
-                                }
-                            })
-                            .catch(function (err) {
-                                // If mod TOML fails, skip it
-                                return null;
+                            // For each mod file, fetch and parse its TOML
+                            var modPromises = modFiles.map(function (modFile) {
+                                var modTomlPath = "modpack/" + modFile.file;
+                                return fetch(modTomlPath)
+                                    .then(function (response) {
+                                        return response.text();
+                                    })
+                                    .then(function (modTomlText) {
+                                        var modData = TOML.parse(modTomlText);
+                                        var modrinth =
+                                            modData.update &&
+                                            modData.update.modrinth;
+                                        if (modData.side == "server") {
+                                            return null;
+                                        }
+                                        if (modrinth && modrinth["mod-id"]) {
+                                            return {
+                                                name:
+                                                    modData.name ||
+                                                    modrinth["mod-id"],
+                                                link:
+                                                    "https://modrinth.com/mod/" +
+                                                    modrinth["mod-id"],
+                                            };
+                                        } else {
+                                            // fallback: just show name, no link
+                                            return {
+                                                name:
+                                                    modData.name ||
+                                                    modFile.file,
+                                                link: "#",
+                                            };
+                                        }
+                                    })
+                                    .catch(function (err) {
+                                        // If mod TOML fails, skip it
+                                        return null;
+                                    });
                             });
-                    });
 
-                    Promise.all(modPromises).then(function (modsArr) {
-                        // Filter out nulls (failed loads)
-                        self.mods = modsArr.filter(function (m) {
-                            return m;
+                            Promise.all(modPromises).then(function (modsArr) {
+                                // Filter out nulls (failed loads)
+                                self.mods = modsArr.filter(function (m) {
+                                    return m;
+                                });
+                            });
                         });
-                    });
-                });
-        },
-    });
-</script>
+                },
+            });
+        </script>
+    </body>
+</html>