diff --git a/src/_includes/simple_page.njk b/src/_includes/simple_page.njk
index 44f3000..b95306e 100644
--- a/src/_includes/simple_page.njk
+++ b/src/_includes/simple_page.njk
@@ -9,8 +9,9 @@
+
{% if load_comments_script %}
-
+
{% endif %}
diff --git a/static/assets/scripts/detectlang.js b/static/assets/scripts/detectlang.js
new file mode 100644
index 0000000..46bc48c
--- /dev/null
+++ b/static/assets/scripts/detectlang.js
@@ -0,0 +1,42 @@
+const SPANISH_MESSAGE = "Versión en español"
+const SPANISH_BUTTON = "No mostrar esto de nuevo"
+const ENGLISH_MESSAGE = "English page"
+const ENGLISH_BUTTON = "Do not show me this again"
+
+if (redirect_notice_enabled()) {
+ let language = (navigator.language || navigator.userLanguage).split("-")[0]
+ if (location.pathname.startsWith("/en")) {
+ if (language === "es") {
+ add_redirect_notice(location.pathname.replace("/en", ""), SPANISH_MESSAGE, SPANISH_BUTTON)
+ }
+ } else if (!["weblog", "recommendations", "projects", "links"].includes(location.pathname.split("/")[1])) {
+ if (language !== "es") {
+ add_redirect_notice("/en" + location.pathname, ENGLISH_MESSAGE, ENGLISH_BUTTON)
+ }
+ }
+}
+
+function add_redirect_notice(redirect, message, btn_message) {
+ let main = document.getElementsByTagName("main").item(0)
+ let div = document.createElement("div")
+ div.classList.add("redirect-notice")
+ div.innerHTML = ``
+
+ let button = document.createElement("button")
+ button.addEventListener("click", () => {
+ disable_redirect_notice()
+ location.reload()
+ })
+ button.innerText = btn_message
+ div.append(button)
+
+ main.prepend(div)
+}
+
+function redirect_notice_enabled() {
+ return localStorage.getItem("i18n:no_redirect_notice") !== "1"
+}
+
+function disable_redirect_notice() {
+ localStorage.setItem("i18n:no_redirect_notice", "1")
+}
diff --git a/static/css/app.css b/static/css/app.css
index 8efee7d..97c0f0e 100644
--- a/static/css/app.css
+++ b/static/css/app.css
@@ -31,6 +31,22 @@ code {
background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
}
+button {
+ color: white;
+ padding: 3px;
+ margin: 3px;
+
+ transition: all 150ms;
+ background-color: #dc3f99;
+ border: solid 3px;
+ border-color: #f38cc2 #dc158d #dc158d #f38cc2;
+}
+
+button:hover {
+ cursor: pointer;
+ border-color: #d76d9c #ff0088 #ff0088 #d76d9c;
+}
+
hr {
color: #bebebe;
}
@@ -79,6 +95,16 @@ pre {
justify-content: center;
}
+.redirect-notice {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ border: #d76d9c solid 3px;
+ padding: 5px;
+ border-radius: 5px;
+ background-color: rgba(0, 0, 0, 0.1);
+}
+
main {
width: 40vw;
}