_data/88x31.toml

@@ -1,16 +1,15 @@
 [buttons]
 people = [
-    { image = "soniweb", name = "soniweb [en]", link = "https://soniweb.org/" },
+    { image = "soniweb", name = "soniweb", link = "https://soniweb.org/" },
-    { image = "https://vanityruins.neocities.org/8831/8831.gif", name = "vanityruins [en]", link = "https://vanityruins.neocities.org" },
+    { image = "https://vanityruins.neocities.org/8831/8831.gif", name = "vanityruins", link = "https://vanityruins.neocities.org" },
-    { image = "https://saint-images.neocities.org/images/buttons/me-zanarkand.png", name = "saint-images [en]", link = "https://saint-images.neocities.org"},
+    { image = "https://saint-images.neocities.org/images/buttons/me-zanarkand.png", name = "saint-images", link = "https://saint-images.neocities.org"},
-    { image = "cidoku", name = "Cidoku [es] [en]", link = "https://cidoku.net" }
+    { image = "cidoku", name = "Cidoku", link = "https://cidoku.net" }
 ]
 
 misc = [
-    { image = "puyopuyo2", alt = "puyo puyo witch!!", author = "Cidoku" },
+    { image = "bookmarkme", alt = "bookmark this page NOW!" },
     { image = "blink", alt = "blinking eyes" },
     { image = "parentaladvisory", alt = "PARENTAL ADVISORY: i say FUCK a lot" },
-    { image = "bookmarkme", alt = "bookmark this page NOW!" },
     { image = "4everfriend", alt = "4everfriend!!" }
 ]
 

_data/locale.toml

@@ -1,14 +1,6 @@
-[home]
-en = "home"
-es = "inicio"
-
-[lang-available]
-en = "esta página también está disponible en"
-es = "this page also available in"
-
 [license]
 en = "Do What The Fuck You Want To Public License"
-es = "Licencia Pública WTFPL"
+es = "WTFPL"
 
 [please-visit]
 en = "please visit..."
@@ -17,15 +9,3 @@ es = "visita también..."
 [recent-posts]
 en = "recent posts"
 es = "posts recientes"
-
-[listening-to]
-en = "listening to..."
-es = "estoy escuchando..."
-
-[mobile-warning]
-en = "this site is NOT optimized for mobile (yet). the groundwork is laid but i have not finished the css so things will look very ugly for you. sorry!!"
-es = "aún NO optimizo el sitio para verlo en celulares o pantallas más chicas. aunque escribí el html pensando también en soportar celulares, la parte de css no está hecha así que se verá bien feo para ti. sorry!!"
-
-[button-author]
-en = "button by"
-es = "botón hecho por"

_includes/default_footer.njk

@@ -1,13 +0,0 @@
-<div class="footer-flex">
-    <div class="footer-left">
-        {% if show-lang-in-footer %}
-            {% include "lang-available.njk" %}
-        {% endif %}
-    </div>
-    <div class="footer-middle">
-        <div class="nekojiru-angel"></div>
-    </div>
-    <div class="footer-right">
-        <p>{% for button in 88x31.buttons.misc.slice(0, 3) %}<img src="/img/buttons/{{ button.image }}.gif" alt="{{ button.alt }}" {% if button.author %}title="{{ "button-author" | i18n }} {{ button.author }}"{% endif %}>{% endfor %}<br>est. 2025 | yuki &#169; <a href="/LICENSE.txt">{{ "license" | i18n }}</a></p>
-    </div>
-</div>

_includes/default_header.njk

@@ -1,11 +0,0 @@
-<div class="header">
-    <h1>{{ meta.sitename }}</h1>
-    <a href={{ "/" | locale_url }}><div class="header-banner" title="{{ "home" | i18n }}"></div></a>
-    <!--<div class="motd">
-        <marquee behavior="scroll" direction="left">
-            <p>{{ meta.motd }}</p>
-        </marquee>
-    </div>-->
-</div>
-
-{% include "default_navbar.njk" %}

_includes/footer.njk

@@ -0,0 +1 @@
+<p>{% for button in 88x31.buttons.misc.slice(0, 3) %}<img src="/img/buttons/{{ button.image }}.gif" alt="{{ button.alt }}">{% endfor %}<br>est. 2025 | yuki &#169; <a href="/LICENSE.txt">{{ "license" | i18n }}</a> </p>

_includes/general.scss

@@ -1,7 +1,5 @@
 @use "main-palette.scss" as mp;
 
