1
0
mirror of https://github.com/vichan-devel/vichan.git synced 2024-12-12 15:51:17 +01:00
vichan/stylesheets/style.css

1612 lines
24 KiB
CSS
Raw Normal View History

/* === GENERAL TAG SETTINGS === */
/* Page Layouts */
2010-11-02 11:57:33 +01:00
body {
2014-09-27 07:38:25 +02:00
background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%;
color: black;
font-family: arial,helvetica,sans-serif;
font-size: 10pt;
2014-09-27 07:38:25 +02:00
margin: 0 4px;
padding-left: 4px;
padding-right: 4px;
2010-11-02 11:57:33 +01:00
}
2014-09-26 11:06:45 +02:00
main,
aside,
section {
display: block;
margin: 0 auto;
width: 100%;
}
main {
max-width: 1110px;
}
/* Tables */
table {
margin: auto;
width: 100%;
}
table {
margin: auto;
width: 100%;
}
table tbody td {
margin: 0;
padding: 4px 15px 4px 4px;
text-align: left;
}
table thead th {
border: 1px solid #000333;
padding: 4px 15px 5px 5px;
background: #98E;
color: #000333;
text-align: left;
white-space: nowrap;
}
table tbody tr:nth-of-type( even ) {
background-color: #D6DAF0;
}
td.minimal,th.minimal {
width: 1%;
white-space: nowrap;
}
table.mod.config-editor {
font-size: 9pt;
width: 100%;
}
table.mod.config-editor td {
text-align: left;
padding: 5px;
border-bottom: 1px solid #98e;
}
table.mod.config-editor input[type="text"] {
width: 98%;
}
/* Uncategorized */
2015-03-11 11:04:31 +01:00
#post-form-outer {
text-align: center;
}
#post-form-inner {
display: inline-block;
}
.post-table, .post-table-options, textarea {
width: 100%;
}
.post-table th, .post-table-options th {
width: 85px;
2015-03-11 11:04:31 +01:00
}
.post-table-options {
display: none;
}
.required-field-cell {
vertical-align: top;
}
.show-options-cell {
text-align: right;
}
2014-11-03 09:28:04 +01:00
.hidden {
display:none;
}
a,a:visited {
text-decoration: underline;
color: #34345C;
2010-11-02 11:57:33 +01:00
}
a:hover,p.intro a.post_no:hover {
2014-09-27 07:38:25 +02:00
color: #ff0000;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
a.post_no {
text-decoration: none;
margin: 0;
padding: 0;
2010-11-02 11:57:33 +01:00
}
2014-09-26 11:06:45 +02:00
2012-05-10 16:17:49 +02:00
p.intro a.post_no {
color: inherit;
2012-05-03 16:21:16 +02:00
}
p.intro a.post_no,p.intro a.email,p.intro a.post_anchor {
2014-09-27 07:38:25 +02:00
margin: 0;
2010-11-02 11:57:33 +01:00
}
2014-09-27 07:38:25 +02:00
2010-11-02 11:57:33 +01:00
p.intro a.email span.name {
color: #34345C;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
p.intro a.email:hover span.name {
2014-09-27 07:38:25 +02:00
color: #ff0000;
2010-11-02 11:57:33 +01:00
}
2011-02-17 15:13:56 +01:00
p.intro label {
display: inline;
2011-02-17 15:13:56 +01:00
}
p.intro time,p.intro a.ip-link,p.intro a.capcode {
direction: ltr;
unicode-bidi: embed;
}
2010-11-02 11:57:33 +01:00
h2 {
color: #AF0A0F;
2014-09-27 07:38:25 +02:00
font-size: 11pt;
margin: 0;
padding: 0;
2012-03-31 12:01:55 +02:00
}
2012-03-31 12:01:55 +02:00
header {
2014-09-27 07:38:25 +02:00
margin: 1em 0;
2011-05-25 12:21:00 +02:00
}
2012-04-22 08:52:24 +02:00
h1 {
font-family: tahoma;
letter-spacing: -2px;
font-size: 20pt;
margin: 0;
2011-05-25 12:21:00 +02:00
}
header div.subtitle,h1 {
color: #AF0A0F;
2014-09-27 07:38:25 +02:00
text-align: center;
2011-05-25 12:21:00 +02:00
}
2014-09-27 07:38:25 +02:00
2012-03-31 12:01:55 +02:00
header div.subtitle {
2014-09-27 07:38:25 +02:00
font-size: 8pt;
2010-11-02 11:57:33 +01:00
}
2011-05-25 12:21:00 +02:00
form table {
margin: auto;
2011-05-25 12:21:00 +02:00
}
2011-05-25 12:21:00 +02:00
form table input {
height: auto;
2010-11-02 11:57:33 +01:00
}
input[type="text"],input[type="password"],textarea {
2014-09-27 07:38:25 +02:00
border: 1px solid #a9a9a9;
text-indent: 0;
text-shadow: none;
text-transform: none;
word-spacing: normal;
font-size: inherit;
2015-03-11 11:04:31 +01:00
font-family: sans-serif;
2010-11-02 11:57:33 +01:00
}
#quick-reply input[type="text"], input[type="password"], #quick-reply textarea {
max-width: 100%;
}
2014-11-10 01:22:59 +01:00
#upload input[type="file"] {
2014-11-01 04:04:58 +01:00
max-width: 230px;
}
2011-05-25 12:21:00 +02:00
form table tr td {
text-align: left;
margin: 0;
padding: 0;
2012-04-16 08:40:24 +02:00
}
2012-04-16 08:40:24 +02:00
form table.mod tr td {
padding: 2px;
2011-05-25 12:21:00 +02:00
}
2011-05-25 12:21:00 +02:00
form table tr th {
text-align: left;
padding: 4px;
2011-05-25 12:21:00 +02:00
}
2014-09-27 07:38:25 +02:00
2011-05-25 12:21:00 +02:00
form table tr th {
background: #98E;
2010-11-02 11:57:33 +01:00
}
form table tr td div.center {
text-align: center;
float: left;
2015-03-11 00:18:28 +01:00
padding: 3px;
padding-top: 0px;
border: 1px dashed black;
margin: 2px
2011-01-02 12:32:38 +01:00
}
2015-03-11 11:04:31 +01:00
/*form table tr td div input {
display: block;
2014-09-27 07:38:25 +02:00
margin: 2px auto 0 auto;
2011-01-02 12:32:38 +01:00
}
2011-01-02 12:32:38 +01:00
form table tr td div label {
font-size: 10px;
2015-03-11 11:04:31 +01:00
}*/
.unimportant,.unimportant * {
font-size: 10px;
2010-11-02 11:57:33 +01:00
}
2014-04-27 15:48:47 +02:00
.file {
float: left;
margin-right: 2px;
}
.file:not(.multifile) .post-image {
float: left;
}
.file:not(.multifile) {
float: none;
}
2010-11-02 11:57:33 +01:00
p.fileinfo {
display: block;
margin: 0 0 0 20px;
}
div.post p.fileinfo {
padding-left: 5px;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
div.banner {
background-color: #E04000;
font-size: 12pt;
2014-09-27 07:38:25 +02:00
font-weight: bold;
text-align: center;
margin: 1em 0;
2010-11-02 11:57:33 +01:00
}
div.banner,div.banner a {
2014-09-27 07:38:25 +02:00
color: white;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
div.banner a:hover {
color: #EEF2FF;
text-decoration: none;
2010-11-02 11:57:33 +01:00
}
img.banner,img.board_image {
display: block;
border: 1px solid #a9a9a9;
2014-09-27 07:38:25 +02:00
margin: 12px auto 0 auto;
2011-01-21 03:14:55 +01:00
}
.post-image {
display: block;
float: left;
2014-09-27 07:38:25 +02:00
margin: 5px 20px 10px 20px;
border: none;
2010-11-02 11:57:33 +01:00
}
.full-image {
2014-10-28 17:22:43 +01:00
float: left;
2014-10-28 17:19:32 +01:00
padding: 5px;
margin: 0 20px 0 0;
max-width: 98%;
}
div.post .post-image {
2014-09-27 07:38:25 +02:00
padding: 5px;
margin: 0 20px 0 0;
2010-11-02 11:57:33 +01:00
}
2010-12-16 13:08:52 +01:00
div.post img.icon {
display: inline;
margin: 0 5px;
padding: 0;
2010-12-16 13:08:52 +01:00
}
2013-12-02 22:15:29 +01:00
div.post i.fa {
margin: 0 4px;
font-size: 16px;
}
2010-11-02 11:57:33 +01:00
div.post.op {
margin-right: 20px;
margin-bottom: 5px;
2010-11-02 11:57:33 +01:00
}
2011-02-20 08:28:39 +01:00
div.post.op hr {
border-color: #D9BFB7;
2011-02-20 08:28:39 +01:00
}
2010-11-02 11:57:33 +01:00
p.intro {
2014-09-27 07:38:25 +02:00
margin: 0.5em 0;
padding: 0;
padding-bottom: 0.2em;
2010-11-02 11:57:33 +01:00
}
2011-01-21 03:14:55 +01:00
input.delete {
float: left;
margin: 1px 6px 0 0;
2011-01-21 03:14:55 +01:00
}
2010-11-02 11:57:33 +01:00
p.intro span.subject {
color: #0F0C5D;
2014-09-27 07:38:25 +02:00
font-weight: bold;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
p.intro span.name {
color: #117743;
2014-09-27 07:38:25 +02:00
font-weight: bold;
2010-11-02 11:57:33 +01:00
}
p.intro span.capcode,p.intro a.capcode,p.intro a.nametag {
color: #F00000;
margin-left: 0;
2011-01-19 02:37:31 +01:00
}
2010-11-02 11:57:33 +01:00
p.intro a {
2014-11-23 23:48:00 +01:00
margin-left: 5px;
2010-11-02 11:57:33 +01:00
}
2015-03-11 00:18:28 +01:00
.sage {
color: red;
font-weight: bold;
}
2015-03-11 11:04:31 +01:00
.required-star {
color: maroon;
2010-11-02 11:57:33 +01:00
}
2015-04-19 17:25:47 +02:00
div.post p {
display: block;
margin: 0;
line-height: 1.16em;
font-size: 13px;
min-height: 1.16em;
2010-11-02 11:57:33 +01:00
}
2015-04-19 17:25:47 +02:00
div.post div.body {
2014-09-27 07:38:25 +02:00
margin-left: 1.8em;
margin-top: 0.8em;
padding-right: 3em;
padding-bottom: 0.3em;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
div.post.reply.highlighted {
background: #D6BAD0;
2010-11-02 11:57:33 +01:00
}
div.post.reply div.body a {
color: #D00;
2010-11-02 11:57:33 +01:00
}
2011-02-22 01:47:09 +01:00
div.post {
padding-left: 20px;
2011-02-22 01:47:09 +01:00
}
div.post div.body {
word-wrap: break-word;
white-space: pre-wrap;
2011-02-22 01:47:09 +01:00
}
2010-11-02 11:57:33 +01:00
div.post.reply {
background: #D6DAF0;
2014-09-27 07:38:25 +02:00
margin: 0.2em 4px;
padding: 0.5em 0.3em 0.5em 0.6em;
border-width: 1px;
border-style: none solid solid none;
border-color: #B7C5D9;
display: inline-block;
max-width: 94%!important;
2010-11-02 11:57:33 +01:00
}
div.post.reply.has-file.body-not-empty {
min-width: 33%;
}
div.post_modified {
margin-left: 1.8em;
}
div.post_modified div.content-status {
margin-top: 0.5em;
padding-bottom: 0em;
font-size: 72%;
}
2014-10-23 12:07:54 +02:00
div.post_modified div.content-status:first-child {
margin-top: 1.3em;
}
2014-10-23 06:01:23 +02:00
div.post_modified div.content-status:first-child {
margin-top: 1.3em;
}
2014-11-05 23:43:28 +01:00
a.dashed-underline {
text-decoration: none;
border-bottom: 1px dashed;
}
2010-11-02 11:57:33 +01:00
span.trip {
color: #228854;
2010-11-02 11:57:33 +01:00
}
.quote {
color: #789922;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
span.omitted {
display: block;
margin-top: 1em;
2010-11-02 11:57:33 +01:00
}
2010-11-02 11:57:33 +01:00
br.clear {
clear: left;
display: block;
2010-12-16 07:04:52 +01:00
}
2010-12-16 07:04:52 +01:00
span.controls {
float: right;
margin: 0;
padding: 0;
font-size: 80%;
2010-12-16 07:04:52 +01:00
}
2010-12-16 07:04:52 +01:00
span.controls.op {
float: none;
margin-left: 10px;
2010-12-16 07:04:52 +01:00
}
2010-12-16 07:04:52 +01:00
span.controls a {
margin: 0;
2011-01-01 15:52:22 +01:00
}
2011-01-18 14:41:43 +01:00
div#wrap {
width: 900px;
margin: 0 auto;
2011-01-18 14:41:43 +01:00
}
div.module,
2011-01-01 15:52:22 +01:00
div.ban {
2014-09-27 07:38:25 +02:00
background: white;
border: 1px solid #98E;
max-width: 700px;
margin: 30px auto;
2011-01-01 15:52:22 +01:00
}
div.ban p,
div.ban h2 {
padding: 3px 7px;
2011-01-01 15:52:22 +01:00
}
2011-01-01 15:52:22 +01:00
div.ban h2 {
background: #98E;
2014-09-27 07:38:25 +02:00
color: black;
font-size: 12pt;
2011-01-01 15:52:22 +01:00
}
2011-01-01 15:52:22 +01:00
div.ban p {
font-size: 12px;
margin-bottom: 12px;
2011-01-01 15:52:22 +01:00
}
2011-01-01 15:52:22 +01:00
div.ban p.reason {
2014-09-27 07:38:25 +02:00
font-weight: bold;
2011-01-18 14:41:43 +01:00
}
2011-03-02 07:15:37 +01:00
span.heading {
color: #AF0A0F;
font-size: 11pt;
2014-09-27 07:38:25 +02:00
font-weight: bold;
2011-03-02 07:15:37 +01:00
}
2011-01-18 14:41:43 +01:00
span.spoiler {
2014-09-27 07:38:25 +02:00
background: black;
color: black;
padding: 0 1px;
2011-01-18 14:41:43 +01:00
}
div.post.reply div.body span.spoiler a {
2014-09-27 07:38:25 +02:00
color: black;
}
span.spoiler:hover,div.post.reply div.body span.spoiler:hover a {
2014-09-27 07:38:25 +02:00
color: white;
2011-01-20 09:35:41 +01:00
}
div.styles {
float: right;
padding-bottom: 20px;
2011-01-20 09:35:41 +01:00
}
2011-01-20 09:35:41 +01:00
div.styles a {
margin: 0 10px;
2011-01-20 09:35:41 +01:00
}
2011-01-20 09:35:41 +01:00
div.styles a.selected {
text-decoration: none;
2011-01-21 03:14:55 +01:00
}
2011-02-16 04:44:34 +01:00
table.test {
width: 100%;
2011-02-16 04:44:34 +01:00
}
table.test td,table.test th {
text-align: left;
padding: 5px;
2011-02-16 04:44:34 +01:00
}
2011-02-16 04:44:34 +01:00
table.test tr.h th {
background: #98E;
2011-02-16 04:44:34 +01:00
}
2011-02-16 04:44:34 +01:00
table.test td img {
margin: 0;
2011-02-16 04:44:34 +01:00
}
2011-02-16 04:44:34 +01:00
fieldset label {
display: block;
2011-02-16 13:32:43 +01:00
}
2011-02-16 13:32:43 +01:00
div.pages {
color: #89A;
background: #D6DAF0;
display: inline;
padding: 8px;
border-right: 1px solid #B7C5D9;
border-bottom: 1px solid #B7C5D9;
2011-02-16 13:32:43 +01:00
}
div.pages.top {
display: block;
padding: 5px 8px;
margin-bottom: 5px;
position: fixed;
top: 0;
right: 0;
2014-09-27 07:38:25 +02:00
opacity: 0.9;
}
@media screen and (max-width: 800px) {
div.pages.top {
display: none!important;
}
}
2011-02-16 13:32:43 +01:00
div.pages a.selected {
2014-09-27 07:38:25 +02:00
color: black;
font-weight: bolder;
2011-02-16 13:32:43 +01:00
}
2012-05-03 16:21:16 +02:00
div.pages a {
text-decoration: none;
2011-02-16 13:38:44 +01:00
}
div.pages form {
margin: 0;
padding: 0;
display: inline;
}
div.pages form input {
margin: 0 5px;
display: inline;
}
2011-02-16 13:38:44 +01:00
hr {
border: none;
border-top: 1px solid #B7C5D9;
height: 0;
clear: left;
2011-02-19 10:25:21 +01:00
}
2011-02-20 08:28:39 +01:00
div.report {
color: #333;
2011-03-02 07:51:29 +01:00
}
2011-03-17 06:52:43 +01:00
div.top_notice {
text-align: center;
margin: 5px auto;
2011-04-03 10:21:05 +02:00
}
2011-04-03 10:21:05 +02:00
span.public_ban {
display: block;
color: red;
2014-09-27 07:38:25 +02:00
font-weight: bold;
margin-top: 15px;
2011-05-25 09:55:34 +02:00
}
2011-05-27 15:56:20 +02:00
span.toolong {
display: block;
margin-top: 15px;
2011-05-27 15:56:20 +02:00
}
2011-05-25 09:55:34 +02:00
div.blotter {
color: red;
2014-09-27 07:38:25 +02:00
font-weight: bold;
text-align: center;
2011-07-06 21:22:33 +02:00
}
2015-02-17 01:28:56 +01:00
.desktop-style div.boardlist:not(.bottom) {
2012-12-22 20:20:18 +01:00
position: fixed;
top: 0;
left: 0;
right: 0;
margin-top: 0;
z-index: 30;
box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
border-bottom: 1px solid;
background-color: #D6DAF0;
2012-12-22 20:20:18 +01:00
}
2012-12-22 20:20:18 +01:00
.desktop-style body {
padding-top: 20px;
}
.desktop-style .sub {
background: inherit;
}
2012-12-22 20:20:18 +01:00
.desktop-style .sub .sub {
display: inline-block;
text-indent: -9000px;
width: 7px;
background: url('img/arrow.png') right center no-repeat;
}
.desktop-style .sub .sub:hover,.desktop-style .sub .sub.hover {
2012-12-22 20:20:18 +01:00
display: inline;
text-indent: 0;
2012-12-22 20:20:18 +01:00
background: inherit;
}
2012-12-24 03:39:47 +01:00
#attention_bar {
height: 1.5em;
2014-01-06 04:14:51 +01:00
max-height: 1.5em;
2012-12-24 03:39:47 +01:00
width: 100%;
2014-01-06 04:14:51 +01:00
max-width: 100%;
2012-12-24 03:39:47 +01:00
text-align: center;
2014-01-06 04:14:51 +01:00
overflow: hidden;
2012-12-24 03:39:47 +01:00
}
2012-12-24 03:39:47 +01:00
#attention_bar_form {
display: none;
padding: 0;
margin: 0;
}
2012-12-24 03:39:47 +01:00
#attention_bar_input {
width: 100%;
padding: 0;
margin: 0;
text-align: center;
}
2012-12-24 03:39:47 +01:00
#attention_bar:hover {
background-color: rgba(100%,100%,100%,0.2);
2012-12-24 03:39:47 +01:00
}
p.intro.thread-hidden {
margin: 0;
padding: 0;
}
form.ban-appeal {
margin: 9px 20px;
}
form.ban-appeal textarea {
display: block;
2013-10-28 00:27:23 +01:00
}
2013-10-28 00:27:23 +01:00
.MathJax_Display {
display:inline!important;
2013-10-28 00:27:23 +01:00
}
pre {
margin:0
display: inline!important;
2013-10-28 00:27:23 +01:00
}
.theme-catalog div.thread img {
float: none!important;
margin: auto;
max-height: 150px;
max-width: 200px;
box-shadow: 0 0 4px rgba(0,0,0,0.55);
border: 2px solid rgba(153,153,153,0);
}
.theme-catalog div.thread {
display: inline-block;
vertical-align: top;
text-align: center;
2014-09-27 07:38:25 +02:00
font-weight: normal;
2014-09-26 14:35:25 +02:00
margin-top: 2px;
margin-bottom: 2px;
padding: 2px;
2014-09-27 07:38:25 +02:00
height: 300px;
width: 205px;
overflow: hidden;
position: relative;
font-size: 11px;
2014-09-27 07:38:25 +02:00
max-height: 300px;
background: rgba(182, 182, 182, 0.12);
border: 2px solid rgba(111, 111, 111, 0.34);
max-height:300px;
}
.theme-catalog div.thread strong {
display: block;
}
.theme-catalog div.threads {
text-align: center;
margin-left: -20px;
}
.theme-catalog div.thread:hover {
background: #D6DAF0;
border-color: #B7C5D9;
}
.theme-catalog div.grid-size-vsmall img {
max-height: 33%;
max-width: 95%
}
.theme-catalog div.grid-size-vsmall {
min-width:90px; max-width: 90px;
max-height: 148px;
}
.theme-catalog div.grid-size-small img {
max-height: 33%;
max-width: 95%
}
.theme-catalog div.grid-size-small {
min-width:140px; max-width: 140px;
max-height: 192px;
}
.theme-catalog div.grid-size-large img {
max-height: 40%;
max-width: 95%
}
.theme-catalog div.grid-size-large {
min-width: 256px; max-width: 256px;
max-height: 384px;
}
.theme-catalog img.thread-image {
height: auto;
max-width: 100%;
}
@media (max-width: 420px) {
.theme-catalog ul#Grid {
padding-left: 18px;
}
2014-09-27 07:38:25 +02:00
.theme-catalog div.thread {
width: auto;
margin-left: 0;
margin-right: 0;
}
2014-09-27 07:38:25 +02:00
.theme-catalog div.threads {
overflow: hidden;
}
div.post .body {
clear: both;
}
}
.compact-boardlist {
padding: 3px;
padding-bottom: 0;
}
.compact-boardlist .cb-item {
display: inline-block;
vertical-align: middle;
}
.compact-boardlist .cb-icon {
padding-bottom: 1px;
}
.compact-boardlist .cb-fa {
font-size: 21px;
padding: 2px;
padding-top: 0;
}
.compact-boardlist .cb-cat {
padding: 5px 6px 8px 6px;
}
.cb-menuitem {
display: table-row;
}
.cb-menuitem span {
padding: 5px;
display: table-cell;
text-align: left;
border-top: 1px solid rgba(0,0,0,0.5);
}
.cb-menuitem span.cb-uri {
text-align: right;
}
.boardlist:not(.compact-boardlist) #watch-pinned::before {
content: " [ ";
}
.boardlist:not(.compact-boardlist) #watch-pinned::after {
content: " ] ";
}
.boardlist:not(.compact-boardlist) #watch-pinned {
display: inline;
}
.boardlist:not(.compact-boardlist) #watch-pinned a {
margin-left: 3pt;
}
.boardlist:not(.compact-boardlist) #watch-pinned a:first-child {
margin-left: 0pt;
}
.compact-boardlist #watch-pinned {
display: inline-block;
vertical-align: middle;
}
2014-04-06 21:19:32 +02:00
2014-08-10 20:55:37 +02:00
.new-posts {
opacity: 0.6;
margin-top: 1em;
}
.new-threads, .board-settings {
2014-08-10 20:55:37 +02:00
text-align: center;
}
#options_handler, #alert_handler {
position: fixed;
2014-09-27 07:38:25 +02:00
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
width: 100%;
height: 100%;
text-align: center;
z-index: 9900;
}
#options_background, #alert_background {
background: black;
opacity: 0.5;
position: absolute;
2014-09-27 07:38:25 +02:00
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
width: 100%;
height: 100%;
z-index: -1;
}
#options_div, #alert_div {
background-color: #d6daf0;
border: 1px solid black;
display: inline-block;
position: relative;
margin-top: 20px;
}
#options_div {
width: 600px;
2015-01-01 07:40:48 +01:00
height: 360px;
}
#alert_div {
width: 500px;
}
#alert_message {
text-align: center;
margin: 13px;
font-size: 110%;
}
.alert_button {
margin-bottom: 13px;
}
2014-10-18 15:45:01 +02:00
#options_div textarea {
max-width: 100%;
}
#options_close, #alert_close {
2014-09-27 07:38:25 +02:00
top: 0px;
right: 0px;
position: absolute;
margin-right: 3px;
font-size: 20px;
z-index: 100;
}
#options_tablist {
padding: 0px 5px;
left: 0px;
width: 70px;
top: 0px;
bottom: 0px;
height: 100%;
border-right: 1px solid black;
}
.options_tab_icon {
padding: 5px;
color: black;
cursor: pointer;
}
.options_tab_icon.active {
color: red;
}
.options_tab_icon i {
font-size: 20px;
}
.options_tab_icon div {
font-size: 11px;
}
.options_tab {
padding: 10px;
position: absolute;
2014-09-27 07:38:25 +02:00
top: 0px;
bottom: 0px;
left: 81px;
right: 0px;
text-align: left;
font-size: 12px;
2014-11-26 22:10:27 +01:00
overflow-y: auto;
}
2014-09-27 07:38:25 +02:00
.options_tab h2 {
text-align: center;
margin-bottom: 5px;
}
.mobile-style #options_div, .mobile-style #alert_div {
display: block;
width: 100%;
height: 100%;
margin-top: 0px;
}
2014-09-27 07:38:25 +02:00
.mentioned {
2014-09-27 07:38:25 +02:00
word-wrap: break-word;
}
.poster_id {
cursor: pointer;
}
2014-11-03 09:28:04 +01:00
.poster_id::before {
content: " ID: ";
}
pre {
/* Better code tags */
max-width:inherit;
word-wrap:normal;
overflow:auto;
display: block!important;
font-size:9pt;
font-family:monospace;
}
span.pln {
color:grey;
}
@media screen and (min-width: 768px) {
p.intro {
clear: none;
}
div.post div.body {
clear: none;
}
}
/* === SITE-WIDE ASSETS === */
#logo {
display: block;
width: 100%;
padding: 0;
margin: 0 0 0 0;
text-align: center;
}
#logo-link {
display: inline;
}
#logo-img {
display: inline-block;
height: 128px;
width: auto;
}
/* === GENERAL CLASSES === */
.loading {
background: none;
background-color: none;
background-image: url('/static/infinity.gif');
background-position: center center;
background-repeat: no-repeat;
min-height: 76px;
min-width: 128px;
}
.loading-small {
background: none;
background-color: none;
background-image: url('/static/infinity-small.gif');
background-position: center center;
background-repeat: no-repeat;
min-height: 24px;
min-width: 48px;
}
/* Text and accessibility */
.ltr {
direction: ltr;
}
.rtl {
direction: rtl;
font-family: Tahoma;
}
/* Responsive helpers */
.col {
box-sizing: border-box;
float: left;
}
.col-12 { width: 100%; }
.col-11 { width: 91.66666667%; }
.col-10 { width: 83.33333333%; }
.col-9 { width: 75%; }
.col-8 { width: 66.66666667%; }
.col-7 { width: 58.33333333%; }
.col-6 { width: 50%; }
.col-5 { width: 41.66666667%; }
.col-4 { width: 33.33333333%; }
.col-3 { width: 25%; }
.col-2 { width: 16.66666667%; }
.col-1 { width: 8.33333333%; }
.left-push {
float: left;
}
.right-push {
float: right;
}
/* Layout design */
.box {
background: #D6DAF0;
border: 1px solid #000333;
color: #000333;
margin: 0 0 12px 0;
}
.box-title {
background: #98E;
color: #000333;
font-size: 120%;
font-weight: bold;
padding: 4px 8px;
}
.box-content {
padding: 0 8px;
margin: 4px 0;
}
.clearfix {
display: block;
clear: both;
visibility: hidden;
overflow: hidden;
font-size: 0px;
line-height: 0px;
box-sizing: border-box;
border: none;
height: 0;
margin: 0;
padding: 0;
width: 100%;
zoom: 1;
}
/* === SPECIFIC PAGES & FEATURES === */
/* Board List */
div.boardlist {
margin-top: 3px;
color: #89A;
font-size: 9pt;
}
div.boardlist.bottom {
margin-top: 12px;
clear: both;
}
div.boardlist a {
text-decoration: none;
}
/* Threads */
/* Thread Footer */
#thread-interactions {
margin: 8px 0;
clear: both;
}
#thread-links {
float: left;
}
#thread-links > a {
padding-left: none;
padding-right: 10px;
}
#thread-quick-reply {
display: none;
position: absolute;
left: 50%;
right: 50%;
text-align: center;
width: 100px;
margin-left: -50px;
}
#thread_stats {
float: right;
}
#post-moderation-fields {
float: right;
text-align: right;
}
#delete-fields {
}
#report-fields {
}
/* threadwatcher */
#watchlist {
display: none;
max-height: 250px;
overflow: auto;
border: 1px solid;
border-style: none solid solid none;
width: 50%;
margin: 0 auto;
margin-bottom: 10px;
}
#watchlist {
font-size: 8pt;
width: 15%;
position: fixed;
right: 0pt;
bottom: 0pt;
margin: 0pt;
padding: 0pt;
}
.watchlist-inner, .watchlist-controls {
margin: 0pt;
text-align: center;
}
#watchlist-toggle, .watchThread, .watchlist-remove, #clearList, #clearGhosts {
cursor: pointer;
}
2014-10-22 06:08:17 +02:00
.own_post {
font-style: italic;
font-weight: normal;
opacity: .666;
}
div.mix {
display: inline-block;
2015-01-31 06:12:03 +01:00
}
2015-02-17 01:28:56 +01:00
.theme-catalog div.thread:hover {
overflow-y: auto; width: 100%
}
2015-01-31 06:12:03 +01:00
/* Mona Font */
.aa {
font-family: Mona, "MS PGothic", " Pゴシック", sans-serif;
display: block!important;
font-size: 12pt;
2014-10-22 06:08:17 +02:00
}
.dx,
.dy,
.dz {
2015-03-11 00:18:28 +01:00
width: 30px;
text-align: right;
display: inline-block;
}
2015-03-11 11:04:31 +01:00
/* Dice */
2015-03-11 11:04:31 +01:00
.dice-option table {
border: 1px dotted black;
margin: 0;
border-collapse: collapse;
}
.dice-option table td {
text-align: center;
border-left: 1px dotted black;
padding-left: 2px;
padding-right: 2px;
padding-bottom: 2px;
}
/* Quick reply (why was most of this ever in the script?) */
#quick-reply {
position: fixed;
right: 5%;
top: 5%;
float: right;
display: block;
padding: 0 0 0 0;
width: 300px;
z-index: 100;
}
#quick-reply #post-form-inner {
min-width: 300px;
}
#quick-reply .post-table tr td:nth-child(2) {
width: 33%;
text-align: right;
padding-right: 4px;
}
#quick-reply tr td:nth-child(2) input[type="submit"] {
width: 99%;
}
#quick-reply th, #quick-reply td {
margin: 0;
padding: 0;
}
#quick-reply th {
text-align: center;
padding: 2px 0;
border: 1px solid #222;
}
#quick-reply th .handle {
float: left;
width: 100%;
display: inline-block;
}
#quick-reply th .close-btn {
float: right;
padding: 0 5px;
}
#quick-reply input[type="text"], #quick-reply select {
width: 100%;
padding: 2px;
font-size: 10pt;
box-sizing: border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing: border-box;
}
#quick-reply textarea {
min-width: 100%;
box-sizing: border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing: border-box;
font-size: 10pt;
resize: both;
}
#quick-reply input, #quick-reply select, #quick-reply textarea {
margin: 0 0 1px 0;
}
#quick-reply input[type="file"] {
padding: 5px 2px;
}
#quick-reply .nonsense {
display: none;
}
#quick-reply td.recaptcha {
text-align: center;
padding: 0 0 1px 0;
}
#quick-reply td.recaptcha span {
display: inline-block;
width: 100%;
background: white;
border: 1px solid #ccc;
cursor: pointer;
}
#quick-reply td.recaptcha-response {
padding: 0 0 1px 0;
}
@media screen and (max-width: 600px) {
#quick-reply {
display: none !important;
}
}
#youtube-size input {
width: 50px;
}
2015-03-15 15:18:47 +01:00
/* File selector */
.dropzone {
color: #000;
cursor: default;
margin: auto;
padding: 0px 4px;
text-align: center;
min-height: 50px;
max-height: 140px;
transition: 0.2s;
background-color: rgba(200, 200, 200, 0.5);
overflow-y: auto;
}
.dropzone-wrap {
width: 100%;
}
.dropzone .file-hint {
color: rgba(0, 0, 0, 0.5);
cursor: pointer;
position: relative;
margin-bottom: 5px;
padding: 10px 0px;
top: 5px;
transition: 0.2s;
border: 2px dashed rgba(125, 125, 125, 0.4);
}
.file-hint:hover, .dropzone.dragover .file-hint {
color: rgba(0, 0, 0, 1);
border-color: rgba(125, 125, 125, 0.8);
}
.dropzone.dragover {
background-color: rgba(200, 200, 200, 1);
}
.dropzone .file-thumbs {
text-align: left;
width: 100%;
}
.dropzone .tmb-container {
padding: 3px;
overflow-x: hidden;
white-space: nowrap;
}
.dropzone .file-tmb {
height: 40px;
width: 70px;
cursor: pointer;
display: inline-block;
text-align: center;
background-color: rgba(187, 187, 187, 0.5);
background-size: cover;
background-position: center;
}
.dropzone .file-tmb span {
font-weight: 600;
position: relative;
top: 13px;
}
.dropzone .tmb-filename {
display: inline-block;
vertical-align: bottom;
bottom: 12px;
position: relative;
margin-left: 5px;
}
.dropzone .remove-btn {
cursor: pointer;
color: rgba(125, 125, 125, 0.5);
display: inline-block;
vertical-align: bottom;
bottom: 10px;
position: relative;
margin-right: 5px;
font-size: 20px
}
.dropzone .remove-btn:hover {
color: rgba(125, 125, 125, 1);
2014-10-22 06:08:17 +02:00
}
table.board-list-table {
display: table;
margin: -2px;
margin-bottom: 10px;
overflow: hidden;
table-layout: fixed;
}
table.board-list-table .board-meta {
padding-right: 4px;
width: 70px;
}
table.board-list-table .board-uri {
max-width: 196px;
}
table.board-list-table .board-title {
width: auto;
}
table.board-list-table .board-pph {
width: 55px;
padding: 4px;
}
table.board-list-table .board-max {
width: 90px;
padding: 4px;
}
table.board-list-table .board-unique {
width: 100px;
padding: 4px;
}
table.board-list-table .board-tags {
width: auto;
padding: 0 15px 0 4px;
}
table.board-list-table .board-uri .board-nsfw {
color: rgb(230,0,0);
margin: 0 0 0 0.6em;
float: right;
}
table.board-list-table .board-uri .board-sfw {
/* I'm using blue instead of green to help users with Deuteranopia (most common form of colorblndness). */
color: rgb(0,0,230);
margin: 0 0 0 0.6em;
float: right;
}
table.board-list-table div.board-cell {
max-width: 100%;
overflow: hidden;
}
tbody.board-list-loading {
display: none;
}
tbody.board-list-loading .loading {
height: 80px;
}
tbody.board-list-omitted td {
background: #98E;
border-top: 1px solid #000333;
padding: 8px;
font-size: 125%;
text-align: center;
}
tbody.board-list-omitted #board-list-more {
cursor: default;
}
tbody.board-list-omitted #board-list-more.board-list-hasmore {
cursor: pointer;
}
tbody.board-list-omitted .board-page-loadmore {
display: none;
}
tbody.board-list-omitted .board-list-hasmore .board-page-loadmore {
display: inline;
}
aside.search-container {
margin-bottom: 12px;
}
aside.search-container .box {
margin-right: 12px;
}
.board-search {
margin: 8px 0;
}
.search-item {
margin: 8px 0;
}
.search-sfw {
display: block;
cursor: pointer;
font-size: 110%;
line-height: 120%;
}
#search-sfw-input {
margin: 0;
padding: 0;
transform: scale(1.20);
}
#search-lang-input,
#search-title-input,
#search-tag-input {
box-sizing: border-box;
font-size: 110%;
line-height: 120%;
vertical-align: top;
padding: 2px 0 2px 4px;
max-width: 100%;
min-width: 100%;
width: 100%:
}
#search-loading {
display: inline-block;
vertical-align: bottom;
}
ul.tag-list {
display: block;
list-style: none;
margin: 8px 8px -9px 8px;
padding: 8px 0 0 0;
border-top: 1px solid #000333;
}
ul.tag-list::after {
content: ' ';
display: block;
clear: both;
}
li.tag-item {
display: inline-block;
float: left;
font-size: 100%;
list-style: none;
margin: 0;
padding: 0 4px 0 0;
}
li.tag-item:last-child {
padding-bottom: 17px;
}
a.tag-link {
overflow: hidden;
white-space: nowrap;
}
li.tag-item a.tag-link {
}
td.board-tags a.tag-link {
display: inline-block;
margin: 0 0.4em 0 0;
}
@media screen and (max-width: 1100px) {
aside.search-container {
width: 100%;
margin-bottom: 12px;
}
aside.search-container .box {
margin-right: 0;
}
section.board-list {
margin-top: 12px;
width: 100%;
}
table.board-list-table .board-meta,
table.board-list-table .board-pph,
table.board-list-table .board-tags {
padding: 0;
margin: 0;
font-size: 0;
width: 0;
}
}