Skip to content

✨ feat: make '/index.html' change language based on the browser language #12

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Apr 3, 2024
Merged

✨ feat: make '/index.html' change language based on the browser language #12

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 19 additions & 21 deletions br/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,31 +1,29 @@
<!DOCTYPE html>
<html lang="pt">
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>retrozinndev</title>
<link rel="icon" href="https://github.com/retrozinndev.png">
<link rel="stylesheet" href="../resources/stylesheet.css">
<link rel="stylesheet" href="/resources/stylesheet.css">
</head>
<header class="site-header">
<header class="site-header">
<nav class="bar">
<ul class="nav-list">
<li class="nav-link">
<a class="header-button" href="#top" target="_self">Início</a>
</li>
<li class="nav-link">
<a class="header-button" href="#chars" target="_self">Sobre</a>
</li>
<li class="nav-link">
<a class="header-button" href="#projects" target="_self">Projetos</a>
</li>
<li class="nav-link">
<a class="header-button" href="/">Idioma: 🇧🇷BR</a>
</li>
</ul>
</nav>
</header>
<header class="navigation-header">
<nav class="bar">
<ul class="nav-list">
<li class="nav-link">
<a class="header-button" href="#top" target="_self">Início</a>
</li>
<li class="nav-link">
<a class="header-button" href="#characteristics" target="_self">Sobre</a>
</li>
<li class="nav-link">
<a class="header-button" href="#projects" target="_self">Projetos</a>
</li>
<li class="nav-link">
<a class="header-button" href="/en">Idioma: 🇧🇷BR</a>
</li>
</ul>
</nav>
</header>
<body>
<main>
Expand Down
106 changes: 94 additions & 12 deletions en/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,96 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>retrozinndev</title>
</head>
<body>
<script>
console.log("Redirecting to home...");
window.location.href='/';
</script>
</body>
</html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>retrozinndev</title>
<link rel="icon" href="https://github.com/retrozinndev.png">
<link rel="stylesheet" href="/resources/stylesheet.css">
</head>
<header class="navigation-header">
<section id="top">
<nav class="bar">
<ul class="nav-list">
<li class="nav-link">
<a class="header-button" href="#top" target="_self">Home</a>
</li>
<li class="nav-link">
<a class="header-button" href="#chars" target="_self">About</a>
</li>
<li class="nav-link">
<a class="header-button" href="#projects" target="_self">Projects</a>
</li>
<li class="nav-link">
<a class="header-button" href="/br" target="_self">Language: 🇺🇸EN</a>
</li>
</ul>
</nav>
</section>
</header>
<body>
<main>
<div class="container">
<br>
<div class="title">
<section id="title">
<h1>Hi, I'm <user-name>João!</user-name></h1>
</section>
</div>
<div class="chars">
<section id="characteristics">
<characteristics>
<bold>You can call me</bold>: João, Retrozinn <br>
<bold>Pronouns</bold>: He/Him (Ele/Dele)<br>
<bold>Languages<bold>: Português Brasileiro, English <br>
</characteristics>
</section>
</div>
<br>
<div class="about">
<section id="about">
<about>
I'm a <bold>self taught programmer </bold>and<bold> tech enthusiast</bold> that's learning software development stuff! <br>
<bold>I love the open-source communitty!</bold> I like: coding, learning about Linux and making games and apps in my free time! <br>
</about>
</section>
</div>
<div class="projects">
<section id="projects">
<h2>My Projects: </h2>
<project> <a href="https://github.com/retrozinndev/JSONutils" rel="_blank">JSONutils:</a> A JSON library for Java, focused at being easy-to-use.</project><br>
<project> <a href="https://github.com/retrozinndev/TheTraveler" rel="_blank">The Traveler:</a> A free and open-source 2D Shooter game!</project><br>
<project> <a href="https://github.com/retrozinndev/UpDateNTime" rel="_blank">UpDateNTime:</a> Tool for syncing your date and time with the internet!</project><br>
<project> <a href="https://github.com/retrozinndev/SpaceShooter" rel="_blank">Space Shooter:</a> A Game about shooting meteors in space!</project><br>
<project><a href="https://github.com/retrozinndev?tab=repositories">See more in GitHub...</a></project>
</section>
</div>
<div class="socials">
<section id="socials">
<h2>You can find me on: </h2>
<iframe
title="Discord user embed"
width="340"
height=120
frameborder="0"
sandbox="allow-scripts"
src="https://widgets.vendicated.dev/user?id=568589231954591749&theme=dark&banner=true&full-banner=false&rounded-corners=true&discord-icon=true&badges=false&guess-nitro=true&background-color=%23000000&foreground-color=%23fff"
></iframe><br>

