Wobbl/Wobbly-Website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Redesigned some things and made a post at Bla.

Browse source
This commit is contained in:
The Wobbler 2023-10-08 17:48:57 +02:00
parent 746437ff9d
commit 17bc1ea575
8 changed files with 292 additions and 142 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
.htaccess
View file

@ -1,2 +1,3 @@
RewriteRule .git 404.html RewriteRule .git 404.html
RewriteRule .idea 404.html RewriteRule .idea 404.html
RewriteRule Alina 404.html

93
bla/index.html Normal file
View file

@ -0,0 +1,93 @@
<!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.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script type="text/javascript" src="../script.js"></script>
</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>
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>
<br>
</div>
<script type="text/javascript">
getStringOfPageContent("../backgrounds", function(pageContent) {
let backgrounds = getFilesInFolder(pageContent);
randomBackground(backgrounds)
});
</script>
<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>

53
downloads.html
View file

@ -4,44 +4,37 @@
<head> <head>
<title>Downloads</title> <title>Downloads</title>
<link rel="icon" sizes="192x192" href="profilbild-workbench.png"> <link rel="icon" sizes="192x192" href="profilbild-workbench.png">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script> <script type="text/javascript" src="script.js"></script>
</head> </head>
<body style="background-color: #2e2e2e;"> <body style="background-color: #2e2e2e;">
<div class="background" id="background"> <div class="background" id="background">
<div style="font-family:ubuntu;" class="topnav"> <div class="topnav-placeholder"></div>
<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>
<p class="big-text center-text">Downloads</p> <p class="big-text center-text">Downloads</p>
<br> <br>
<br> <br>
<a href="pythonscripts.html" class="normal-link-button" title='Skripte in der Programmiersprache "Python".'> <a href="pythonscripts.html" class="normal-link-button" title='Skripte in der Programmiersprache "Python".'>
Pythonskripte Pythonskripte
</a> </a>
<a href="merge-box" class="normal-link-button" title="Ein 2D Videospiel"> <a href="merge-box" class="normal-link-button" title="Ein 2D Videospiel">
Merge Box Merge Box
</a> </a>
<br> <br>
<br> <br>
</div> </div>
@ -52,6 +45,16 @@
}); });
</script> </script>
<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> </body>

29
index.html
View file

@ -4,7 +4,7 @@
<head> <head>
<title>EKNr1 Startseite</title> <title>Wobbelnde Seite</title>
<link rel="icon" sizes="192x192" href="profilbild-workbench.png"> <link rel="icon" sizes="192x192" href="profilbild-workbench.png">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
@ -16,26 +16,19 @@
<body style="background-color: #2e2e2e"> <body style="background-color: #2e2e2e">
<div class="background" id="background"> <div class="background" id="background">
<div class="topnav"> <div class="topnav-placeholder"></div>
<a class="topnav-active" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a> <p class="big-text">Seite von dem Wobbler</p>
<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>
<p class="big-text">Willkommen auf meiner Website!</p>
<p class="normal-text"> <p class="normal-text">
Schreibt Verbesserungsvorschläge bitte an meine E-Mail: 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 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 background-text" href="javascript:copyText('emil@i21k.de');" title="Mailadresse kopieren">Copy!</a> <a class="normal-text" href="javascript:copyText('emil@i21k.de');" title="Mailadresse kopieren">Copy!</a>
<br> <br>
oder schreibt sie in meinen oder schreibt sie in meinen
<a class="normal-link" href ="https://discord.com/invite/8htpyBfdan" target="_blank" title="Mein Discord-Server">Discord-Server</a>. <a href ="https://discord.com/invite/8htpyBfdan" target="_blank" title="Mein Discord-Server">Discord-Server</a>.
</p> </p>
</div> </div>
@ -47,6 +40,16 @@
}); });
</script> </script>
<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> </body>

81
pythonscripts.html
View file

