This repository has been archived on 2023-08-28. You can view files and clone it, but cannot push or open issues/pull-requests.
memejoin-svelte/src/app.html

82 lines
2.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
</head>
<style>
body {
display: flex;
flex-direction: column;
align-items: center;
background-color: #313052;
font-family: 'Cantarell';
}
h1, h2, h3, h4, h5, p, label, li {
color: lightgrey;
}
div#intros {
display: flex;
flex-direction: column;
align-items: center;
background-color: #323259;
padding: 0.5em;
box-shadow: 1px 3px 15px 1px #1f1f36;
}
div#guild-settings {
display: flex;
flex-direction: row;
align-items: center;
background-color: #2a2a4a;
margin: 1em;
box-shadow: 1px 3px 4px 1px #1f1f36;
}
div#channel-settings {
display: flex;
flex-direction: column;
align-items: center;
background-color: #2a2a4a;
margin: 0.5em;
}
div#list {
display: inline-flex;
width: 85%;
flex-direction: column;
align-items: center;
}
button, #list-item {
color: lightgray;
border-style: none;
border-radius: 4px;
background-image: linear-gradient(0deg, #1f1f36, #23233d);
padding: 0.5em 0.5em 0.5em;
margin: 0 0 16px 0px;
width: 100%;
user-select: none;
}
button:hover, #list-item:hover {
background-image: linear-gradient(0deg, #34345b, #393963);
box-shadow: 1px 3px 15px 1px #1f1f36;
}
#list-item > input[type="checkbox"] {
display: none;
}
#list-item:has(input[type="checkbox"]:checked) {
background-image: linear-gradient(0deg, #40406e, #444475);
}
</style>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>
</body>
</html>