joy/www.joygnu.org
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Wallpapers

Browse source
This commit is contained in:
mail@joygnu.org 2024-07-16 21:32:32 +02:00
parent 5e4763014d
commit f492020227
1 changed files with 18 additions and 94 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

112
index.html
View file

@ -1,101 +1,26 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Socials Joy</title>
<title>Joygnu's Website シ</title>
<style>
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body {
font-family: 'Roboto', sans-serif;
background-color: #282828;
color: #fff;
font-size: 22px;
}
.container {
max-width: 1050px;
margin: 36px auto;
padding: 19px;
border-radius: 17px;
font-size: 1.3em;
}
h1 {
text-align: center;
color: #458588;
font-size: 3.5em;
}
ul {
list-style: none;
text-align: center;
margin: 23px 0;
}
ul li {
margin-bottom: 19px;
}
ul li a {
text-decoration: none;
color: #fff;
padding: 18px 28px;
display: inline-block;
background-color: #458588;
transition: background-color 0.3s;
border-radius: 14px;
font-size: 1.6em;
}
ul li a:hover {
background-color: #5e9ea0;
}
@media only screen and (max-width: 600px) {
body {
font-size: 16.2px;
}
.container {
margin: 25.2px auto;
padding: 12.6px;
border-radius: 12.6px;
}
h1 {
font-size: 2.7em;
}
ul li a {
font-size: 1.26em;
padding: 16.2px 23.4px;
}
}
.social-icons {
display: flex;
justify-content: center;
gap: 18px;
position: fixed;
bottom: 18px;
right: 18px;
}
.social-icons img {
width: 48px;
height: 48px;
filter: invert(100%) brightness(200%);
}
img {
display: block;
margin: 0 auto;
width: 78%;
max-width: 390px;
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Roboto', sans-serif; background-color: #282828; color: #fff; font-size: 22px; }
.container { max-width: 1050px; margin: 36px auto; padding: 19px; border-radius: 17px; font-size: 1.3em; text-align: center; }
h1 { color: #458588; font-size: 3.5em; }
ul { list-style: none; margin: 23px 0; }
li { margin-bottom: 19px; }
a { text-decoration: none; color: #fff; padding: 18px 28px; background-color: #458588; transition: background-color 0.3s; border-radius: 14px; font-size: 1.6em; display: inline-block; }
a:hover { background-color: #5e9ea0; }
@media (max-width: 600px) {
body { font-size: 16.2px; }
.container { margin: 25.2px auto; padding: 12.6px; border-radius: 12.6px; }
h1 { font-size: 2.7em; }
a { font-size: 1.26em; padding: 16.2px 23.4px; }
}
.social-icons { display: flex; justify-content: center; gap: 18px; position: fixed; bottom: 18px; right: 18px; }
.social-icons img { width: 48px; height: 48px; filter: invert(100%) brightness(200%); }
img { display: block; margin: 0 auto; width: 78%; max-width: 390px; }
</style>
</head>
<body>
@ -105,7 +30,7 @@
<ul>
<li><a href="https://codeberg.org/joygnu" target="_blank" rel="noopener noreferrer">Codeberg</a></li>
<li><a href="https://github.com/joygnu" target="_blank" rel="noopener noreferrer">Github</a></li>
<li><a href="https://discord.com/users/580999203187195913" target="_blank" rel="noopener noreferrer">Discord</a></li>
<li><a href="https://wallpapers.joygnu.org/" target="_blank" rel="noopener noreferrer">Wallpapers</a></li>
<li><a href="https://steamcommunity.com/profiles/76561199238796088" target="_blank" rel="noopener noreferrer">Steam</a></li>
</ul>
<div class="social-icons">
@ -115,4 +40,3 @@
</div>
</body>
</html>