@ -1,57 +1,49 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="de"><meta charset="utf-8"> <html lang="de"><meta charset="utf-8">
<head>
<head>
<title>Pythonskripte</title> <title>Pythonskripte</title>
<link rel="icon" sizes="192x192" href="profilbild-workbench.png"> <link rel="icon" sizes="192x192" href="profilbild-workbench.png">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script> <script type="text/javascript" src="script.js"></script>
</head> </head>
<body style="background-color: #2e2e2e";> <body style="background-color: #2e2e2e;">
<div class="background"> <div class="background">
<div style="font-family:ubuntu;" class="topnav"> <div class="topnav-placeholder"></div>
<a class="topnav-inactive" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a> <dl>
<a class="topnav-inactive" href="ueber-mich.html" title="Über mich">Über mich</a> <dt class="normal-list">
<a class="topnav-inactive" href="downloads.html" title="Downloads">Downloads</a> <a href="https://i21k.de/emil/files/python/PyBrow" class="normal-link">* PyBrow</a>
<a class="topnav-inactive" href="bla" title="Text!">Bla</a> </dt>
<dd class="normal-text">
</div> - Ein Webbrowser mit Python programmiert.
<br>
<dl> Downloaded eine Version aber mit den Settings und Icon.
<dt class="normal-list"> </dd>
<a href="https://i21k.de/emil/files/python/PyBrow" class="normal-link">* PyBrow</a> <dt class="normal-list">
</dt> <a href="https://i21k.de/emil/files/python/winke-winke.py" class="normal-link">* Python Animation Test</a>
<dd class="normal-text"> </dt>
- Ein Webbrowser mit Python programmiert. <dd class="normal-text">
<br> - Ein kleiner Test einer Terminalanimation.
Downloaded eine Version aber mit den Settings und Icon. </dd>
</dd> <dt class="normal-list">
<dt class="normal-list"> <a href="https://i21k.de/emil/files/python/ematrix/" class="normal-link">* EMatrix</a>
<a href="https://i21k.de/emil/files/python/winke-winke.py" class="normal-link">* Python Animation Test</a> </dt>
</dt> <dd class="normal-text">
<dd class="normal-text"> - Eine kleine einfache Matrix.
- Ein kleiner Test einer Terminalanimation. <br>
</dd> Downloaded eine Version aber ab der 1.1 mit den Settings
<dt class="normal-list"> </dd>
<a href="https://i21k.de/emil/files/python/ematrix/" class="normal-link">* EMatrix</a> </dl>
</dt>
<dd class="normal-text">
- Eine kleine einfache Matrix.
<br>
Downloaded eine Version aber ab der 1.1 mit den Settings
</dd>
</dl>
</div> </div>
@ -60,9 +52,18 @@
let backgrounds = getFilesInFolder(pageContent); let backgrounds = getFilesInFolder(pageContent);
randomBackground(backgrounds) randomBackground(backgrounds)
}); });
</script> </script>
</body> <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> </html>

9
script.js
View file

@ -2,10 +2,10 @@ function randomBackground(backgrounds) {
let background = selectRandom(backgrounds); let background = selectRandom(backgrounds);
console.log("Choosen random background image:", background); console.log("Choosen random background image:", background);
document.getElementById("background").style.backgroundImage = "url(backgrounds/" + background + ")"; document.getElementById("background").style.backgroundImage = "url(https://i21k.de/emil/backgrounds/" + background + ")";
let div_height = document.getElementById("background").offsetHeight; // let div_height = document.getElementById("background").offsetHeight;
let half_div_height = (0 - div_height) / 2; // let half_div_height = (0 - div_height) / 2;
document.getElementById("background").style.backgroundPosition = "0% " + half_div_height.toString() + "px"; // document.getElementById("background").style.backgroundPosition = "0% " + half_div_height.toString() + "px";
} }
function selectRandom(array) { function selectRandom(array) {
@ -52,3 +52,4 @@ function getFilesInFolder(pageContent) { // Needs auto file indexing
}; };
// getStringOfPageContent("backgrounds", getFilesInFolder) // getStringOfPageContent("backgrounds", getFilesInFolder)

89
styles.css
View file

@ -1,18 +1,39 @@
.p { html:not([data-scroll='0']) .topnav {
position: fixed;
}
p {
font-family: ubuntu, arial; 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 {
background-image: url(backgrounds/eknr1_and_lottilx.png); background-image: url(backgrounds/eknr1_and_lottilx.png);
background-repeat: no-repeat; background-repeat: no-repeat;
background-attachment: fixed; background-attachment: fixed;
background-size: 100%; background-size: cover;
min-height: 400px; min-height: 400px;
} }
.text-background {
background-color: rgba(51, 51, 51, 0.4);
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;
top: 8px;
} }
.topnav-inactive { .topnav-inactive {
@ -45,12 +66,28 @@
color: black; color: black;
} }
.topnav-placeholder {
height: 20px;
}
.topnav-companion {
position: fixed;
top: 0px;
background-color: #2e2e2e;
height: 8px;
width: 100%;
}
.big-text { .big-text {
font-family: ubuntu, arial; font-family: ubuntu, arial;
color: white; color: white;
font-size: 26px; font-size: 26px;
} }
.medium-text {
font-family: ubuntu, arial;
}
.tiny-text { .tiny-text {
font-family: ubuntu, arial; font-family: ubuntu, arial;
color: white; color: white;
@ -66,13 +103,7 @@
} }
.background-text { .background-text {
background-color: rgba(0,0,0,0.7); background-color: rgba(51, 51, 51, 0.4);
}
.normal-text {
font-family: ubuntu, arial;
color: white;
font-size: 16px;
} }
.normal-link { .normal-link {
@ -80,46 +111,16 @@
color: #5865f2; color: #5865f2;
} }
.ytbutton {
border-radius: 5px;
background-color: #ff0000;
border-color: #ff0000;
color: white;
font-family: ubuntu;
font-size: 18px;
cursor: pointer;
}
.scratchbutton {
border-radius: 5px;
background-color: #f7aa36;
border-color: white;
color: white;
font-family: ubuntu;
font-size: 18px;
cursor: pointer;
}
.discordbutton {
border-radius: 5px;
background-color: #5865f2;
border-color: #5865f2;
color: white;
font-family: ubuntu;
font-size: 18px;
cursor: pointer;
}
.normal-link-button { .normal-link-button {
font-family: ubuntu, arial; font-family: ubuntu, arial;
float: left;
color: #f2f2f2; color: #f2f2f2;
background-color: rgba(51, 51, 51, 0.8); background-color: rgba(51, 51, 51, 0.8);
text-align: center; padding: 5px 8px;
padding: 5px 16px;
text-decoration: none; text-decoration: none;
font-size: 17px; font-size: 17px;
border-style: inset; 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 { .normal-link-button:hover {
@ -163,3 +164,7 @@
background-color: rgba(51, 51, 51, 0.863); background-color: rgba(51, 51, 51, 0.863);
position: relative; position: relative;
} }
.search-folder {
visibility: hidden;
}

79
ueber-mich.html
View file

@ -17,23 +17,50 @@
<div class="background" id="background"> <div class="background" id="background">
<div style="font-family:ubuntu;" class="topnav"> <div class="topnav-placeholder"></div>
<a class="topnav-inactive" href="https://i21k.de/emil" title="EKNr1 Startseite">Startseite</a> <p class="big-text">Über mich</p>
<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>
<h1 class="normal-text">Über mich</h1> <p>
<p class="normal-text"> Spiele, wenn ich grad Bock hab mal ein Spiel aus der Liste da unten.
Ich bin 14 Jahre alt, kann ein bisschen programmieren
<br> <br>
und zocke gerne Spiele wie Minecraft.</p> Sonst programmier ich was mit Python oder schau YouTube. Hab da auch n Paar Videos hochgeladen.
<p class="tiny-text">Bischen wenig Text ;)</p> <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 14.
</p>
<br> <br>
<p class="normal-text fat-text">Programmiersprachen:</p>
<p class="fat-text">Programmiersprachen:</p>
<p class="normal-text"> <p class="normal-text">
- Python - Python
<br> <br>
@ -41,7 +68,8 @@
<br> <br>
- Scratch - Scratch
</p> </p>
<p class="normal-text fat-text">Spiele:</p> <p class="normal-text fat-text">Spiele die ich spiele:</p>
<p class="normal-text"> <p class="normal-text">
- Minecraft - Minecraft
<br> <br>
@ -59,10 +87,15 @@
<br> <br>
- SuperTux 2 - SuperTux 2
</p> </p>
<br>
<button class="ytbutton" onclick="window.open('https://www.youtube.com/@eknr1', '_blank')"title="YouTube">YouTube</button>
<button class="scratchbutton" onclick="window.open('https://scratch.mit.edu/users/eknr1/', '_blank')"title="Scratch">Scratch</button> <button class="normal-link-button" onclick="window.open('https://dizl.de/@eknr1', '_blank')" title="Mastodon">Mastodon</button>
<button style="border-radius:5px;background-color:#5865f2;border-color:#5865f2;color:white;font-family:ubuntu;font-size:18px;cursor:pointer;" onclick="window.open('https://discord.com/invite/8htpyBfdan', '_blank')"title="Mein Discordserver">Discordserver</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>
@ -73,6 +106,16 @@
}); });
</script> </script>
<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> </body>
</html> </html>