-$breakpoint: 768px;
-
 * {
     margin: 0;
     box-sizing: border-box;
@@ -13,15 +11,4 @@ $breakpoint: 768px;
     max-width: 802px;
     margin: 8px auto;
     border: 1px solid mp.$border;
-
-    /* DEATH TO ANTIALIASING */
-    img, .header-banner, #nav-hover {
-        image-rendering: optimizeSpeed;             /* STOP SMOOTHING, GIVE ME SPEED  */
-        image-rendering: -moz-crisp-edges;          /* Firefox                        */
-        image-rendering: -o-crisp-edges;            /* Opera                          */
-        image-rendering: -webkit-optimize-contrast; /* Chrome (and eventually Safari) */
-        image-rendering: pixelated;                 /* Universal support since 2021   */
-        image-rendering: optimize-contrast;         /* CSS3 Proposed                  */
-        -ms-interpolation-mode: nearest-neighbor;   /* IE8+                           */
-    }
 }

_includes/lang-available.njk

@@ -1,3 +0,0 @@
-{% for link in page.url | locale_links %}
-<p class="lang-available" lang="{{ link.lang }}">{{ "lang-available" | i18n }} <a href="{{ link.url }}" hreflang="{{ link.lang }}">{{ link.label | lower }}</a></p>
-{% endfor %}

_layouts/base.njk

@@ -1,39 +1,40 @@
+---
+lastfm: false
+---
 <!DOCTYPE html>
 <html lang="{{ lang }}">
     <head>
-        {% block head %}
+        {% include "base_head.njk" %}
-            {% include "base_head.njk" %}       
-        {% endblock head %}
     </head>
     <body>
         <div class="main-page-wrapper">
             <div class="header-wrapper">
-                {% block header %}
+                <div class="header">
-                    {% include "default_header.njk" %}
+                    <h1>{{ meta.sitename }}</h1>
-                {% endblock header %}    
+                    <a href="/"><div class="header-banner" title="{{ meta.sitename }}"></div></a>
-            </div>
+                    <!--<div class="motd">
-            <div id="mobile-warning" class="warning">
+                        <marquee behavior="scroll" direction="left">
-                <p>{{ "mobile-warning" | i18n }}</p>
+                            <p>{{ meta.motd }}</p>
-            </div>
+                        </marquee>
+                    </div>-->
+                </div>
 
+                {% include "default_navbar.njk" %}
+            </div>
+            
             <div class="base-content-wrapper">
-                {% block content %}
+                {{ content | safe }}
-                    <!-- default fallback -->
-                {% endblock content %}
             </div>
 
             <footer>
-                {% block footer %}
+                <marquee behavior="scroll" direction="left">
-                    {% if flight %}
+                    <a href="https://www.youtube.com/embed/w1dXpAJ1qfA" target="_blank"><img src="/img/Witch-on-broom.gif" alt=""></a>
-                        <marquee behavior="scroll" direction="left">
+                </marquee>
-                            <a href="{{ flight.url }}" target="_blank"><img src="{{ flight.img }}" alt=""></a>
+                {% include "footer.njk" %}
-                        </marquee>
-                    {% endif %}
-                    {% include "default_footer.njk" %}
-                {% endblock footer %}
             </footer>
         </div>
-    
+    {% if lastfm %}
-    {% block scripts %}{% endblock scripts %}
+    <script src="/js/lastfm.js"></script>
+    {% endif %}
     </body>
 </html>

_layouts/home.njk

@@ -1,53 +1,44 @@
 ---
+layout: base
+title: home
 lastfm: true
-flight: 
-    img: "/img/Witch-on-broom.gif"
-    url: "https://www.youtube.com/embed/w1dXpAJ1qfA"
 ---
