Compare commits
No commits in common. "main" and "old-website" have entirely different histories.
main
...
old-websit
14 changed files with 616 additions and 641 deletions
|
@ -1,2 +1,3 @@
|
||||||
RewriteRule .git 404.html
|
RewriteRule .git 404.html
|
||||||
|
RewriteRule .idea 404.html
|
||||||
|
RewriteRule Alina 404.html
|
||||||
|
|
92
bla/index.html
Normal file
92
bla/index.html
Normal file
|
@ -0,0 +1,92 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de"><meta charset="utf-8">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<title>Bla - Wobblers Seite</title>
|
||||||
|
|
||||||
|
<link rel="icon" sizes="192x192" href="../profilbild-workbench.png">
|
||||||
|
<link rel="stylesheet" href="../styles.php">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="background-color: #2e2e2e">
|
||||||
|
|
||||||
|
<div class="background" id="background">
|
||||||
|
|
||||||
|
<div class="topnav-placeholder"></div>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<p class="center-text big-text">Hier schreib ich irgendwas rein.</p>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
<p class="fat-text">
|
||||||
|
7.10.2023 - Macbook schrott
|
||||||
|
</p>
|
||||||
|
<p class="inactive-text">
|
||||||
|
Falls sich jemand mit Apple auskennt, bitte durchlesen:
|
||||||
|
<br>
|
||||||
|
Ich hab ein Macbook Pro 8.2 mit Macos und Lubuntu drauf.
|
||||||
|
<br>
|
||||||
|
Der Bildschirm ist einfach schwarz geworden, als meine Schwester daran Videos geschaut hat.
|
||||||
|
<br>
|
||||||
|
Die Lüfter des Laptops drehten sich jedoch ruhig weiter. Wir wollten ihn rebooten,
|
||||||
|
<br>
|
||||||
|
aber er ließ sich nicht normal ausschalten. Wenn man den Laptop einschaltet,
|
||||||
|
<br>
|
||||||
|
kommt man zwar noch in das Menü, wo man das System auswählen kann,
|
||||||
|
<br>
|
||||||
|
aber egal welches der Systeme man bootet, der Bildschirm friert ein.
|
||||||
|
<br>
|
||||||
|
(Bei Lubuntu ist der Screen Grau und geht nach ner Weile aus und bei Macos ist der Screen weiß.)
|
||||||
|
<br>
|
||||||
|
Irgendwann ist dann das Touchpad gebrochen. Das lag daran, dass sich der Akku aufgebläht hat.
|
||||||
|
<br>
|
||||||
|
Weil ich kein Risiko eingehen wollte, habe ich das Macbook dann nach draussen gestellt.
|
||||||
|
<br>
|
||||||
|
Da hat es leider einmal rauf genieselt. Ein paar Tage später habe ich dann einen verbogenen Schlitzschraubendreher gefunden,
|
||||||
|
<br>
|
||||||
|
mit dessen Hilfe ich die fiesen Schrauben, die den Akku festhalten rausgedreht habe.
|
||||||
|
<br>
|
||||||
|
Ich habe den Laptop noch einmal getestet und der Niesel scheint den Schaden nicht noch schlimmer gemacht zu haben.
|
||||||
|
<br>
|
||||||
|
Per SSH komme ich übrigens nicht auf den Laptop drauf. Ich weiß aber auch nicht mehr, ob ich überhaupt SSH installiert hatte.
|
||||||
|
<br>
|
||||||
|
Von der Fritz!Box wird er allerdings erkannt.
|
||||||
|
<br>
|
||||||
|
Falls das hier jemand liest, der sich mit sowas auskennt, bitte schreib mir ne E-Mail.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
Ich habe das Touchpad ausgebaut und jetzt läuft er wieder! Wahrscheinlich hatte der Akku es beschädigt.
|
||||||
|
<br>
|
||||||
|
Komischerweise funktioniert jetzt die Tastatur nicht mehr, aber im Grub funktioniert sie.
|
||||||
|
<br>
|
||||||
|
Ich vermute, das liegt daran, dass sich Tastatur und Touchpad denselben Chip teilen und der Grub nicht nach dem Touchpad fragt.
|
||||||
|
<br>
|
||||||
|
Ich werde mal ein neues Touchpad bestellen und gucken, ob es funktioniert.
|
||||||
|
</p>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="topnav-companion"></div>
|
||||||
|
<div class="topnav">
|
||||||
|
|
||||||
|
<a class="topnav-inactive" href=".." title="EKNr1 Startseite">Startseite</a>
|
||||||
|
<a class="topnav-inactive" href="../ueber-mich.html" title="Über mich">Über mich</a>
|
||||||
|
<a class="topnav-inactive" href="../downloads.html" title="Downloads">Downloads</a>
|
||||||
|
<a class="topnav-active" href="" title="Text!">Bla</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
145
de.php
145
de.php
|
@ -1,145 +0,0 @@
|
||||||
<?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>
|
|
||||||
|
|
||||||
<p class="hover-wobble button inout">Lass es wobbeln!</p>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
|
|
||||||
|
|
||||||
</html>
|
|
52
downloads.html
Normal file
52
downloads.html
Normal file
|
@ -0,0 +1,52 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de"><meta charset="utf-8">
|
||||||
|
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<title>Downloads</title>
|
||||||
|
|
||||||
|
<link rel="icon" sizes="192x192" href="profilbild-workbench.png">
|
||||||
|
|
||||||
|
<link rel="stylesheet" href="styles.php">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
|
||||||
|
<body style="background-color: #2e2e2e;">
|
||||||
|
|
||||||
|
<div class="background" id="background">
|
||||||
|
|
||||||
|
<div class="topnav-placeholder"></div>
|
||||||
|
|
||||||
|
<p class="big-text center-text">Downloads</p>
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<a href="pythonscripts.html" class="normal-link-button" title='Skripte in der Programmiersprache "Python".'>
|
||||||
|
Pythonskripte
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="merge-box" class="normal-link-button" title="Ein 2D Videospiel">
|
||||||
|
Merge Box
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<br>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="topnav-companion"></div>
|
||||||
|
<div style="font-family:ubuntu;" class="topnav">
|
||||||
|
|
||||||
|
<a class="topnav-inactive" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a>
|
||||||
|
<a class="topnav-inactive" href="ueber-mich.html" title="Über mich">Über mich</a>
|
||||||
|
<a class="topnav-active" href="downloads.html" title="Downloads">Downloads</a>
|
||||||
|
<a class="topnav-inactive" href="bla" title="Text!">Bla</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
|
||||||
|
</html>
|
|
@ -1,89 +0,0 @@
|
||||||
<?php
|
|
||||||
function completeScanDir($dir) {
|
|
||||||
if (file_exists("$dir/.hide.txt")) {
|
|
||||||
$hideFile = fopen("$dir/.hide.txt", "r");
|
|
||||||
$filesToHide = fread($hideFile, filesize("$dir/.hide.txt"));
|
|
||||||
fclose($hideFile);
|
|
||||||
$filesToHide = explode("\n", $filesToHide);
|
|
||||||
}
|
|
||||||
|
|
||||||
$result = [];
|
|
||||||
foreach(scandir($dir) as $filename) {
|
|
||||||
if ($filename[0] == '.'){
|
|
||||||
continue;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isset($filesToHide)) {
|
|
||||||
if (in_array($filename, $filesToHide)) continue;
|
|
||||||
}
|
|
||||||
|
|
||||||
$filePath = $dir . '/' . $filename;
|
|
||||||
|
|
||||||
if (is_dir($filePath)) {
|
|
||||||
$result[$filePath] = completeScanDir($filePath);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
$result[$filePath] = $filename;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return $result;
|
|
||||||
}
|
|
||||||
|
|
||||||
function generateCSSCode($directory) {
|
|
||||||
foreach ($directory as $path => $filename) {
|
|
||||||
if (is_array($filename)) { // $filename is either a filename or an array of filenames, if so, it represents a directory
|
|
||||||
$randomColor = "rgba(" . rand(0, 255) . ", " . rand(0, 255) . ", " . rand(0, 255);
|
|
||||||
|
|
||||||
$useableName = str_replace("/", "_", $path);
|
|
||||||
echo " #input_$useableName:checked + .submenu_$useableName,
|
|
||||||
.submenu_$useableName:hover {
|
|
||||||
display: block;
|
|
||||||
background-color: $randomColor, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.label_$useableName {
|
|
||||||
background-color: $randomColor, 0.5);
|
|
||||||
}\n\n";
|
|
||||||
|
|
||||||
generateCSSCode($filename);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function generateSubmenusHTML($directory, $indentation) {
|
|
||||||
foreach ($directory as $path => $filename) {
|
|
||||||
if ($filename !== "README.txt") {
|
|
||||||
$useableName = str_replace("/", "_", $path); // CSS classes cant contain slashes
|
|
||||||
|
|
||||||
if (is_array($filename)) {
|
|
||||||
$pathFragments = explode("/", $path); // i wanted to just use end(explode("/", $path)) but PHP doesnt like it.
|
|
||||||
$folderName = end($pathFragments);
|
|
||||||
echo " $indentation<label for='input_$useableName' class='inout hcb-label label_$useableName'>$folderName</label>
|
|
||||||
$indentation<input type='checkbox' id='input_$useableName' class='hacked-checkbox'>
|
|
||||||
$indentation<div class='inset submenu submenu_$useableName' id='submenu_$useableName'>\n";
|
|
||||||
|
|
||||||
if (file_exists("$path/README.txt")) { // show description text if there is a README.txt
|
|
||||||
echo " $indentation<p class='tiny-text'>Beschreibung:</p>\n";
|
|
||||||
|
|
||||||
$readmeFile = fopen("$path/README.txt", "r");
|
|
||||||
$readmeContent = fread($readmeFile, filesize("$path/README.txt"));
|
|
||||||
echo " $indentation<pre class='heading-text fat-text'>
|
|
||||||
$readmeContent
|
|
||||||
$indentation</pre>
|
|
||||||
$indentation<hr>\n";
|
|
||||||
fclose($readmeFile);
|
|
||||||
}
|
|
||||||
|
|
||||||
generateSubmenusHTML($filename, "$indentation ");
|
|
||||||
echo " $indentation</div>
|
|
||||||
$indentation<br>\n";
|
|
||||||
|
|
||||||
} else {
|
|
||||||
if ($filename !== "README.txt") {
|
|
||||||
echo " $indentation<a href='$path' class='file-link'>$filename</a>\n";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
?>
|
|
|
@ -1,33 +0,0 @@
|
||||||
.submenu {
|
|
||||||
display: none;
|
|
||||||
margin: 0px 0px 0px 16px;
|
|
||||||
padding: 0px 0px 16px 0px;
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.3);
|
|
||||||
border-radius: 0px 16px 16px 16px;
|
|
||||||
background-color: rgba(46, 46, 46, 0.5);
|
|
||||||
mix-blend-mode: color;
|
|
||||||
backdrop-filter: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.submenu:target {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.file-link {
|
|
||||||
padding: 16px 16px 0px 16px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hacked-checkbox {
|
|
||||||
position: absolute;
|
|
||||||
left: -100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hcb-label {
|
|
||||||
padding: 8px 16px;
|
|
||||||
margin: 16px 0px 0px 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 16px 16px 0px 0px;
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.3);
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
48
index.html
Normal file
48
index.html
Normal file
|
@ -0,0 +1,48 @@
|
||||||
|
<!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">
|
||||||
|
|
||||||
|
<script type="text/javascript" src="script.js"></script>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
|
||||||
|
<body style="background-color: #2e2e2e">
|
||||||
|
|
||||||
|
<div class="background" id="background">
|
||||||
|
|
||||||
|
<div class="topnav-placeholder"></div>
|
||||||
|
|
||||||
|
<p class="big-text">Seite von dem Wobbler</p>
|
||||||
|
<p class="normal-text">
|
||||||
|
Schreibt Verbesserungsvorschläge bitte an meine E-Mail:
|
||||||
|
<a id="mail-addr" class="normal-link" href="mailto:emil@i21k.de" title="Einfach draufklicken und warten bis sich das Mailprogramm öffnet.">emil@i21k.de</a>
|
||||||
|
<a class="normal-text" href="javascript:copyText('emil@i21k.de');" title="Mailadresse kopieren">Copy!</a>
|
||||||
|
<br>
|
||||||
|
oder schreibt sie in meinen
|
||||||
|
<a href ="https://discord.com/invite/8htpyBfdan" target="_blank" title="Mein Discord-Server">Discord-Server</a>.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="topnav-companion"></div>
|
||||||
|
<div class="topnav">
|
||||||
|
|
||||||
|
<a class="topnav-active" href="" title="EKNr1 Startseite">Startseite</a>
|
||||||
|
<a class="topnav-inactive" href="ueber-mich.html" title="Über mich">Über mich</a>
|
||||||
|
<a class="topnav-inactive" href="downloads.html" title="Downloads">Downloads</a>
|
||||||
|
<a class="topnav-inactive" href="bla" title="Text!">Bla</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
|
||||||
|
</html>
|
138
index.php
138
index.php
|
@ -1,138 +0,0 @@
|
||||||
<?php
|
|
||||||
header("Content-type: text/html");
|
|
||||||
|
|
||||||
include "file_viewer.php";
|
|
||||||
?>
|
|
||||||
|
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="de"><meta charset="utf-8">
|
|
||||||
|
|
||||||
|
|
||||||
<head>
|
|
||||||
|
|
||||||
<title>Wobbly Website</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">The Wobbler's Website</p>
|
|
||||||
<div class="glass inset">
|
|
||||||
<p class="normal-text">
|
|
||||||
Hi, I am The Wobbler, a teenager from germany.
|
|
||||||
<br>
|
|
||||||
I can program a little bit, preferably with Python.
|
|
||||||
<br>
|
|
||||||
But I also have some experience with the languages Kotlin, JavaScript, PHP, Lua, Bash, GDScript and C.
|
|
||||||
<br>
|
|
||||||
I do also use the design-languages HTML and CSS sometimes, although CSS usually drives me crazy.
|
|
||||||
<br>
|
|
||||||
However, I bypass JavaScript, even if i have to use CSS instead.
|
|
||||||
<br>
|
|
||||||
BTW this Website only consists of a single line of JavaScript, the rest is HTML, CSS and PHP.
|
|
||||||
<br>
|
|
||||||
I don't use Arch BTW, I use Linux Mint.
|
|
||||||
<br>
|
|
||||||
In the summer, you can always find me on the <a href="https://fedi.camp" target="_blank">Fedicamp</a>.
|
|
||||||
<br>
|
|
||||||
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">Pojects</p>
|
|
||||||
|
|
||||||
<a href="https://teapot.informationsanarchistik.de/Wobbl/Wobuzz" class="button inout" target="_blank">Wobuzz</a>
|
|
||||||
<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">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">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">
|
|
||||||
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">A Python module i need for some of my projects.</p>
|
|
||||||
</div>
|
|
||||||
<div class="glass inset">
|
|
||||||
<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>
|
|
||||||
<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">
|
|
||||||
(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>
|
|
||||||
<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>
|
|
||||||
Here I have a little data-junkyard of scrap I had to share with someone and therefore put it here.,
|
|
||||||
<br>
|
|
||||||
Maybe you can find something usable here.
|
|
||||||
</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">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>
|
|
||||||
|
|
||||||
<p class="hover-wobble button inout">Let it wobble!</p>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
|
|
||||||
|
|
||||||
</html>
|
|
|
@ -8,7 +8,7 @@
|
||||||
|
|
||||||
<link rel="icon" href="https://i21k.de/emil/files/Icons/merge_box_icon.png">
|
<link rel="icon" href="https://i21k.de/emil/files/Icons/merge_box_icon.png">
|
||||||
|
|
||||||
<link rel="stylesheet" href="https://i21k.de/emil/styles.php">
|
<link rel="stylesheet" href="https://i21k.de/emil/styles.css">
|
||||||
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
@ -19,8 +19,10 @@
|
||||||
|
|
||||||
<div style="font-family:ubuntu;" class="topnav">
|
<div style="font-family:ubuntu;" class="topnav">
|
||||||
|
|
||||||
<a class="topnav-inactive" href="https://i21k.de/emil">Wobbelnde Seite</a>
|
<a class="topnav-inactive" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a>
|
||||||
<a class="topnav-active" href="">Merge Box</a>
|
<a class="topnav-inactive" href="ueber-mich.html" title="über mich">über mich</a>
|
||||||
|
<a class="topnav-inactive" href="downloads.html" title="Downloads">Downloads</a>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<br>
|
<br>
|
||||||
|
|
57
pythonscripts.html
Normal file
57
pythonscripts.html
Normal file
|
@ -0,0 +1,57 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de"><meta charset="utf-8">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<title>Pythonskripte</title>
|
||||||
|
|
||||||
|
<link rel="icon" sizes="192x192" href="profilbild-workbench.png">
|
||||||
|
<link rel="stylesheet" href="styles.php">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
|
||||||
|
<body style="background-color: #2e2e2e;">
|
||||||
|
|
||||||
|
<div class="background" id="background">
|
||||||
|
|
||||||
|
<div class="topnav-placeholder"></div>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
<a href="https://i21k.de/emil/files/python/PyBrow">* PyBrow</a>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
- Ein Webbrowser mit Python programmiert.
|
||||||
|
<br>
|
||||||
|
Downloaded eine Version aber mit den Settings und Icon.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<a href="https://i21k.de/emil/files/python/winke-winke.py">* Python Animation Test</a>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
- Ein kleiner Test einer Terminalanimation.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<a href="https://i21k.de/emil/files/python/ematrix/">* EMatrix</a>
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
- Eine kleine einfache Matrix.
|
||||||
|
<br>
|
||||||
|
Downloaded eine Version aber ab der 1.1 mit den Settings
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="topnav-companion"></div>
|
||||||
|
<div style="font-family:ubuntu;" class="topnav">
|
||||||
|
|
||||||
|
<a class="topnav-inactive" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a>
|
||||||
|
<a class="topnav-inactive" href="ueber-mich.html" title="Über mich">Über mich</a>
|
||||||
|
<a class="topnav-inactive" href="downloads.html" title="Downloads">Downloads</a>
|
||||||
|
<a class="topnav-inactive" href="bla" title="Text!">Bla</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
|
@ -2,7 +2,7 @@
|
||||||
function scanAllDir($dir) {
|
function scanAllDir($dir) {
|
||||||
$result = [];
|
$result = [];
|
||||||
foreach(scandir($dir) as $filename) {
|
foreach(scandir($dir) as $filename) {
|
||||||
if ($filename[0] == '.') continue;
|
if ($filename[0] === '.') continue;
|
||||||
$filePath = $dir . '/' . $filename;
|
$filePath = $dir . '/' . $filename;
|
||||||
if (is_dir($filePath)) {
|
if (is_dir($filePath)) {
|
||||||
foreach (scanAllDir($filePath) as $childFilename) {
|
foreach (scanAllDir($filePath) as $childFilename) {
|
||||||
|
|
181
styles.css
Normal file
181
styles.css
Normal file
|
@ -0,0 +1,181 @@
|
||||||
|
html:not([data-scroll='0']) .topnav {
|
||||||
|
position: fixed;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
padding-left: 20px;
|
||||||
|
color: white;
|
||||||
|
font-size: 16px;
|
||||||
|
text-shadow: 0px 0px 16px rgb(0, 0, 0), 0px 0px 16px rgb(0, 0, 0), 0px 0px 16px rgb(0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: #5865f2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.background {
|
||||||
|
background-image: url(backgrounds/eknr1_and_lottilx.png);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-attachment: fixed;
|
||||||
|
background-size: cover;
|
||||||
|
min-height: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-background {
|
||||||
|
background-color: rgba(51, 51, 51, 0.4);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav {
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
|
position: fixed;
|
||||||
|
top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav-inactive {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
float: left;
|
||||||
|
color: #f2f2f2;
|
||||||
|
text-align: center;
|
||||||
|
padding: 5px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav-inactive:hover {
|
||||||
|
background-color: #ddd;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav-active {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
background-color: #04AA6D;
|
||||||
|
color: white;
|
||||||
|
float: left;
|
||||||
|
padding: 5px 16px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scriptsinactive:hover {
|
||||||
|
background-color: #ddd;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav-placeholder {
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topnav-companion {
|
||||||
|
position: fixed;
|
||||||
|
top: 0px;
|
||||||
|
background-color: #2e2e2e;
|
||||||
|
height: 8px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.big-text {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: white;
|
||||||
|
font-size: 26px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.medium-text {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tiny-text {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: white;
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-text {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fat-text {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.background-text {
|
||||||
|
background-color: rgba(51, 51, 51, 0.4);
|
||||||
|
}
|
||||||
|
|
||||||
|
.inactive-text {
|
||||||
|
color: rgb(255, 255, 255, 0.5);
|
||||||
|
text-decoration: line-through;
|
||||||
|
transition: color 0.5s, text-decoration 0.5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inactive-text:hover {
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-link {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: #5865f2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-link-button {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: #f2f2f2;
|
||||||
|
background-color: rgba(51, 51, 51, 0.8);
|
||||||
|
padding: 5px 8px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
border-style: inset;
|
||||||
|
border-width: 4px;
|
||||||
|
border-color: rgba(51, 51, 204, 0.8) rgba(51, 51, 204, 0.8) rgba(153, 255, 102, 0.8) rgba(153, 255, 102, 0.8 );
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-link-button:hover {
|
||||||
|
background-color: rgba(240, 240, 240, 0.6);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-emoji {
|
||||||
|
height: 16px;
|
||||||
|
width: 16px;
|
||||||
|
align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pythonscripts {
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
width: 160px;
|
||||||
|
height: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.merge_box {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
position: relative;
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-list {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.program {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-folder {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
296
styles.php
296
styles.php
|
@ -8,72 +8,39 @@ html:not([data-scroll='0']) .topnav {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
}
|
}
|
||||||
|
|
||||||
* {
|
|
||||||
font-family: ubuntu, arial;
|
|
||||||
font-size: 16px;
|
|
||||||
text-color: white;
|
|
||||||
text-shadow: 4px 4px 8px rgb(0, 0, 0), -4px 4px 8px rgb(0, 0, 0), -4px -4px 8px rgb(0, 0, 0), 4px -4px 8px rgb(0, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
background-color: #2e2e2e;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
p {
|
||||||
font-family: ubuntu, arial;
|
font-family: ubuntu, arial;
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
color: white;
|
color: white;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
text-shadow: 4px 4px 8px rgb(0, 0, 0), -4px 4px 8px rgb(0, 0, 0), -4px -4px 8px rgb(0, 0, 0), 4px -4px 8px rgb(0, 0, 0);
|
text-shadow: 0px 0px 16px rgb(0, 0, 0), 0px 0px 16px rgb(0, 0, 0), 0px 0px 16px rgb(0, 0, 0);
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
font-family: ubuntu, arial;
|
font-family: ubuntu, arial;
|
||||||
color: rgb(120, 120, 255);
|
color: rgb(100, 100, 200);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
label {
|
|
||||||
font-family: ubuntu, arial;
|
|
||||||
font-size: 16px;
|
|
||||||
color: white;
|
|
||||||
text-shadow: 4px 4px 8px rgb(0, 0, 0), -4px 4px 8px rgb(0, 0, 0), -4px -4px 8px rgb(0, 0, 0), 4px -4px 8px rgb(0, 0, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
margin: 0px 8px 16px 8px;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.background {
|
.background {
|
||||||
background-image: url('<?= $chosen_background ?>');
|
background-image: url('<?= $chosen_background ?>');
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-attachment: fixed;
|
background-attachment: fixed;
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
border-radius: 16px;
|
min-height: 400px;
|
||||||
padding: 16px;
|
|
||||||
margin: 0px;
|
|
||||||
position: fixed;
|
|
||||||
overflow: auto;
|
|
||||||
top: 16px;
|
|
||||||
right: 16px;
|
|
||||||
bottom: 16px;
|
|
||||||
left: 16px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-background {
|
.text-background {
|
||||||
background-color: rgba(51, 51, 51, 0.2);
|
background-color: rgba(51, 51, 51, 0.4);
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnav {
|
.topnav {
|
||||||
background-color: rgba(51, 51, 51, 0.863);
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 16px;
|
top: 8px;
|
||||||
left: 16px;
|
|
||||||
right: 16px;
|
|
||||||
border-radius: 16px 16px 0px 0px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnav-inactive {
|
.topnav-inactive {
|
||||||
|
@ -83,7 +50,6 @@ hr {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 5px 16px;
|
padding: 5px 16px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
text-shadow: none;
|
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -100,22 +66,6 @@ hr {
|
||||||
padding: 5px 16px;
|
padding: 5px 16px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-size: 17px;
|
font-size: 17px;
|
||||||
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 {
|
.scriptsinactive:hover {
|
||||||
|
@ -138,14 +88,7 @@ hr {
|
||||||
.big-text {
|
.big-text {
|
||||||
font-family: ubuntu, arial;
|
font-family: ubuntu, arial;
|
||||||
color: white;
|
color: white;
|
||||||
font-size: 32px;
|
font-size: 26px;
|
||||||
}
|
|
||||||
|
|
||||||
.heading-text {
|
|
||||||
font-family: ubuntu, arial;
|
|
||||||
color: white;
|
|
||||||
font-size: 20px;
|
|
||||||
padding-left: 20px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.medium-text {
|
.medium-text {
|
||||||
|
@ -155,7 +98,7 @@ hr {
|
||||||
.tiny-text {
|
.tiny-text {
|
||||||
font-family: ubuntu, arial;
|
font-family: ubuntu, arial;
|
||||||
color: white;
|
color: white;
|
||||||
font-size: 14px;
|
font-size: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.center-text {
|
.center-text {
|
||||||
|
@ -181,174 +124,65 @@ hr {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.inline-text {
|
.normal-link {
|
||||||
display: inline-block;
|
font-family: ubuntu, arial;
|
||||||
margin: 0px;
|
color: #5865f2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-link-button {
|
||||||
|
font-family: ubuntu, arial;
|
||||||
|
color: #f2f2f2;
|
||||||
|
background-color: rgba(51, 51, 51, 0.8);
|
||||||
|
padding: 5px 8px;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 17px;
|
||||||
|
border-style: inset;
|
||||||
|
border-width: 4px;
|
||||||
|
border-color: rgba(51, 51, 204, 0.8) rgba(51, 51, 204, 0.8) rgba(153, 255, 102, 0.8) rgba(153, 255, 102, 0.8 );
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-link-button:hover {
|
||||||
|
background-color: rgba(240, 240, 240, 0.6);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-emoji {
|
||||||
|
height: 16px;
|
||||||
|
width: 16px;
|
||||||
|
align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pythonscripts {
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
width: 160px;
|
||||||
|
height: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.merge_box {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
position: relative;
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.normal-list {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.program {
|
||||||
|
font-family: ubuntu;
|
||||||
|
color: white;
|
||||||
|
font-size: 18px;
|
||||||
|
padding: 5px 16px;
|
||||||
|
background-color: rgba(51, 51, 51, 0.863);
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-folder {
|
.search-folder {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
.glass {
|
|
||||||
backdrop-filter: blur(16px);
|
|
||||||
border-radius: 16px;
|
|
||||||
margin: 32px 16px 64px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.glassint {
|
|
||||||
backdrop-filter: blur(8px);
|
|
||||||
border-radius: 16px;
|
|
||||||
margin: 32px 16px 64px;
|
|
||||||
animation-name: glassdiff;
|
|
||||||
animation-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.glassint:hover {
|
|
||||||
backdrop-filter: blur(2px);
|
|
||||||
border-radius: 16px;
|
|
||||||
animation-name: glassclear;
|
|
||||||
animation-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes glassdiff {
|
|
||||||
0% {
|
|
||||||
backdrop-filter: blur(2px);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
backdrop-filter: blur(8px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes glassclear {
|
|
||||||
0% {
|
|
||||||
backdrop-filter: blur(8px);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
backdrop-filter: blur(2px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.inset {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2) inset;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.inout {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2) inset;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
||||||
animation-name: pushins;
|
|
||||||
animation-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.inout:hover {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2),
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2);
|
|
||||||
animation-name: pullins;
|
|
||||||
animation-duration: 0.3s;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes pushins {
|
|
||||||
0% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2),
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0),
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0);
|
|
||||||
}
|
|
||||||
51% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0) inset;
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2) inset;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes pullins {
|
|
||||||
0% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2) inset;
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0) inset;
|
|
||||||
}
|
|
||||||
51% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0),
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0);
|
|
||||||
}
|
|
||||||
100% {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2),
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ascii-art {
|
|
||||||
color: white;
|
|
||||||
background-color: rgba(51, 51, 51, 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
.button {
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.5);
|
|
||||||
border-radius: 16px;
|
|
||||||
margin: 4px 8px 4px 16px;
|
|
||||||
padding: 8px;
|
|
||||||
font-size: 16px;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
width: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
|
||||||
box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.2) inset,
|
|
||||||
-4px -4px 4px rgba(255, 255, 255, 0.2) inset;
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
||||||
border-radius: 0px 16px 16px 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
backdrop-filter: blur(16px);
|
|
||||||
border-radius: 0px 16px 16px 0px;
|
|
||||||
background-color: rgba(4, 170, 109, 0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
.hacked-checkbox {
|
|
||||||
position: absolute;
|
|
||||||
left: -100vw;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hcb-label {
|
|
||||||
padding: 8px 16px;
|
|
||||||
margin: 16px 0px 0px 16px;
|
|
||||||
cursor: pointer;
|
|
||||||
border-radius: 16px 16px 0px 0px;
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.3);
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes wobbl-animation {
|
|
||||||
0% {transform: skew(-10deg, -10deg);}
|
|
||||||
25% {transform: skew(-10deg, 10deg);}
|
|
||||||
50% {transform: skew(10deg, 10deg);}
|
|
||||||
75% {transform: skew(10deg, -10deg);}
|
|
||||||
100% {transform: skew(-10deg, -10deg);}
|
|
||||||
}
|
|
||||||
|
|
||||||
.hover-wobble {
|
|
||||||
bottom: 16px;
|
|
||||||
right: 32px;
|
|
||||||
position: fixed;
|
|
||||||
}
|
|
||||||
|
|
||||||
body:has(.hover-wobble:hover) .background {
|
|
||||||
animation: wobbl-animation 0.5s infinite;
|
|
||||||
}
|
|
113
ueber-mich.html
Normal file
113
ueber-mich.html
Normal file
|
@ -0,0 +1,113 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="de"><meta charset="utf-8">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
|
||||||
|
<title>Über mich</title>
|
||||||
|
|
||||||
|
<link rel="icon" sizes="192x192" href="profilbild-workbench.png">
|
||||||
|
<link rel="stylesheet" href="styles.php">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="background-color: #2e2e2e;">
|
||||||
|
|
||||||
|
<div class="background" id="background">
|
||||||
|
|
||||||
|
<div class="topnav-placeholder"></div>
|
||||||
|
|
||||||
|
<p class="big-text">Über mich</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Spiele, wenn ich grad Bock hab mal ein Spiel aus der Liste da unten.
|
||||||
|
<br>
|
||||||
|
Sonst programmier ich was mit Python oder schau YouTube. Hab da auch n Paar Videos hochgeladen.
|
||||||
|
<br>
|
||||||
|
Ich finde CSS und JavaScript total eklig, weshalb ich meistens zu faul bin, meine Website zu updaten.
|
||||||
|
<br>
|
||||||
|
Trotzdem kann ich gerne netten Leuten eine kleine Website basteln, falls diese sich gar nicht damit auskennen.
|
||||||
|
<br>
|
||||||
|
Hab mit Scratch angefangen, zu programmieren. Bin sogar mal auf die Startseite gekommen.
|
||||||
|
<br>
|
||||||
|
Jetzt mach ich auf Scratch nichts mehr.
|
||||||
|
<br>
|
||||||
|
Wenn du auch programmieren möchtest,
|
||||||
|
<br>
|
||||||
|
empfehle ich dir mit
|
||||||
|
<a href="https://upbge.org" target="_blank" title="Blender zum programmieren von Computerspielen optimiert">UPBGE</a>
|
||||||
|
oder einfach gleich mit
|
||||||
|
<a href="https://python.org" target="_blank" title="Einfache und beliebteste Programmiersprache">Python</a>
|
||||||
|
anzufangen.
|
||||||
|
<br>
|
||||||
|
Denn Scratch ist lahm und der Umstieg von Scratch auf eine richtige Programmiersprache
|
||||||
|
<br>
|
||||||
|
kann einem ordentlich das Gehirn verknoten.
|
||||||
|
<br>
|
||||||
|
Ich hab auch einen Raspberry Pi, auf dem ein Minecraft-Server, Terraria-Server und ein Discordbot läuft.
|
||||||
|
<br>
|
||||||
|
Leider hat der keine Domain und die IP ändert sich täglich.
|
||||||
|
<br>
|
||||||
|
Man kann aber auch einfach meinen Discord-Bot nach der IP fragen.
|
||||||
|
<br>
|
||||||
|
Dazu gibt man einfach
|
||||||
|
<a href="javascript:copyText('!server ip');" title="Befehl kopieren">"!server ip"</a>
|
||||||
|
in den Spam-Kanal meines Discord-Servers ein und der Bot antwortet mit der IP.
|
||||||
|
<br>
|
||||||
|
Ich bin übrigens grad 14 Jahre alt.
|
||||||
|
</p>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<p class="fat-text">Programmiersprachen:</p>
|
||||||
|
<p class="normal-text">
|
||||||
|
- Python
|
||||||
|
<br>
|
||||||
|
- Kotlin
|
||||||
|
<br>
|
||||||
|
- Scratch
|
||||||
|
</p>
|
||||||
|
<p class="normal-text fat-text">Spiele die ich spiele:</p>
|
||||||
|
|
||||||
|
<p class="normal-text">
|
||||||
|
- Minecraft
|
||||||
|
<br>
|
||||||
|
- Minetest
|
||||||
|
<br>
|
||||||
|
- Terraria
|
||||||
|
<br>
|
||||||
|
- Factorio
|
||||||
|
<br>
|
||||||
|
- Minetest
|
||||||
|
<br>
|
||||||
|
- Robocraft
|
||||||
|
<br>
|
||||||
|
- SuperTuxKart
|
||||||
|
<br>
|
||||||
|
- SuperTux 2
|
||||||
|
<br>
|
||||||
|
- Skillwarz
|
||||||
|
</p>
|
||||||
|
<br>
|
||||||
|
|
||||||
|
<button class="normal-link-button" onclick="window.open('https://dizl.de/@eknr1', '_blank')" title="Mastodon">Mastodon</button>
|
||||||
|
<button class="normal-link-button" onclick="window.open('https://peertube.art3mis.de/a/eknr01/', '_blank')" title="PeerTube">PeerTube</button>
|
||||||
|
<button class="normal-link-button" onclick="window.open('https://www.youtube.com/@eknr1', '_blank')" title="YouTube">YouTube</button>
|
||||||
|
<br>
|
||||||
|
<button class="normal-link-button" onclick="window.open('https://discord.com/invite/8htpyBfdan', '_blank')" title="Mein Discordserver">Discordserver</button>
|
||||||
|
<button class="normal-link-button" onclick="window.open('https://scratch.mit.edu/users/eknr1/', '_blank')" title="Scratch">Scratch</button>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="topnav-companion"></div>
|
||||||
|
<div style="font-family:ubuntu;" class="topnav" id="topnav">
|
||||||
|
|
||||||
|
<a class="topnav-inactive" href="./" title="EKNr1 Startseite">Startseite</a>
|
||||||
|
<a class="topnav-active" href="ueber-mich.html" title="Über mich">Über mich</a>
|
||||||
|
<a class="topnav-inactive" href="downloads.html" title="Downloads">Downloads</a>
|
||||||
|
<a class="topnav-inactive" href="bla" title="Text!">Bla</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
Loading…
Add table
Add a link
Reference in a new issue