Add langchange button

Add (not working) js to translate later
This commit is contained in:
malik 2024-01-24 19:35:35 +01:00
parent 90b6984265
commit 36a7845c88
8 changed files with 47 additions and 12 deletions

View file

@ -44,9 +44,9 @@
</div> </div>
<div class="socialmedia"> <div class="socialmedia">
<a href="https://feddit.de/u/mawacode"><img src="../webicons/lemmy.png"></a> <a href="https://feddit.de/u/mawacode"><img src="webicons/lemmy.png"></a>
<a rel="me" href="https://hessen.social/@mawacode"><img src="../webicons/mastodon.png"></a> <a rel="me" href="https://hessen.social/@mawacode"><img src="webicons/mastodon.png"></a>
<a href="https://github.com/malikwachter"><img src="../webicons/GitHub.png"></a> <a href="https://github.com/malikwachter"><img src="webicons/GitHub.png"></a>
</div> </div>
</div> </div>

View file

@ -35,9 +35,9 @@
</div> </div>
<div class="socialmedia"> <div class="socialmedia">
<a href="https://feddit.de/u/mawacode"><img src="../webicons/lemmy.png"></a> <a href="https://feddit.de/u/mawacode"><img src="webicons/lemmy.png"></a>
<a rel="me" href="https://hessen.social/@mawacode"><img src="../webicons/mastodon.png"></a> <a rel="me" href="https://hessen.social/@mawacode"><img src="webicons/mastodon.png"></a>
<a href="https://github.com/malikwachter"><img src="../webicons/GitHub.png"></a> <a href="https://github.com/malikwachter"><img src="webicons/GitHub.png"></a>
</div> </div>
</div> </div>

View file

@ -61,6 +61,16 @@ nav ul li a:hover{
cursor: pointer; cursor: pointer;
} }
#lang{
color: black;
padding: 5px;
background-color: #e2de84;
box-shadow: 5px 5px 5px black;
width: 2.5em;
margin-top: 28px;
margin-left: 5px;
}
h1{ h1{
color: black; color: black;
} }
@ -192,8 +202,16 @@ h2{
box-shadow: 0 0 0; box-shadow: 0 0 0;
} }
#lang{
margin-left: 5px;
margin-bottom: 23px;
width: 58px;
transform: translateX(-60px);
}
.menu-icon{ .menu-icon{
display: block; display: block;
transform: translateX(70px);
} }
#menuList{ #menuList{

View file

@ -22,6 +22,7 @@
</ul> </ul>
</nav> </nav>
<img src="webicons/menu.png" class="menu-icon" onclick="togglemenu()"> <img src="webicons/menu.png" class="menu-icon" onclick="togglemenu()">
<a href="#ger"><img src="webicons/ger.png" id="lang"></a>
</div> </div>
<div class="row"> <div class="row">
@ -37,9 +38,9 @@
</div> </div>
<div class="socialmedia"> <div class="socialmedia">
<a href="https://feddit.de/u/mawacode"><img src="../webicons/lemmy.png"></a> <a href="https://feddit.de/u/mawacode"><img src="webicons/lemmy.png"></a>
<a rel="me" href="https://hessen.social/@mawacode"><img src="../webicons/mastodon.png"></a> <a rel="me" href="https://hessen.social/@mawacode"><img src="webicons/mastodon.png"></a>
<a href="https://github.com/malikwachter"><img src="../webicons/GitHub.png"></a> <a href="https://github.com/malikwachter"><img src="webicons/GitHub.png"></a>
</div> </div>
</div> </div>

16
js/lang.js Normal file
View file

@ -0,0 +1,16 @@
var language = {
eng: {
welcometitle: "Hello Internet!",
welcome: "I'm Malik, some guy on the web who's learning to code. <br> Welcome to my personal website. Here you can find out more about me and my projects! Thanks for stopping by. :)"
},
ger: {
welcometitle: "Hallo Internet!",
welcome:"Ich bin Malik, irgend so ein Typ im Web, der gerade Programmieren lernt. <br> Willkommen auf meiner persönlichen Webseite. Hier erfährst du mehr über mich und meine Projekte! Danke fürs Vorbeischauen. :)"
}
};
if(window.location.hash) {
if(window.location.hash == "#ger") {
welcome.textContent = language.ger.welcome;
}
}

View file

@ -35,9 +35,9 @@
</div> </div>
<div class="socialmedia"> <div class="socialmedia">
<a href="https://feddit.de/u/mawacode"><img src="../webicons/lemmy.png"></a> <a href="https://feddit.de/u/mawacode"><img src="webicons/lemmy.png"></a>
<a rel="me" href="https://hessen.social/@mawacode"><img src="../webicons/mastodon.png"></a> <a rel="me" href="https://hessen.social/@mawacode"><img src="webicons/mastodon.png"></a>
<a href="https://github.com/malikwachter"><img src="../webicons/GitHub.png"></a> <a href="https://github.com/malikwachter"><img src="webicons/GitHub.png"></a>
</div> </div>
</div> </div>

BIN
webicons/eng.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

BIN
webicons/ger.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB