2024-07-18 13:47:17 +02:00
<!DOCTYPE html>
2024-07-14 22:24:53 +02:00
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
2024-09-08 15:22:24 +02:00
< meta name = "viewport" content = "width=device-width" >
2024-08-25 17:43:54 +02:00
< title > Joy's Website シ< / title >
2024-08-24 15:15:08 +02:00
< style >
2024-09-08 15:22:24 +02:00
body {font-family: 'Roboto', sans-serif; background-color: #282828; color: #D5C4A1; font-size: 26.4px; text-align: center; margin: 0; padding: 0;}
.button {text-decoration: none; color: #D5C4A1; padding: 21.6px 33.6px; background-color: #458588; border-radius: 12px; font-size: 1.68em; display: inline-block; box-shadow: 4.8px 4.8px 9.6px #3C3836, -4.8px -4.8px 9.6px #3C3836; transition: background-color 0.3s, box-shadow 0.3s;}
.button:hover {background-color: #357a7c; box-shadow: 7.2px 7.2px 14.4px #3C3836, -7.2px -7.2px 14.4px #3C3836;}
.footer-icons img {width: 57.6px; height: 57.6px;}
2024-09-01 17:49:38 +02:00
@media (max-width: 600px) {
2024-09-08 15:22:24 +02:00
.button {font-size: 1.44em; padding: 16.8px 24px;}
h2 {font-size: 2.4em;}
p {font-size: 1.32em; margin: 0 auto 36px auto;}
.footer-icons img {width: 48px; height: 48px;}
2024-08-25 17:43:54 +02:00
}
< / style >
2024-07-14 22:24:53 +02:00
< / head >
2024-08-24 15:15:08 +02:00
< body >
2024-09-08 15:22:24 +02:00
< div style = "max-width: 1200px; margin: 24px auto; padding: 24px; border-radius: 21.6px;" >
< img src = "linux.webp" alt = "Linux Logo" style = "display: block; margin: 0 auto; max-width: 480px;" >
< section style = "margin: 48px 0;" >
< h2 style = "color: #458588; font-size: 2.4em;" > About Me< / h2 >
< p style = "font-size: 1.20em; max-width: 960px; margin: 0 auto;" > Hi, I'm Joy. I'm interested in GNU/Linux, especially NixOS. I also enjoy self-hosting.< / p >
2024-08-24 15:15:08 +02:00
< / section >
2024-09-08 15:22:24 +02:00
< ul style = "list-style: none; margin: 76.8px 0; padding: 0;" >
< li style = "margin-bottom: 36px;" > < a href = "https://4get.joygnu.org" class = "button" > 4get< / a > < / li >
< li style = "margin-bottom: 36px;" > < a href = "https://wallpapers.joygnu.org/" class = "button" > Wallpapers< / a > < / li >
< li style = "margin-bottom: 36px;" > < a href = "https://git.joygnu.org/" class = "button" > Git Sever< / a > < / li >
2024-07-14 22:24:53 +02:00
< / ul >
2024-09-08 15:22:24 +02:00
< div class = "footer-icons" style = "display: flex; justify-content: center; gap: 21.6px; position: fixed; bottom: 21.6px; right: 21.6px;" >
< a href = "https://git.joygnu.org/joy/www.joygnu.org" aria-label = "Git Repository" target = "_blank" rel = "noopener noreferrer" > < img src = "icons/git-alt.svg" alt = "Git" > < / a >
2024-09-01 17:49:38 +02:00
< a href = "mailto:contact@joygnu.org" aria-label = "Email" > < img src = "icons/envelope.svg" alt = "Email" > < / a >
2024-07-14 22:24:53 +02:00
< / div >
< / div >
< / body >
< / html >