Made the website multilingual (German & English)
This commit is contained in:
parent
c4f6d64ff4
commit
44f3bfbe3e
3 changed files with 186 additions and 32 deletions
143
de.php
Normal file
143
de.php
Normal file
|
|
@ -0,0 +1,143 @@
|
|||
<?php
|
||||
header("Content-type: text/html");
|
||||
|
||||
include "file_viewer.php";
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="de"><meta charset="utf-8">
|
||||
|
||||
|
||||
<head>
|
||||
|
||||
<title>Wobbelnde Seite</title>
|
||||
|
||||
<link rel="icon" sizes="192x192" href="profilbild-workbench.png">
|
||||
<link rel="stylesheet" href="styles.php">
|
||||
<link rel="stylesheet" href="file_viewer_styles.css">
|
||||
|
||||
<?php
|
||||
echo " <style>
|
||||
/* This CSS code is php generated. Hardcoding it would be a programming war crime. :3 */\n\n";
|
||||
echo generateCSSCode(completeScanDir("files"));
|
||||
echo " </style>";
|
||||
?>
|
||||
|
||||
<script type="text/javascript" src="script.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
|
||||
<body>
|
||||
|
||||
<div class="background" id="background">
|
||||
|
||||
<div class="topnav-placeholder"></div>
|
||||
|
||||
<p class="big-text fat-text">Seite von dem Wobbler</p>
|
||||
<div class="glass inset">
|
||||
<p class="normal-text">
|
||||
Hallo, ich bin der Wobbler, ein Teenager aus Deutschland.
|
||||
<br>
|
||||
Ich kann ein wenig programmieren, am liebsten verwende ich Python.
|
||||
<br>
|
||||
Ich habe aber auch ein wenig Erfahrung in den Sprachen Kotlin, JavaScript, PHP, Lua, Bash, GDScript und C.
|
||||
<br>
|
||||
Die Designsprachen HTML und CSS benutze ich auch manchmal, wobei mich CSS meistens zum ausrasten bringt.
|
||||
<br>
|
||||
Jedoch umgehe ich JavaScript, auch wenn ich dafür CSS verwenden muss.
|
||||
<br>
|
||||
Diese Website besteht aus nur einer Zeile Javascript, der Rest sind HTML, CSS und PHP.
|
||||
<br>
|
||||
Ich verwende kein Arch BTW, sondern Linux Mint.
|
||||
<br>
|
||||
Im Sommer kann man mich immer auf dem <a href="https://fedi.camp" target="_blank">Fedicamp</a> finden.
|
||||
<br>
|
||||
Ich bin ein großer Fan von dezentralen Netzwerken wie Mastodon und kann es kaum erwarten,
|
||||
<br>
|
||||
dass <a href="https://forgejo.org" target="_blank">Forgejo</a> auch bald Föderationsfähig seien wird.
|
||||
|
||||
</p>
|
||||
</div>
|
||||
<div class="glass inset" id="projects">
|
||||
<p class="fat-text heading-text">Pojekte</p>
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Wobuzz" class="button inout" target="_blank">Wobuzz</a>
|
||||
<p class="tiny-text">Ein einfacher Audio-Player, geschrieben in Python und PyQT.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Bread_Editor" class="button inout" target="_blank">Bread Editor</a>
|
||||
<p class="tiny-text">Ein Biteditor, den ich mit PyQt programmiert habe.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/wobbl_sand" class="button inout" target="_blank">Wobbl Sand</a>
|
||||
<p class="tiny-text">Eine einfache aber schöne Sandsimulation.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Screensaver" class="button inout" target="_blank">Wobbl's Screensaver</a>
|
||||
<p class="tiny-text">
|
||||
Ein einfaches Programm,
|
||||
<br>
|
||||
welches alle .svg-Dateien in einem Ordner bildschirmschonermäßig durch das Fenster fliegen lässt.
|
||||
</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/wobbl_tools" class="button inout" target="_blank">Wobbl Tools</a>
|
||||
<p class="tiny-text">Ein Modul, das ich für viele meiner Projekte brauche.</p>
|
||||
</div>
|
||||
<div class="glass inset">
|
||||
<p class="heading-text fat-text">Wenn ihr mal mit mir schreiben, zocken, mir helfen oder Projekten beitragen wollt:</p>
|
||||
<a href="javascript:copyText('emil@i21k.de')" class="button inout" title="The button copies the address.">E-Mail</a>
|
||||
<br>
|
||||
<a href="javascript:copyText('eknr1@jabber.ccc.de')" class="button inout" title="The button copies the address.">XMPP</a>
|
||||
<br>
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl" target="_blank" class="button inout">Git (Forgejo)</a>
|
||||
<br>
|
||||
<a href="https://gitlab.com/EKNr1" target="_blank" class="button inout">GitLab</a>
|
||||
<p class="tiny-text inline-text">
|
||||
(Ich bin nicht mehr aktiv auf GitLab,
|
||||
<br>
|
||||
da wir unsere eigene <a href="https://teapot.informationsanarchistik.de/" target="_blank">Forgejo-Instanz</a> haben
|
||||
und Forgejo auch bald Fediverse kompatibel seien wird.)
|
||||
</p>
|
||||
<br>
|
||||
<a href="https://dizl.de/@eknr1" target="_blank" class="button inout">Mastodon</a>
|
||||
<br>
|
||||
<a href="https://peertube.art3mis.de/a/eknr01/" target="_blank" class="button inout">Peertube</a>
|
||||
<br>
|
||||
<a href="https://discord.com/invite/8htpyBfdan" target="_blank" class="button inout">Discord</a>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
<div class="glass inset">
|
||||
<p>
|
||||
Hab hier nen kleinen Datenschrottplatz an Mist,
|
||||
<br>
|
||||
den ich mal mit irgendwem teilen musste und deshalb hier auf den Server geladen hab.
|
||||
<br>
|
||||
Evtl. könnt ihr hier etwas brauchbares finden.
|
||||
</p>
|
||||
<div class="glass inset">
|
||||
|
||||
<?= generateSubmenusHTML(completeScanDir("files"), " ") ?>
|
||||
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="topnav-companion"></div>
|
||||
<div class="topnav">
|
||||
|
||||
<a class="topnav-active" href="">Start</a>
|
||||
<a class="topnav-inactive" href="#projects">Projekte</a>
|
||||
<a class="topnav-active align-right" href="de.php">Deutsch</a>
|
||||
<a class="topnav-inactive align-right" href="index.php">Englisch</a>
|
||||
<a class="topnav-text align-right">Sprachen:</a>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
</html>
|
||||
60
index.php
60
index.php
|
|
@ -10,7 +10,7 @@
|
|||
|
||||
<head>
|
||||
|
||||
<title>Wobbelnde Seite</title>
|
||||
<title>Wobbly Website</title>
|
||||
|
||||
<link rel="icon" sizes="192x192" href="profilbild-workbench.png">
|
||||
<link rel="stylesheet" href="styles.php">
|
||||
|
|
@ -34,59 +34,55 @@ echo " </style>";
|
|||
|
||||
<div class="topnav-placeholder"></div>
|
||||
|
||||
<p class="big-text fat-text">Seite von dem Wobbler</p>
|
||||
<p class="big-text fat-text">The Wobbler's Website</p>
|
||||
<div class="glass inset">
|
||||
<p class="normal-text">
|
||||
Hallo, ich bin der Wobbler, ein Teenager aus Deutschland.
|
||||
Hi, I am The Wobbler, a teenager from germany.
|
||||
<br>
|
||||
Ich kann ein wenig programmieren, am liebsten verwende ich Python.
|
||||
I can program a little bit, preferably with Python.
|
||||
<br>
|
||||
Ich habe aber auch ein wenig Erfahrung in den Sprachen Kotlin, JavaScript, PHP, Lua, Bash, GDScript und C.
|
||||
But I also have some experience with the languages Kotlin, JavaScript, PHP, Lua, Bash, GDScript and C.
|
||||
<br>
|
||||
Die Designsprachen HTML und CSS benutze ich auch manchmal, wobei mich CSS meistens zum ausrasten bringt.
|
||||
I do also use the design-languages HTML and CSS sometimes, although CSS usually drives me crazy.
|
||||
<br>
|
||||
Jedoch umgehe ich JavaScript, auch wenn ich dafür CSS verwenden muss.
|
||||
However, I bypass JavaScript, even if i have to use CSS instead.
|
||||
<br>
|
||||
Diese Website besteht aus nur einer Zeile Javascript, der Rest sind HTML, CSS und PHP.
|
||||
BTW this Website only consists of a single line of JavaScript, the rest is HTML, CSS and PHP.
|
||||
<br>
|
||||
Ich verwende kein Arch BTW, sondern Linux Mint.
|
||||
I don't use Arch BTW, I use Linux Mint.
|
||||
<br>
|
||||
Im Sommer kann man mich immer auf dem <a href="https://fedi.camp" target="_blank">Fedicamp</a> finden.
|
||||
In the summer, you can always find me on the <a href="https://fedi.camp" target="_blank">Fedicamp</a>.
|
||||
<br>
|
||||
Ich bin ein großer Fan von dezentralen Netzwerken wie Mastodon und kann es kaum erwarten,
|
||||
<br>
|
||||
dass <a href="https://forgejo.org" target="_blank">Forgejo</a> auch bald Föderationsfähig seien wird.
|
||||
|
||||
I am a big fan of decentralized networks and can't wait for <a href="https://forgejo.org" target="_blank">Forgejo</a>
|
||||
to become capable of federation.
|
||||
</p>
|
||||
</div>
|
||||
<div class="glass inset" id="projects">
|
||||
<p class="fat-text heading-text">Pojekte</p>
|
||||
<p class="fat-text heading-text">Pojects</p>
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Wobuzz" class="button inout" target="_blank">Wobuzz</a>
|
||||
<p class="tiny-text">Ein einfacher Audio-Player, geschrieben in Python und PyQT.</p>
|
||||
<p class="tiny-text">A simple audio player written in Python and PyQt.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Bread_Editor" class="button inout" target="_blank">Bread Editor</a>
|
||||
<p class="tiny-text">Ein Biteditor, den ich mit PyQt programmiert habe.</p>
|
||||
<p class="tiny-text">A bit-editor, made with PyQt.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/wobbl_sand" class="button inout" target="_blank">Wobbl Sand</a>
|
||||
<p class="tiny-text">Eine einfache aber schöne Sandsimulation.</p>
|
||||
<p class="tiny-text">A simple falling sand simulation written in Python.</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Screensaver" class="button inout" target="_blank">Wobbl's Screensaver</a>
|
||||
<p class="tiny-text">
|
||||
Ein einfaches Programm,
|
||||
<br>
|
||||
welches alle .svg-Dateien in einem Ordner bildschirmschonermäßig durch das Fenster fliegen lässt.
|
||||
A simple program that lets svg images from a specific folder hover through the window screensaver-like.
|
||||
</p>
|
||||
<hr class="inset">
|
||||
|
||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/wobbl_tools" class="button inout" target="_blank">Wobbl Tools</a>
|
||||
<p class="tiny-text">Ein Modul, das ich für viele meiner Projekte brauche.</p>
|
||||
<p class="tiny-text">A Python module i need for some of my projects.</p>
|
||||
</div>
|
||||
<div class="glass inset">
|
||||
<p class="heading-text fat-text">Wenn ihr mal mit mir schreiben, zocken, mir helfen oder Projekten beitragen wollt:</p>
|
||||
<p class="heading-text fat-text">If you want to text me, game with me, help me or contribute to one of my Projects:</p>
|
||||
<a href="javascript:copyText('emil@i21k.de')" class="button inout" title="The button copies the address.">E-Mail</a>
|
||||
<br>
|
||||
<a href="javascript:copyText('eknr1@jabber.ccc.de')" class="button inout" title="The button copies the address.">XMPP</a>
|
||||
|
|
@ -95,10 +91,9 @@ echo " </style>";
|
|||
<br>
|
||||
<a href="https://gitlab.com/EKNr1" target="_blank" class="button inout">GitLab</a>
|
||||
<p class="tiny-text inline-text">
|
||||
(Ich bin nicht mehr aktiv auf GitLab,
|
||||
<br>
|
||||
da wir unsere eigene <a href="https://teapot.informationsanarchistik.de/" target="_blank">Forgejo-Instanz</a> haben
|
||||
und Forgejo auch bald Fediverse kompatibel seien wird.)
|
||||
(I am no longer active on GitLab because we have our own
|
||||
<a href="https://teapot.informationsanarchistik.de/" target="_blank">Forgejo-Instance</a>
|
||||
and Forgejo will be capable of federation soon.)
|
||||
</p>
|
||||
<br>
|
||||
<a href="https://dizl.de/@eknr1" target="_blank" class="button inout">Mastodon</a>
|
||||
|
|
@ -111,11 +106,9 @@ echo " </style>";
|
|||
</div>
|
||||
<div class="glass inset">
|
||||
<p>
|
||||
Hab hier nen kleinen Datenschrottplatz an Mist,
|
||||
Here I have a little data-junkyard of scrap I had to share with someone and therefore put it here.,
|
||||
<br>
|
||||
den ich mal mit irgendwem teilen musste und deshalb hier auf den Server geladen hab.
|
||||
<br>
|
||||
Evtl. könnt ihr hier etwas brauchbares finden.
|
||||
Maybe you can find something usable here.
|
||||
</p>
|
||||
<div class="glass inset">
|
||||
|
||||
|
|
@ -130,7 +123,10 @@ echo " </style>";
|
|||
<div class="topnav">
|
||||
|
||||
<a class="topnav-active" href="">Start</a>
|
||||
<a class="topnav-inactive" href="#projects">Projekte</a>
|
||||
<a class="topnav-inactive" href="#projects">Projects</a>
|
||||
<a class="topnav-inactive align-right" href="de.php">German</a>
|
||||
<a class="topnav-active align-right" href="">English</a>
|
||||
<a class="topnav-text align-right">Languages:</a>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
15
styles.php
15
styles.php
|
|
@ -103,6 +103,21 @@ hr {
|
|||
text-shadow: none;
|
||||
}
|
||||
|
||||
.topnav-text {
|
||||
font-family: ubuntu, arial;
|
||||
float: left;
|
||||
color: #f2f2f2;
|
||||
text-align: center;
|
||||
padding: 5px 16px;
|
||||
text-decoration: none;
|
||||
text-shadow: none;
|
||||
font-size: 17px;
|
||||
}
|
||||
|
||||
.align-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.scriptsinactive:hover {
|
||||
background-color: #ddd;
|
||||
color: black;
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue