vaporware release
0
404.html
Normal file → Executable file
BIN
88x31s/fedora.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
88x31s/firefox4.gif
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
88x31s/hl.gif
Normal file
After Width: | Height: | Size: 2.3 KiB |
0
88x31s/maggie8831.gif
Normal file → Executable file
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
BIN
88x31s/meowmeow.png
Normal file
After Width: | Height: | Size: 412 B |
0
88x31s/sl88x31.png
Normal file → Executable file
Before Width: | Height: | Size: 622 B After Width: | Height: | Size: 622 B |
BIN
88x31s/ublockorigin.png
Normal file
After Width: | Height: | Size: 5 KiB |
BIN
88x31s/vscode.gif
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
catpdiscord.png
Before Width: | Height: | Size: 8.4 KiB |
Before Width: | Height: | Size: 15 KiB |
BIN
catpgh.png
Before Width: | Height: | Size: 12 KiB |
BIN
catpghover.png
Before Width: | Height: | Size: 9.7 KiB |
0
elpico.jpg
Normal file → Executable file
Before Width: | Height: | Size: 92 KiB After Width: | Height: | Size: 92 KiB |
0
favicon.ico
Normal file → Executable file
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 15 KiB |
0
image.gif
Normal file → Executable file
Before Width: | Height: | Size: 21 KiB After Width: | Height: | Size: 21 KiB |
BIN
image.jpg
Executable file
After Width: | Height: | Size: 2.7 MiB |
83
index.html
Normal file → Executable file
|
@ -1,11 +1,11 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap" rel="stylesheet">
|
||||
<link rel="icon" href="favicon.ico">
|
||||
<meta content="maggie" property="og:title" />
|
||||
<meta content="This link contains extreme silliness and general incompetence, proceed with caution, please." property="og:description" />
|
||||
|
@ -15,37 +15,62 @@
|
|||
<link rel="stylesheet" href="style.css">
|
||||
</head>
|
||||
<body>
|
||||
<img class="pfp" src="pfp.webp" alt="maggie" width="128" title="maggie"/>
|
||||
<div class="top">
|
||||
<div class="titletext">
|
||||
<h1>Hi! I'm Maggie!</h1>
|
||||
<p>Welcome to my website!</p>
|
||||
<div class="buttons">
|
||||
<a class="btn" href="https://discord.com/users/330299657458679821">
|
||||
<img class="logo" src="catpdiscord.png" width="32" title="maggie.pi">
|
||||
</a>
|
||||
<a class="btn" href="https://github.com/maggster165">
|
||||
<img class="logo2" src="catpgh.png" width="32" title="maggster165">
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="aboutbox">
|
||||
<h3>About Me</h3>
|
||||
<div class="flex-container">
|
||||
<div class="navbar">
|
||||
<h3>Useful info</h3>
|
||||
<a href="https://blog.maggiepi.site">My blog</a> <br>
|
||||
<a href="https://discord.com/users/330299657458679821">My Discord</a><br>
|
||||
<a href="https://github.com/maggster165">My GitHub</a> <br>
|
||||
<a href="oldindex.html">Old site</a>
|
||||
|
||||
</div>
|
||||
<div class="aboutbox">
|
||||
<h3 class="title">About Me</h3>
|
||||
<p>I'm a tech nerd in dire need of more fun stuff to do.</p>
|
||||
<h4>Interests:</h4>
|
||||
<ul>
|
||||
<li>Linux</li>
|
||||
<li>Alt-rock music</li>
|
||||
<li>Old technology</li>
|
||||
<li>Hackintoshing</li>
|
||||
<li>meowing</li>
|
||||
<li>Music synthesis</li>
|
||||
</ul>
|
||||
<ul>
|
||||
<li>Linux</li>
|
||||
<li>Old technology</li>
|
||||
<li>meowing</li>
|
||||
<li>Alt-rock music</li>
|
||||
<li>Hackintoshing</li>
|
||||
<li>Music synthesis</li>
|
||||
</ul>
|
||||
|
||||
<p>I study at a computer science school. Feel free to message me at any time! </p>
|
||||
<p>My timezone is the Central European timezone.</p>
|
||||
<h3>My friends!</h3>
|
||||
</div>
|
||||
<div class="general">
|
||||
<h3>Things I like right now</h3>
|
||||
<a href="https://yume.wiki/2kki/Yume_2kki_Wiki">Yume 2kki</a>
|
||||
<h3>Current Favorite Song</h3>
|
||||
<a href="https://www.youtube.com/watch?v=-kz7hkPVuxM">Franz Ferdinand - Night or Day</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="end">
|
||||
<h3 class="endbar">Look at my helper...</h3>
|
||||
<a href="kitty.jpg"><img src="88x31s/meowmeow.png" alt=""></a>
|
||||
<h3 class="endbar">Also check out...</h3>
|
||||
<img src="88x31s/maggie8831.gif" alt="88x31">
|
||||
<a href="https://slonk.ing/"><img src="88x31s/sl88x31.png" alt="88x31"></a><br>
|
||||
<a href="oldindex.html">Here is a link to the old version of this site.</a>
|
||||
</div>
|
||||
<a href="https://slonk.ing/"><img src="https://slonk.ing/img/88x31.apng" alt="88x31"></a>
|
||||
<a href="https://zptr.cc/"><img src="https://zptr.cc/88x31/webring/zeroptr.png" alt="88x31"></a><br>
|
||||
<a href="https://hayl.in/"><img src="https://hayl.in/assets/img/badges/haylin.png" alt="88x31"></a>
|
||||
<a href="https://lily.pet/"><img src="https://lily.pet/assets/badges/lily_pet.gif" alt="88x31"></a>
|
||||
<a href="https://sipacid.com/"><img src="https://sipacid.com/buttons/sipacid.gif" alt="88x31"></a><br>
|
||||
<a href="https://notnite.com/"><img src="https://notnite.com/buttons/notnite.png" alt="88x31"></a>
|
||||
<a href="https://code.visualstudio.com/"><img src="88x31s/vscode.gif" alt="88x31"></a>
|
||||
<a href="https://goldenstack.net"><img src="https://goldenstack.net/88x31.png" alt="88x31"></a><br>
|
||||
<a href="https://fedoraproject.org"><img src="88x31s/fedora.png" alt="88x31s"></a>
|
||||
<a href="steam://launch/70"><img src="88x31s/hl.gif" alt="88x31s"></a>
|
||||
<a href="https://mozilla.org/en-US/firefox/"><img src="88x31s/firefox4.gif" alt="88x31s"></a><br>
|
||||
<a href="https://mimme.rs"><img src="https://mimme.rs/buttons/mimmers.gif" alt=""></a>
|
||||
<a href="https://ublockorigin.com/"><img src="88x31s/ublockorigin.png" alt="88x31s"></a><br>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
BIN
kitty.jpg
Normal file
After Width: | Height: | Size: 328 KiB |
0
oldindex.html
Normal file → Executable file
0
oldstyle.css
Normal file → Executable file
BIN
pfp.png
Before Width: | Height: | Size: 339 KiB |
BIN
pfp.webp
Before Width: | Height: | Size: 26 KiB |
156
style.css
Normal file → Executable file
|
@ -1,76 +1,118 @@
|
|||
/* i feel that removing every remnant would take so long i dont wanna do it at ALL rn */
|
||||
body {
|
||||
background-color: #24273a;
|
||||
color: #cad3f5;
|
||||
font-family: 'Open Sans';
|
||||
background-image: url(image.jpg);
|
||||
background-size: auto;
|
||||
font-family: 'Inter';
|
||||
}
|
||||
.top {
|
||||
display: inline-block;
|
||||
margin-left: 10rem;
|
||||
}
|
||||
h1 {
|
||||
margin-left: 1rem;
|
||||
color: #3d276b;
|
||||
}
|
||||
.pfp {
|
||||
border-radius: 50%;
|
||||
padding: 1rem;
|
||||
float: none;
|
||||
transition: 0.3s;
|
||||
position: absolute
|
||||
|
||||
}
|
||||
.pfp:hover {
|
||||
scale: 125%;
|
||||
transition: 0.3s;
|
||||
}
|
||||
p {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
h3 {
|
||||
.title{
|
||||
margin-top: 4rem;
|
||||
}
|
||||
.logo,
|
||||
.logo2 {
|
||||
width: 2rem;
|
||||
float: left;
|
||||
position: relative;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.logo:hover,
|
||||
.logo2:hover {
|
||||
background-color: #b7bdf8;
|
||||
padding: 5px;
|
||||
scale: 125%;
|
||||
border-radius: 10px;
|
||||
transition: 0.3s;
|
||||
}
|
||||
.logo:hover {
|
||||
content: url(catpdiscordhover.png);
|
||||
}
|
||||
.logo2:hover {
|
||||
content: url(catpghover.png);
|
||||
.titletext{
|
||||
margin-top: 3rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin-left: 1rem;
|
||||
color: #795ab8;
|
||||
}
|
||||
.aboutbox {
|
||||
margin-left: 2rem;
|
||||
h3 {
|
||||
color: #795ab8;
|
||||
}
|
||||
a:link {
|
||||
color: #c6a0f6;
|
||||
a {
|
||||
color: #7345cf;
|
||||
}
|
||||
.endbar {
|
||||
color: #3d276b;
|
||||
}
|
||||
a:visited {
|
||||
color: #b7bdf8;
|
||||
color: #4c317e;
|
||||
}
|
||||
.buttons {
|
||||
margin-left: 1rem;
|
||||
height: 4rem;
|
||||
display:flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
.flex-container0 {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
width: 940px;
|
||||
padding-bottom: 10px;
|
||||
align-items: center;
|
||||
}
|
||||
.buttons .btn {
|
||||
width: 3rem;
|
||||
display: flex;
|
||||
|
||||
justify-content: center;
|
||||
ul {
|
||||
list-style: none;
|
||||
margin-right: 2.5rem;
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
border-radius: 15px;
|
||||
margin: auto;
|
||||
max-width: 1000px;
|
||||
max-height: 1000px;
|
||||
min-height: 500px;
|
||||
align-items: center;
|
||||
}
|
||||
.flex-container > .aboutbox{
|
||||
box-shadow: 5px 10px 50px #797b7d;
|
||||
max-width: 650px;
|
||||
height: 500px;
|
||||
backdrop-filter: blur(10px);
|
||||
margin: auto;
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
transition: box-shadow 1s;
|
||||
}
|
||||
.flex-container > .aboutbox:hover{
|
||||
box-shadow: 5px 10px 50px #894ccf;
|
||||
}
|
||||
.flex-container > .navbar{
|
||||
box-shadow: 5px 10px 50px #797b7d;
|
||||
height: 31.25rem;
|
||||
backdrop-filter: blur(10px);
|
||||
width: 9.3rem;
|
||||
padding-right: 10rem;
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
transition: box-shadow 1s;
|
||||
}
|
||||
.flex-container > .navbar:hover{
|
||||
box-shadow: 5px 10px 50px #894ccf;
|
||||
}
|
||||
.flex-container > .general{
|
||||
box-shadow: 5px 10px 50px #797b7d;
|
||||
backdrop-filter: blur(10px);
|
||||
height: 31.25rem;
|
||||
width: 9.3rem;
|
||||
padding-right: 10rem;
|
||||
padding: 1rem;
|
||||
border-radius: 10px;
|
||||
transition: box-shadow 1s;
|
||||
}
|
||||
.flex-container > .general:hover{
|
||||
box-shadow: 5px 10px 50px #894ccf;
|
||||
}
|
||||
.end {
|
||||
content: center;
|
||||
text-align: center;
|
||||
max-width: 650px;
|
||||
margin: auto;
|
||||
left: 1%;
|
||||
right: 1%;
|
||||
|
||||
}
|
||||
@media screen and (max-width: 700px) {
|
||||
.flex-container > .aboutbox{
|
||||
height: 700px;
|
||||
}
|
||||
.flex-container > .navbar {
|
||||
height: 700px;
|
||||
}
|
||||
.flex-container > .general {
|
||||
height: 700px;
|
||||
}
|
||||
}
|
||||
|
|