-{% extends "_layouts/base.njk" %}
+<div class="welcome-aside-left">
-
+    <div id="listening"></div>
-{% block content %}
+    <!-- TODO: fake ad
-        <div class="welcome-aside-left">
+    <div class="leftside-fake-ad"></div>
-        <div id="listening" title="{{ "listening-to" | i18n }}"></div>
+    -->
-        <!-- TODO: fake ad
+    <div class="buttons-wrapper box">
-        <div class="leftside-fake-ad"></div>
+        <h2>{{ "please-visit" | i18n }}</h2>
-        -->
+        <div class="buttons">
-        <div class="buttons-wrapper box">
+            {% for button in 88x31.buttons.people.slice(0, 5) %}
-            <h2>{{ "please-visit" | i18n }}</h2>
+            <a href="{{ button.link }}" target="_blank" title="{{ button.name }}">
-            <div class="buttons">
+            {% if button.image.startsWith("http") %}
-                {% for button in 88x31.buttons.people.slice(0, 5) %}
+                <img src="{{ button.image }}" alt="{{ button.name }}">
-                <a href="{{ button.link }}" target="_blank" title="{{ button.name }}">
+            {% else %}
-                {% if button.image.startsWith("http") %}
+                <img src="/img/buttons/{{ button.image }}.gif" alt="{{ button.name }}">
-                    <img src="{{ button.image }}" alt="{{ button.name }}">
+            {% endif %}
-                {% else %}
+            </a>
-                    <img src="/img/buttons/{{ button.image }}.gif" alt="{{ button.name }}">
-                {% endif %}
-                </a>
-                {% endfor %}
-            </div>
-        </div>
-    </div>
-
-    <div class="true-content welcome-content">
-        {{ content | safe }}
-    </div>
-
-    <div class="welcome-aside-right">
-        <div class="recent-posts box">
-            <h2>{{ "recent-posts" | i18n }}</h2>
-            <ul>
-            {% for post in collections.post | i18n_filter(5) %}
-                <li><p><a href="{{ post.url }}">{{ post.data.title }}</a><br><span class="date"> {{ post.date.toLocaleString("en-GB", {year: 'numeric', month: '2-digit', day: '2-digit'}) }}</span></p></li>
             {% endfor %}
-            </ul>
         </div>
-        <!-- TODO: better rightside home image -->
-        <img src="/img/home_rightside.jpg" id="rightside">
     </div>
-{% endblock content %}
+</div>
 
-{% block scripts %}
+<div class="welcome-content">
-    {% if lastfm %}
+    {{ content | safe }}
-        <script src="/js/lastfm.js"></script>
+    <img src="/img/nekojiru.png">
-    {% endif %}
+</div>
-{% endblock scripts %}
+
+<div class="welcome-aside-right">
+    <div class="recent-posts box">
+        <h2>{{ "recent-posts" | i18n }}</h2>
+        <ul>
+        {% for post in collections.post | i18n_filter(5) %}
+            <li><p><a href="{{ post.url }}">{{ post.data.title }}</a> | <span class="date"> {{ post.date.toLocaleString("en-GB", {year: 'numeric', month: '2-digit', day: '2-digit'}) }}</span></p></li>
+        {% endfor %}
+        </ul>
+    </div>
+    <!-- TODO: rightside home image
+    <img src="/img/home_rightside.jpg" id="rightside">
+    -->
+</div>

_layouts/post.njk

@@ -1,8 +1,4 @@
 ---
-# TODO: finish post page
+layout: base
 tags: post
 ---
-{% extends "_layouts/base.njk" %}
-{% block content %}
-    {{ content | safe }}
-{% endblock content %}

css/main.scss

@@ -4,14 +4,6 @@
 @use "fonts";
 @use "main-palette" as mp;
 
