The frontend/UI server, written in JS using the MarkoJS library
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

147 lines
3.2 KiB

div.post {
margin-top: 1em;
margin-bottom: 1.25em;
margin-left: -12px;
padding-left: 12px;
padding-right: 0.5ch;
transition: background-color 0.333s linear;
div.post-meta-row {
padding: 0;
margin: 0;
}
a.anchor {
display: block;
position: relative;
top: -4em;
}
div.options {
position: absolute;
text-align: right;
width: calc(100% - 38.75ch);
max-width: 95ch;
a {
display: inline-block;
padding: 0 0.5ch;
opacity: 0.5;
cursor: pointer;
user-select: none;
}
a:hover {
opacity: 1;
}
@media screen and (max-width: 700px) {
width: calc(100% - 6.5ch);
}
}
div.post-body {
font-size: 1.25em;
div.nick-wrapper {
display: inline;
.nick-decoration {
display: inline;
}
.nick {
display: inline;
}
}
div.post-content {
display: inline;
}
div.annotation {
margin-top: 0.33em;
}
p {
line-height: 1.33em;
margin-bottom: -0.25em;
span.icn-bold { font-weight: 800; }
span.icn-underline { text-decoration: underline; }
span.icn-italic { font-style: italic; }
span.icn-fg-0 { color: #fff; }
span.icn-fg-1 { color: #111; }
span.icn-fg-2 { color: #13d; }
span.icn-fg-3 { color: #173; }
span.icn-fg-4 { color: #d21; }
span.icn-fg-5 { color: #721; }
span.icn-fg-6 { color: #727; }
span.icn-fg-7 { color: #d71; }
span.icn-fg-8 { color: #aa1; }
span.icn-fg-9 { color: #1d3; }
span.icn-fg-10 { color: #177; }
span.icn-fg-11 { color: #1DD; }
span.icn-fg-12 { color: #127; }
span.icn-fg-13 { color: #c1a; }
span.icn-fg-14 { color: #444; }
span.icn-fg-15 { color: #aaa; }
span.icn-bg-0 { background-color: #fff; }
span.icn-bg-1 { background-color: #111; }
span.icn-bg-2 { background-color: #13d; }
span.icn-bg-3 { background-color: #173; }
span.icn-bg-4 { background-color: #d21; }
span.icn-bg-5 { background-color: #721; }
span.icn-bg-6 { background-color: #727; }
span.icn-bg-7 { background-color: #d71; }
span.icn-bg-8 { background-color: #aa1; }
span.icn-bg-9 { background-color: #1d3; }
span.icn-bg-10 { background-color: #177; }
span.icn-bg-11 { background-color: #1DD; }
span.icn-bg-12 { background-color: #127; }
span.icn-bg-13 { background-color: #c1a; }
span.icn-bg-14 { background-color: #444; }
span.icn-bg-15 { background-color: #aaa; }
}
p:first-of-type {
margin-top: 0;
padding-top: 0;
}
p:last-of-type {
padding-bottom: 0.1em;
margin-bottom: 0em;
}
}
}
div.post.pk-scene {
margin-left: -14px;
border-left: 2px solid #68A;
}
div.post.pk-scene.anchored {
background-color: rgba(102, 136, 170, 0.25);
}
div.post.pk-action.anchored {
background-color: rgba(170, 102, 68, 0.25);
}
div.post.pk-text.anchored {
background-color: rgba(170, 170, 170, 0.25);
}
div.post.multipart {
margin-top: -1.5em;
div.post-meta {
span {
display: none;
}
}
}
div.post.dark {
opacity: 0.25;
}