coyote/routes/css.cpp

279 lines
5.3 KiB
C++
Raw Normal View History

2023-11-22 08:39:24 +00:00
#include <string>
#include <FastHash.h>
#include "routes.h"
#include "../servehelper.h"
static const constexpr char css[] = R"EOF(
:root {
--bg-color: black;
--fg-color: white;
--font-size: 13pt;
--error-background-color: rgb(100, 0, 0);
--error-border-color: red;
--error-text-color: white;
--accent-color: #962AC3;
--bright-accent-color: #DE6DE6;
}
* {
margin: 0;
padding: 0;
}
2023-11-24 03:57:12 +00:00
p, details {
margin-top: 1em;
margin-bottom: 1em;
}
2023-11-24 12:46:00 +00:00
ul, ol {
2023-11-24 03:57:12 +00:00
margin: revert;
padding: revert;
}
details[open] {
margin-bottom: 0;
}
summary:hover {
text-decoration: underline;
}
2023-11-22 08:39:24 +00:00
html {
background-color: var(--bg-color);
color: var(--fg-color);
font-size: var(--font-size);
font-family: sans-serif;
padding: 10px;
2023-11-23 12:20:49 +00:00
overflow-wrap: break-word;
2023-11-22 08:39:24 +00:00
}
2023-11-24 07:30:03 +00:00
pre {
/* https://stackoverflow.com/a/248013 */
white-space: pre-wrap;
}
2023-11-23 12:20:49 +00:00
img {
object-fit: cover;
}
2023-11-22 08:39:24 +00:00
a {
color: var(--accent-color);
}
a:hover {
color: var(--bright-accent-color);
}
/* CUSTOM EMOJI and FONT AWESOME ICONS */
.custom_emoji, svg {
2023-11-23 00:16:56 +00:00
height: 1em;
width: 1em;
/* https://stackoverflow.com/a/489394 */
vertical-align: middle;
2023-11-23 00:16:56 +00:00
}
/* FONT AWESOME ICONS */
svg {
filter: invert(1);
}
2023-11-23 00:16:56 +00:00
2023-11-23 06:05:17 +00:00
/* POST */
2023-11-24 11:43:53 +00:00
.main_post :is(.post-contents, details) {
font-size: 1.1rem;
2023-11-23 23:46:47 +00:00
}
2023-11-23 08:49:27 +00:00
.post {
margin-top: 1em;
}
2023-11-23 06:05:17 +00:00
.post-header, .post-header a {
display: flex;
}
.post-header a {
color: inherit;
text-decoration: none;
}
.post-header a:hover {
text-decoration: underline;
}
.post-avatar {
width: 3em;
height: 3em;
}
.post-header span, .post-header time {
margin-top: auto;
margin-bottom: auto;
margin-left: 0.5em;
}
.post-header a:has(time) {
margin-left: auto;
}
2023-11-23 12:20:49 +00:00
.post-attachments:not(:empty) {
margin-top: 1em;
margin-bottom: 1em;
}
/* https://stackoverflow.com/a/7354648 */
@media (min-width: 801px) {
.post-attachments {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 0.5em;
width: fit-content;
}
.post-attachments * {
margin: initial;
}
}
.post-attachments :is(img, video, audio) {
width: 320px;
height: 180px;
}
/* do not ask why not fit-content or min-content. i spent one hour on this, and that is one hour too long to be spending on this god damn grid */
.post-attachments audio {
height: 40px;
}
2023-11-24 06:37:26 +00:00
/* POLL */
.poll-option {
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.poll-percentage {
margin-right: 0.5em;
}
.poll-bar {
height: 0.5em;
display: block;
background-color: lightgray;
border-radius: 10em;
margin-top: 0.25em;
}
.poll-bar[width="0%"] {
width: 0.5em;
}
2023-11-22 08:39:24 +00:00
/* ERROR PAGE */
.error {
text-align: center;
background-color: var(--error-background-color);
color: var(--error-text-color);
border-style: solid;
border-color: var(--error-border-color);
}
.error * {
margin: revert;
padding: revert;
}
/* USER PAGE */
.user_page-header {
width: 100%;
2023-11-22 08:47:08 +00:00
height: 15em;
2023-11-22 08:39:24 +00:00
}
.user_page-main_header {
2023-11-22 08:39:24 +00:00
display: flex;
}
.user_page-profile {
2023-11-22 08:39:24 +00:00
width: 7.5em;
height: 7.5em;
2023-11-23 23:55:02 +00:00
margin-right: 0.5em;
2023-11-22 08:39:24 +00:00
}
.user_page-main_header span {
2023-11-22 08:39:24 +00:00
margin-top: auto;
margin-bottom: auto;
}
/* https://stackoverflow.com/a/7354648 */
@media (min-width: 801px) {
.user_page-user_description {
display: grid;
grid-template-columns: 1fr 1fr;
2023-11-23 00:16:56 +00:00
grid-gap: 1em;
2023-11-22 08:39:24 +00:00
}
}
.user_page-user_bio {
line-height: 1.25;
}
.user_page-user_links {
height: fit-content;
width: fit-content;
text-align: left;
margin-top: 1em;
margin-bottom: 1em;
/* https://stackoverflow.com/a/5680823 */
border-collapse: collapse;
}
.user_page-user_links td {
padding-left: 1em;
}
.user_page-user_links .verified {
background-color: rgba(0, 150, 0, 0.3);
}
.user_page-user_links .verified td::after {
content: "";
color: rgb(100, 255, 100);
}
.user_page-user_posts_nav {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
text-align: center;
}
.user_page-user_posts_nav a {
text-decoration: none;
}
2023-11-23 08:49:27 +00:00
.user_page-user_posts_nav .selected {
font-weight: bold;
color: inherit;
}
.user_page-user_posts_nav .selected:hover {
text-decoration: underline;
}
2023-11-24 11:43:53 +00:00
/* USER PAGE and TAGS PAGE */
.more_posts {
2023-11-23 08:49:27 +00:00
margin-top: 1em;
text-align: center;
/* don't ask why, but making it a block element just works */
display: block;
}
2023-11-24 12:46:00 +00:00
/* ABOUT PAGE */
.about_page-header {
width: 100%;
height: 15em;
}
:is(.about_page-about, .about_page-rules) summary {
font-size: 130%;
font-weight: bold;
}
.about_page-about * {
margin: revert;
padding: revert;
}
2023-11-22 08:39:24 +00:00
)EOF";
// one for \0, one for trailing newline
#define CSS_LEN sizeof(css) / sizeof(css[0]) - 2
#if __cpp_constinit
#define CONSTINIT constinit
#else
#define CONSTINIT
#endif
CONSTINIT const uint64_t css_hash = FastHash(css, CSS_LEN, 0);
void css_route(const httplib::Request& req, httplib::Response& res) {
using namespace std::string_literals;
res.set_header("ETag", "\""s + std::to_string(css_hash) + '"');
res.set_header("Cache-Control", "max-age=31536000, immutable");
if (should_send_304(req, css_hash)) {
res.status = 304;
res.set_header("Content-Length", std::to_string(CSS_LEN));
res.set_header("Content-Type", "text/css");
} else {
res.set_content(css, CSS_LEN, "text/css");
}
}