-$psize: 0.8em;
-$h1size: 1.8em;
-$h2size: 1.6em;
-$h3size: 1.4em;
-$h4size: 1.2em;
-$h5size: 1.1em;
-$h6size: 1em;
-
 body {
     color: mp.$text;
     background-color: mp.$bg;
@@ -23,33 +15,8 @@ body {
 
     p {
         font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-        font-size: $psize;
+        font-size: 0.8em;
     }
-
-    h1, h2, h3, h4, h5, h6 {
-        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-        font-weight: bold;
-        text-decoration: underline;
-        text-decoration-color: mp.$border;
-    }
-
-    h1 { font-size: $h1size; }
-    h2 { font-size: $h2size; }
-    h3 { font-size: $h3size; }
-    h4 { font-size: $h4size; }
-    h5 { font-size: $h5size; }
-    h6 { font-size: $h6size; }
-
-    .warning {
-        padding: 2px;
-        margin: 2px auto;
-        text-align: center;
-        border-top: 1px solid c.adjust($color: mp.$border, $saturation: 15%, $lightness: 10%);
-        border-bottom: 1px solid c.adjust($color: mp.$border, $saturation: 15%, $lightness: 10%);
-        background: c.adjust($color: mp.$border, $saturation: 15%, $lightness: -20%);
-    }
-
-    @media (min-width: general.$breakpoint) { #mobile-warning { display: none; }}
 }
 
 .header-wrapper {
@@ -144,10 +111,9 @@ body {
         margin: 10px;
 
         h2 {
-            padding: 3px 6px;
+            padding: 2px;
             margin-bottom: 4px;
             border-bottom: 1px solid mp.$border;
-            text-decoration: none;
             font-family: fonts.$ll;
             font-size: 1em;
             background: mp.$bg;
@@ -161,7 +127,8 @@ body {
         .now-playing-wrapper {
             width: 190px;
 
-            h3, a { text-decoration: none; }
+            h2 { margin-bottom: 0px; }
+            a { text-decoration: none; }
 
             #trackInfo {
                 display: flex;
@@ -210,7 +177,13 @@ body {
         }
     }
 
-    .welcome-content { margin: 8px 4px; }
+    .welcome-content {
+        margin: 8px 4px;
+        h1 {
+            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+            font-size: 1em;
+        }
+    }
 
     .welcome-aside-right {
         width: max-content;
@@ -222,11 +195,12 @@ body {
             width: 190px;
             ul {
                 list-style: none;
-                padding: 0 2px 4px 2px;
+                padding: 0 0 4px 0;
                 list-style: none;
                 text-align: center;
                 .date {
-                    font-size: 0.7em;
+                    vertical-align: middle;
+                    font-size: 0.9em;
                     color: c.adjust($color: mp.$text, $lightness: -10%);
                 }
             }
@@ -238,54 +212,11 @@ body {
         } 
         */
     }
-
-    .true-content {
-        h1, h2, h3, h4, h5, h6 { margin: 2px 4px; }
-        p { margin: 8px 4px; }
-        ul {
-            /* TODO: better list image
-            list-style-image: url(/img/icons/apple.png); */
-            list-style-type: disc;
-            li {
-                font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-                font-size: $psize;
-                margin: auto;
-            }
-        }
-        img { 
-            display: block;
-            margin: 12px auto;
-        }
-    }
 }
 
-footer {
+footer p {
-    p {
+    margin: 2px;
-        margin: 2px;
+    font-size: 0.7em;
-        font-size: 0.7em;
+    text-align: right;
-        text-align: right;
-    }
-    .footer-flex {
-        display: flex;
-        flex-direction: row;
-        align-items: flex-start;
-        justify-content: space-between;
-        width: 100%;
-        .footer-left {
-            margin: auto 0px 0px 0px;
-        }
-        .footer-middle .nekojiru-angel { 
-            background-image: url("/img/nekojiru.png");
-            width: 64px;
-            height: 64px;
-            margin: auto 0px 0px 0px;
-            vertical-align: bottom;
-            &:hover { background-image: url("/img/nekojiruhalo.png"); }
-        }
-        
-        .footer-right {
-            margin: auto 0px 0px 0px;
-        }
-    }
 }
 

eleventy.config.js

@@ -26,8 +26,7 @@ module.exports = function(eleventyConfig) {
 
     eleventyConfig.addPlugin(eleventySass);
     eleventyConfig.addPlugin(I18nPlugin, {
-        defaultLanguage: "en",
+        defaultLanguage: "en"
-        errorMode: "allow-fallback" // /en/ -> /
     });
     eleventyConfig.addDataExtension("toml", (contents) => toml.parse(contents));
 
@@ -41,7 +40,7 @@ module.exports = function(eleventyConfig) {
         translations,
         fallbackLocales: {
             "*": "en",
-        }
+        },
     });
 
     return {

en/index.md

@@ -1,12 +1,5 @@
 ---
-title: home
 layout: home
 ---
-#### hey...
+# hey...
-welcome to my site!! as with every website this is a heavy work in progress. however my priorities right now are:
+welcome to my site!! not much is done yet but please have a look around.
-- atom feed
-- mobile support
-- 404 page
-- all pages marked as "under construction"
-
-![rakka hairbush fail](/img/rakka-hairbrush-fail.gif)

es/index.md

@@ -1,12 +1,5 @@
 ---
 layout: home
-title: home
 ---
-#### holaaa
+# oye...
-bienvenid@ a mi sitio!! aun no lo termino pero revisa lo que tenga hecho <3 pienso terminar primero:
+bienvenido a mi sitio!! aun no lo termino pero revisa lo que tenga hecho <3
-- un feed rss (atom)
-- mejor soporte para celulares
-- página 404
-- terminar todas las páginas marcadas como "en construcción"
-
-![rakka hairbush fail](/img/rakka-hairbrush-fail.gif)

js/lastfm.js

@@ -23,7 +23,7 @@ const getTrack = async () => {
     // ARTIST: json.track.artist['#text']
 
     document.getElementById("listening").innerHTML = `
-    <div class="now-playing-wrapper box">
+    <div class="now-playing-wrapper box" title="listening to...">
         <!--<h2>listening to:</h2>-->
             <a href="https://fm.yuki.k4w411.net/" target="_blank">
                 <div id="trackInfo">