64 lines
1.9 KiB
HTML
64 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="assets/css/style.css" />
|
|
<link rel="icon" href="favicon.png" />
|
|
<link rel="me" href="https://chaos.social/@c3cat" />
|
|
<title>c3cat</title>
|
|
|
|
<style>
|
|
/* site-specific styles */
|
|
|
|
@layer per-site {
|
|
.resources-container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
column-gap: 1ch;
|
|
row-gap: 1rem;
|
|
justify-content: space-around;
|
|
align-items: stretch;
|
|
padding-left: 0;
|
|
|
|
&>a {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-basis: 45%;
|
|
flex-grow: 1;
|
|
max-width: 85vw;
|
|
border: 1px solid var(--accent-color);
|
|
padding: 8px;
|
|
text-decoration: unset;
|
|
color: var(--fg-color);
|
|
background-color: color-mix(in hsl, var(--bg-color) 90%, var(--fg-color) 10%);
|
|
min-height: 2rem;
|
|
text-align: center;
|
|
font-size: larger;
|
|
|
|
&:hover {
|
|
background-color: color-mix(in hsl, var(--bg-color) 80%, var(--fg-color) 20%);
|
|
box-shadow: 4px 4px 6px var(--accent-color);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="container">
|
|
<main>
|
|
<h1 class="title">c3dog – Dog Ears Operation Center</h1>
|
|
<picture>
|
|
<source srcset="assets/img/dog_dark.png" media="(prefers-color-scheme: dark)"/>
|
|
<img src="assets/img/dog.png" alt="C3CAT with a cat ear headband around the 'A'" class="hero-img"/>
|
|
</picture>
|
|
|
|
<ul class="resources-container">
|
|
<a href="https://c3dog.de/">
|
|
<span>Go to <b>c3dog.de</b></span>
|
|
</a>
|
|
</ul>
|
|
</main>
|
|
</body>
|
|
</html>
|