<bold>Discord</bold> · <a href="https://discord.com/users/568589231954591749"><social-link>retrozinndev</social-link></a> <br>
<bold>GitHub</bold> · <a href="https://github.com/retrozinndev"><social-link>retrozinndev</social-link></a> <br>
<bold>GitLab</bold> · <a href="https://gitlab.com/retrozinndev"><social-link>retrozinndev</social-link></a> <br>
<bold>Matrix</bold> · <a href="https://matrix.to/#/@retrozinndev:matrix.org"><social-link>@retrozinndev:matrix.org</social-link></a> <br>
<bold>Mail</bold> · <a href="mailto:joaovodias@gmail.com"><social-link>joaovodias@gmail.com</social-link></a> <br>
<bold>X/Twitter</bold> · <a href="https://x.com/retrozinndev"><social-link>@retrozinndev</social-link></a> <br>
<bold>Reddit</bold> · <a href="https://www.reddit.com/user/Much_Clue7037"><social-link>Much_Clue7037</social-link></a> <br>
<bold>Gravatar</bold> · <a href="https://gravatar.com/retrozinndev"><social-link>joaovodias@gmail.com</social-link></a> <br>
</section>
<br><br>
</div>
</div>
</main>
</body>
<footer>
This site is <bold>open-source</bold> · ✏️ <a href="https://github.com/retrozinndev/retrozinndev.github.io"><bold>Improve this page</bold></a>
</footer>
</html>
79 changes: 18 additions & 61 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,85 +7,42 @@
<link rel="icon" href="https://github.com/retrozinndev.png">
<link rel="stylesheet" href="resources/stylesheet.css">
</head>
<header class="site-header">
<header class="navigation-header">
<section id="top">
<nav class="bar">
<ul class="nav-list">
<li class="nav-link">
<a class="header-button" href="#top" target="_self">Home</a>
<a class="header-button" href="/en/#top" target="_self">Home</a>
</li>
<li class="nav-link">
<a class="header-button" href="#chars" target="_self">About</a>
<a class="header-button" href="/en/#chars" target="_self">About</a>
</li>
<li class="nav-link">
<a class="header-button" href="#projects" target="_self">Projects</a>
<a class="header-button" href="/en/#projects" target="_self">Projects</a>
</li>
<li class="nav-link">
<a class="header-button" href="/br" target="_self">Language: 🇺🇸EN</a>
<a class="header-button" href="/br" target="_self">Language: Default</a>
</li>
</ul>
</nav>
</section>
</header>
<body>
<script>
const browserLang = navigator.language;
switch(browserLang.startsWith) {
case "pt":
window.location.href="/br";
break;
default:
window.location.href="/en";
break;
}
</script>
<main>
<div class="container">
<br>
<div class="title">
<section id="title">
<h1>Hi, I'm <user-name>João!</user-name></h1>
</section>
</div>
<div class="chars">
<section id="characteristics">
<characteristics>
<bold>You can call me</bold>: João, Retrozinn <br>
<bold>Pronouns</bold>: He/Him (Ele/Dele)<br>
<bold>Languages<bold>: Português Brasileiro, English <br>
</characteristics>
</section>
</div>
<br>
<div class="about">
<section id="about">
<about>
I'm a <bold>self taught programmer </bold>and<bold> tech enthusiast</bold> that's learning software development stuff! <br>
<bold>I love the open-source communitty!</bold> I like: coding, learning about Linux and making games and apps in my free time! <br>
</about>
</section>
</div>
<div class="projects">
<section id="projects">
<h2>My Projects: </h2>
<project> <a href="https://github.com/retrozinndev/JSONutils" rel="_blank">JSONutils:</a> A JSON library for Java, focused at being easy-to-use.</project><br>
<project> <a href="https://github.com/retrozinndev/TheTraveler" rel="_blank">The Traveler:</a> A free and open-source 2D Shooter game!</project><br>
<project> <a href="https://github.com/retrozinndev/UpDateNTime" rel="_blank">UpDateNTime:</a> Tool for syncing your date and time with the internet!</project><br>
<project> <a href="https://github.com/retrozinndev/SpaceShooter" rel="_blank">Space Shooter:</a> A Game about shooting meteors in space!</project><br>
<project><a href="https://github.com/retrozinndev?tab=repositories">See more in GitHub...</a></project>
</section>
</div>
<div class="socials">
<section id="socials">
<h2>You can find me on: </h2>
<iframe
title="Discord user embed"
width="340"
height=120
frameborder="0"
sandbox="allow-scripts"
src="https://widgets.vendicated.dev/user?id=568589231954591749&theme=dark&banner=true&full-banner=false&rounded-corners=true&discord-icon=true&badges=false&guess-nitro=true&background-color=%23000000&foreground-color=%23fff"
></iframe><br>

<bold>Discord</bold> · <a href="https://discord.com/users/568589231954591749"><social-link>retrozinndev</social-link></a> <br>
<bold>GitHub</bold> · <a href="https://github.com/retrozinndev"><social-link>retrozinndev</social-link></a> <br>
<bold>GitLab</bold> · <a href="https://gitlab.com/retrozinndev"><social-link>retrozinndev</social-link></a> <br>
<bold>Matrix</bold> · <a href="https://matrix.to/#/@retrozinndev:matrix.org"><social-link>@retrozinndev:matrix.org</social-link></a> <br>
<bold>Mail</bold> · <a href="mailto:joaovodias@gmail.com"><social-link>joaovodias@gmail.com</social-link></a> <br>
<bold>X/Twitter</bold> · <a href="https://x.com/retrozinndev"><social-link>@retrozinndev</social-link></a> <br>
<bold>Reddit</bold> · <a href="https://www.reddit.com/user/Much_Clue7037"><social-link>Much_Clue7037</social-link></a> <br>
<bold>Gravatar</bold> · <a href="https://gravatar.com/retrozinndev"><social-link>joaovodias@gmail.com</social-link></a> <br>
</section>
<br><br>
<div class="detect-lang">
<h1>Detecting browser language and redirecting...</h1>
</div>
</div>
</main>
Expand Down