hmn/src/rawdata/scss/_forum.scss

574 lines
8.4 KiB
SCSS
Raw Normal View History

2021-03-11 04:19:37 +00:00
.display-options {
height:100%;
padding:0px 20px 0px 20px;
> * {
display:inline-block;
vertical-align:middle;
}
}
.forum h3 {
margin:0px 80px 0px 20px;
font-weight:bold;
}
.forum-narrow .forum-narrow-hide {
display: none;
}
.thread {
@include usevar('color', 'fg-font-color');
@extend .ma0;
.forum &:nth-of-type(odd),
.feed &:nth-of-type(odd),
{
@include usevar('background-color', 'forum-even-background');
}
&.more {
// background-color: transparent;
}
.profile & {
padding-left:15px;
}
.title {
font-weight: bold;
transition: border-bottom-color 0.1s;
border-bottom-color: transparent;
&:hover {
border-bottom-color: initial;
}
}
&.read {
@include usevar('color', 'forum-thread-read-color');
td {
@include usevar('color', 'forum-thread-read-color');
}
a {
@include usevar('color', 'forum-thread-read-link-color');
}
.title {
font-weight: 500;
}
}
.goto {
font-size: 200%;
width: 30px;
a {
display: block;
padding: 0px 10px;
box-sizing: border-box;
position: relative;
line-height: 100%;
background-color: transparent;
}
}
.forum & .info th {
width: 50px;
}
}
.avatar-icon {
width: 40px;
height: 40px;
flex-shrink: 0;
border-radius: 100%;
overflow: hidden;
@include usevar(background-color, dimmest-color);
&:not(.lite) {
.thread & {
left: 30px;
bottom: 10px;
}
.thread .info & {
bottom: 0px;
left: 0px;
}
.feed & {
left: -50px;
bottom: -10px;
}
.project .box & {
left: 0px;
bottom: -10px;
}
}
}
.badge {
display: inline-block;
border-radius: 1000em;
padding: 0 0.8em;
font-size: 0.9em;
line-height: 1.8em;
font-weight: bold;
&.staff {
background-color: #17b2c6;
color: white;
&::before {
content: 'Staff';
}
}
}
.contents {
div.code {
@extend .b--dimmer;
max-width: 100%;
max-height: 20em;
max-height: 80vh;
overflow: auto;
-moz-tab-size: 4;
tab-size: 4;
border-width: 1px;
border-style: solid;
}
div + br,
blockquote + br,
ul + br,
ol + br,
{
display: none;
}
}
.codeblocktable {
font-family: "Fira Mono", monospace;
font-size:14px;
overflow:auto;
line-height:1.5em;
tbody {
width:100%;
}
.linenos {
@include usevar(color, 'code-line-number-color');
font-weight:500;
padding: 5px;
background: rgba(0, 0, 0, 0.15);
}
.code {
/* Background color given by theme */
padding-right:20px;
padding-left:10px;
max-width:80em;
}
}
.post {
.wiki &,
{
padding: 0;
margin: auto;
max-width: 70em;
}
.contents {
h1, h2 {
margin: 20px 0px;
}
h2 {
font-size: 20px;
}
h5, h6 {
margin: 10px 0px;
}
strong {
font-weight: 500;
}
blockquote {
@extend .b--dimmest;
display: block;
margin-top: 0;
margin-bottom: 0;
padding: 10px 18px;
padding-top: 0;
padding-bottom: 0;
margin-left: 20px;
margin-right: 20px;
border-left-width: 1px;
border-left-style: solid;
.quotewho {
line-height: 2em;
&::after {
content: " said:";
}
}
}
img {
max-width: 100%;
}
}
&.bbcode .contents {
h1, h2, h3 {
display: inline;
}
}
.project & .contents h3,
.contents h4 {
display:block;
font-size:18px;
margin: 10px 0px;
}
.action.button {
padding:0px 10px;
margin-top:0px;
margin-right:4px;
background-color:transparent;
font-size:130%;
border-radius:0px;
border-width:0px;
border-bottom-width:2px;
transition:border-bottom-width 0.1s;
&:hover {
border-bottom-width:4px;
}
}
hr {
max-width:90%;
}
.signature {
hr {
width: 80%;
}
}
}
.post .body, .post-preview {
.size1 {
font-size:12px;
}
.size2 {
font-size:13px;
}
.size3 {
font-size:14px;
}
.size4 {
font-size:15px;
}
.size5 {
font-size:16px;
}
}
.blog {
.post {
.meta {
position:relative;
}
&.op .meta {
margin-bottom:10px;
}
.badges {
width: 40px;
font-size: 0.7em;
text-align: center;
}
&.op .body {
padding-top: 6px;
.contents {
text-align:left;
}
p {
margin-top:8px;
margin-bottom:8px;
text-align:left;
}
}
}
.sidebar {
.post > .author {
padding:15px;
text-align:center;
}
.recent-posts {
text-align:center;
padding:15px;
h2 {
display:inline;
}
}
.archive ul {
list-style-type:none;
text-align:left;
}
}
.post-list {
.post {
&:nth-child(even) {
background-color: transparent;
}
}
}
}
.wiki {
.post p {
margin: 10px 0px;
}
.toc {
@include usevar(border-color, 'wiki-border-color');
border-left-width: 1px;
.toc-number {
@include usevar(color, 'wiki-toc-number-color');
}
ul {
list-style-type: none;
margin-left: 10px;
margin-bottom: 5px;
}
li {
margin-left: 0px;
}
}
.aside {
@include usevar(border-color, 'wiki-border-color');
border-left-width: 1px;
margin-left:20px;
&::before {
margin-left:-20px;
margin-right:15px;
display:inline-block;
width:10px;
content:"\21b4 ";
}
.aside-heading {
padding:2px;
margin:1px;
border-radius:3px;
border-width:0px;
cursor:pointer;
display:inline;
background-color:transparent;
}
> .aside-body {
overflow:hidden;
padding-left:10px;
}
&.folded {
&::before {
content:"\2192 ";
}
> .aside-body {
max-height: 0px;
}
}
}
}
.featured-post .meta .avatar-icon {
left:-60px;
bottom:-5px;
}
.blog .body blockquote,
.wiki .body blockquote {
padding-top:1px;
padding-bottom:1px;
}
.content-block.blog {
p.title {
font-weight:bold;
a {
border-bottom-width:0px;
&:hover {
border-bottom-width:1px;
}
}
}
}
a.mark_as_read {
float: right;
}
.mark_as_read_toplevel_forum {
margin-left: auto;
margin-right: auto;
width: 100%;
text-align: center;
a {
text-decoration: underline;
}
}
div.mark_as_read_toplevel_blog {
margin-left: auto;
margin-right: auto;
width: 100%;
text-align: center;
a {
text-decoration: none;
}
}
.mark_as_read_toplevel_blog
div.mark_as_read_site {
margin-left: auto;
margin-right: auto;
width: 100%;
text-align: center;
a {
text-decoration: none;
}
}
.mark_as_read_site
li.post-entry {
margin-left:0px;
margin-bottom: 3px;
}
.diff {
width:100%;
max-height:100vh;
overflow-y:scroll;
margin-top:20px;
> .post-source {
@include usevar(color, 'fg-font-color');
@include usevar(background-color, 'forum-diff-source-background');
@include usevar(border-color, 'forum-diff-source-border-color');
border-width: 1px;
border-radius: 2px;
font-family: "Fira Mono", monospace;
width:49%;
box-sizing:border-box;
padding: 4px;
display:inline-block;
vertical-align: top;
}
.diff-replace,
.diff-delete,
.diff-insert,
{
border-width: 1px;
border-radius:2px;
padding:1px;
}
.diff-replace {
@include usevar(background-color, 'forum-diff-replace-background');
@include usevar(border-color, 'forum-diff-replace-border-color');
}
.diff-delete {
@include usevar(background-color, 'forum-diff-delete-background');
@include usevar(border-color, 'forum-diff-delete-border-color');
}
.diff-insert {
@include usevar(background-color, 'forum-diff-insert-background');
@include usevar(border-color, 'forum-diff-insert-border-color');
}
}
.index {
list-style-type:none;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
margin-top:20px;
.index-category {
margin-bottom:20px;
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid-column;
}
}
.bbtable {
width: 100%;
border: 1px solid;
td, th {
border: 1px solid;
padding: 4px;
}
th {
background: rgba(0, 0, 0, 0.15);
font-weight: bold;
border-bottom-width: 2px;
}
tbody tr:nth-child(even) {
background: rgba(0, 0, 0, 0.05);
}
}