Add highlight to current section on header links, add rating warning on social page, add bribribribribri's website to hotlinks.

.cache/mastodon.json

@@ -1,5 +1,5 @@
 {
-  "lastFetched": "2026-07-05T15:35:13.105Z",
+  "lastFetched": "2026-07-05T16:45:30.248Z",
   "posts": [
     {
       "date": "2026-07-03T01:51:37.604Z",

site/_data/i18n.cjs

@@ -98,7 +98,9 @@ module.exports = {
     changes: "changes",
     readingTime: "Reading time",
     mastodonPageDescription: "This is an archive of all my Mastodon posts.",
-    addMe: "Add me"
+    addMe: "Add me",
+    socialContentNotRated: "Social content is not rated and may mention topics not appropriate for all ages.",
+    clickHereToContinue: "Click here to continue"
   },
   pt: {
     language: "português",
@@ -172,6 +174,8 @@ module.exports = {
     changes: "mudanças",
     readingTime: "Tempo de leitura",
     mastodonPageDescription: "Essa página lista todas as minhas postagens do Mastodon.",
-    addMe: "Me adicionar"
+    addMe: "Me adicionar",
+    socialContentNotRated: "Conteúdo das redes sociais não é monitorado e pode conter tópicos não apropriados para todas as idades.",
+    clickHereToContinue: "Clique aqui para continuar"
   }
 };

site/_includes/header.njk

@@ -21,10 +21,10 @@
     
         <ul id="headerLinks">
             {% if langKey %}
-            <a href="{{ ('/' ~ langKey ~ '/') | url }}">{{ i18n[langKey].home }}</a>
-            <a href="{{ ('/' ~ langKey ~ '/blog/') | url }}">blog</a>
-            <a href="{{ ('/' ~ langKey ~ '/misc/') | url }}">misc</a>
-            <a href="{{ ('/' ~ langKey ~ '/social/') | url }}">social</a>
+            <a href="{{ ('/' ~ langKey ~ '/') | url }}"{% if headerLink == "home" %} style="text-decoration: underline; color: white;"{% endif %}>{{ i18n[langKey].home }}</a>
+            <a href="{{ ('/' ~ langKey ~ '/blog/') | url }}" {% if headerLink == "blog" %} style="text-decoration: underline; color: white;"{% endif %}>blog</a>
+            <a href="{{ ('/' ~ langKey ~ '/misc/') | url }}" {% if headerLink == "misc" %} style="text-decoration: underline; color: white;"{% endif %}>misc</a>
+            <a href="{{ ('/' ~ langKey ~ '/social/') | url }}" {% if headerLink == "social" %} style="text-decoration: underline; color: white;"{% endif %}>social</a>
             {% endif %}
             {% if langKey == undefined %}
             <a href="{{ ('/') | url }}">home</a>

site/_includes/post.njk

@@ -1,6 +1,7 @@
 ---
 layout: base.njk
 title: Adrian Victor:Blog
+headerLink: blog
 ---
 {% set altLanguages = collections.post | alternateLanguages(postId, langKey) %}
 {% from "macros.njk" import videoCard with context %}

site/blog.njk

@@ -6,6 +6,7 @@ pagination:
 permalink: "/{{ langKey }}/blog/index.html"
 layout: base.njk
 title: Adrian Victor:Blog
+headerLink: blog
 ---
 
 <main>

site/index.njk

@@ -5,6 +5,7 @@ pagination:
     alias: langKey
 permalink: "/{{ langKey }}/index.html"
 layout: base.njk
+headerLink: home
 ---
 {% from "macros.njk" import i88x31 with context %}
 {% from "macros.njk" import videoCard with context %}
@@ -196,6 +197,7 @@ layout: base.njk
         <div class="centeredItemsBox">
             <a href="https://www.youtube.com/@mrnandokk">{{ i88x31("mrnandokk.gif", i18n[langKey].mrnandoChannel, false) }}</a>
             <a href="https://appak.neocities.org/">{{ i88x31("appak.png", "appak", false) }}</a>
+            <a href="https://bribribribribri.xyz/" target="_blank">{{ i88x31("brigif.gif", "bribribribribri", false) }}</a>
         </div>
         <p style="text-align: center;"><a href="{{ ('/' ~ langKey ~ '/misc/hotlinking') | url }}">{{ i18n[langKey].addMe }}?</a></p>
     </div>

site/misc.njk

@@ -6,6 +6,7 @@ pagination:
 permalink: "/{{ langKey }}/misc/index.html"
 layout: base.njk
 title: Adrian Victor:Misc
+headerLink: misc
 ---
 
 <main>

site/misc/misc.11tydata.cjs

@@ -27,5 +27,6 @@ module.exports = {
     permalink: data => {
         return `/${data.langKey}/misc/${data.page.fileSlug}/`;
     },
-    tags: "misc"
+    tags: "misc",
+    headerLink: "misc"
 };

site/posts/posts.11tydata.cjs

@@ -1,5 +1,6 @@
 let data = {
 	layout: "_includes/post.njk",
+	headerLink: "blog",
 	eleventyComputed: {
 		lastModified: function(data) {
 			const fs = require('fs');

site/social.njk

@@ -6,7 +6,12 @@ pagination:
 permalink: "/{{ langKey }}/social/index.html"
 layout: base.njk
 title: Adrian Victor:Social
+headerLink: social
 ---
+<script>
+    const clickHereToContinueLocalized = "{{ i18n[langKey].clickHereToContinue }}";
+</script>
+<script src="{{ '/static/scripts/social.js' | url }}" defer></script>
 <aside>
     <div id="socialAside">
         <div>
@@ -18,8 +23,11 @@ title: Adrian Victor:Social
     {% include 'widgets/internetometer-aside.html' %}
 </aside>
 <main>
+    <div id="socialAlert" class="box alert" style="margin-bottom: 1em;">
+            <p>{{ i18n[langKey].socialContentNotRated }}</p>
+        </div>
     <p>{{ i18n[langKey].mastodonPageDescription }}</p>
-    <ul>
+    <ul id="socialPosts">
       {% for post in mastodon.posts %}
         <hr class="nomargin">
         <div class="mastodonPost">

static/main.css

@@ -152,12 +152,17 @@ h2 {
 textarea,
 input,
 button {
-    border: medium solid var(--theme-color-lighter);
-    background-color: black;
+    transition: .2s;
+    border: medium solid rgba(255, 255, 255, 0.6);
+    background-color: rgba(0, 0, 0, 0.2);
     color: white;
     padding: 0.6em;
 }
 
+button:hover {
+    border-color: white;
+}
+
 img {
     max-width: 100%;
 }
@@ -1144,6 +1149,16 @@ header div:first-child {
   -o-animation: fire-animation .65s ease-in-out infinite alternate;
 }
 
+.blurred {
+    filter: blur(4px);
+    user-select: none;
+    pointer-events: none;
+}
+
+#socialPosts {
+    transition: .4s;
+}
+
 /* Animations */
 
 @keyframes ellipsis-loader {

static/scripts/social.js

@@ -0,0 +1,13 @@
+const socialPosts = document.querySelector('#socialPosts');
+const socialAlert = document.querySelector('#socialAlert');
+
+socialPosts.classList.add('blurred');
+
+const continueButton = document.createElement('button');
+continueButton.innerText = clickHereToContinueLocalized;
+continueButton.addEventListener('click', () => {
+    socialPosts.classList.remove('blurred');
+    socialAlert.remove();
+})
+
+socialAlert.appendChild(continueButton);