new homepage

This commit is contained in:
2025-08-04 23:29:07 +02:00
parent bb9b66d077
commit 0a1e36ccc8
3 changed files with 61 additions and 14 deletions

BIN
www/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@@ -4,7 +4,8 @@
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>CWS</title> <title>cws</title>
<link rel="icon" href="/favicon.ico" />
<link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="style.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" /> <link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
@@ -12,10 +13,20 @@
</head> </head>
<body> <body>
<div> <main>
<h1>Hello from <span class="highlight">CWS</span>!</h1> <h1>Hello from <span class="highlight">cws</span>!</h1>
<p>Open an image <a href="/cws.jpg" target="_blank">here</a>.</p> <p>
</div> Open an image
<a href="/cws.jpg" target="_blank" rel="noopener noreferrer">here</a>.
</p>
</main>
<footer class="icon-credit">
<a target="_blank" href="https://icons8.com/icon/38796/linux">Linux</a>
icon by
<a target="_blank" href="https://icons8.com">Icons8</a>
</footer>
</body> </body>
</html> </html>

View File

@@ -2,11 +2,29 @@ body {
margin: 0; margin: 0;
height: 100vh; height: 100vh;
font-family: "Montserrat", sans-serif; font-family: "Montserrat", sans-serif;
background: linear-gradient(135deg, #ff6a6a, #ff9472); background: linear-gradient(135deg, #3a8ddb, #6dd5fa);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
color: white; color: white;
animation: fadeIn 1s ease-out;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
main {
text-align: center;
padding: 1rem;
} }
h1 { h1 {
@@ -16,7 +34,7 @@ h1 {
} }
.highlight { .highlight {
color: #ffe678; color: #d1b3ff;
} }
p { p {
@@ -36,14 +54,32 @@ a:hover {
color: #ffe678; color: #ffe678;
} }
@keyframes fadeIn { .icon-credit {
from { position: absolute;
opacity: 0; bottom: 10px;
transform: translateY(10px); width: 100%;
text-align: center;
font-size: 0.8rem;
color: #cccccc;
}
.icon-credit a {
color: #cccccc;
text-decoration: none;
transition: color 0.3s;
}
.icon-credit a:hover {
color: #ffffff;
}
/* Mobile tweaks */
@media (max-width: 480px) {
h1 {
font-size: 2.2rem;
} }
to { p {
opacity: 1; font-size: 1rem;
transform: translateY(0);
} }
} }