diff options
Diffstat (limited to 'stylesheets/style.css')
| -rw-r--r-- | stylesheets/style.css | 2009 |
1 files changed, 1488 insertions, 521 deletions
diff --git a/stylesheets/style.css b/stylesheets/style.css index b9a4789f..94428412 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -1,640 +1,754 @@ -/* backup version before modifying bar.top */ +/*Lainchan*/ -/*for trollin -audio { - display:none; +div.sidearrows{ + display:none; } -*/ -/*FIXED THE FUCKING BREAKOUT LINKS MOTHER FUCKING FINALLY -kalyx*/ -a{ - overflow-wrap: break-word; + +td{ + +} + + + +html, body { + max-width: 100%!important; + overflow-x: hidden!important; +} + +.post-image{ + max-width: 94%!important; +} +select{ + float:right; +} + +div.pages{ + + margin:0!important; + padding: 0!important; +} + +div.boardlist.bottom { + + text-align: center!important; + display: none!important; } -p.intro a.post_no, p.intro a.email, p.intro a.post_anchor, a.mentioned, time, span.name{ - overflow-wrap: break-word; + +img.banner, img.board_image { + + max-width: 100%!important; + } -html { - width: 98%!important; +.pintro{ + width: 98%!important; } + +.bar { + + display: table!important; + position: fixed; + width: 100%; + left: 0px; + z-index: 3; + background-color: #333333; + border-color: #B7C5D9; +} +.bar > :not(script) { + display: table-cell; + vertical-align: middle; +} +.bar.top { + text-align: center; + top: 0px; + border-bottom: 1px solid #B7C5D9; +} + +.bar.bottom { + bottom: 0px; + border-top: 1px solid #333333; + background-color: #333333 ; +} + + +/*homepage banner*/ +div.lain_banner{ + margin:auto; + position: absolute; +} + + +/* === GENERAL TAG SETTINGS === */ + +/* Page Layouts */ body { - background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%; - color: black; - font-family: arial, helvetica, sans-serif; - font-size: 10pt; - margin: 0px; - padding: 44px 5px; - max-width: 100%!important; + background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%; + color: black; + font-family: arial,helvetica,sans-serif; + font-size: 10pt; + margin: 0 4px; + padding-left: 4px; + padding-right: 4px; } -img[alt="mascot"] { - display: block; - margin: 0 auto 0 auto; - position: relative; - z-index: -1; + +main, +aside, +section { + display: block; + margin: 0 auto; + width: 100%; } -table * { - margin: 0; +main { + max-width: 1110px; } + +/* Tables */ table { - margin: 0px auto; + margin: auto; + } -tr:not(:nth-child(4)) { - height: 22px; +table.board-list-table { + width: 100%; } -tr *{ - padding: 0px; +table tbody td { + margin: 0; + padding: 4px 15px 4px 4px; + + text-align: left; } -th { - width: 64px; - text-align: left; - padding: 0px 5px; - border: 1px solid #000; - color: #000; - background-color: #98E; +table thead th { + border: 1px solid #000333; + padding: 4px 15px 5px 5px; + + background: #98E; + color: #000333; + text-align: left; + white-space: nowrap; } -textarea{ - width: 100%; - min-width: 308px; +table tbody tr:nth-of-type( even ) { + background-color: transparent!important; } -input:not([type="checkbox"]) { - height: 22px; + +tr{ + } -textarea, input:not([type="file"]) { - -moz-box-sizing: border-box!important; - box-sizing: border-box!important; - border: 1px solid #AAA; - padding: 2px 4px 3px 4px; - background-color: white; + +td.minimal,th.minimal { + width: 1%; + white-space: nowrap; } -input[name="post"] { - width: 72px; + +table.mod.config-editor { + font-size: 9pt; + width: 100%; } -[name="post"] [type="text"]:not([name="subject"]){ - width: 100%; - min-width: 236px; + +table.mod.config-editor td { + text-align: left; + padding: 5px; + border-bottom: 1px solid #98e; } -[name="post"] textarea { - min-height: 22px; + +table.mod.config-editor input[type="text"] { + width: 98%; } -[name="post"] [type="text"][name="subject"] { - width: calc(100% - 74px); - min-width: 162px; +.longtable p { + margin: 0; } -input#upload_file { - width: 180px; + +/* Uncategorized */ +#post-form-outer { + text-align: center; } -@media (max-width: 321px) { - [name="post"] [type="text"]:not([name="subject"]), [name="post"] textarea { - width: 236px; - min-width: 236px; - } - input#upload_file { - width: 160px; - } + +#post-form-inner { + display: inline-block; } -#spoilercontainer { - display: inline-block; - float: right; - position: relative; - top: 3px; - right: 4px; +.post-table, .post-table-options, textarea { + width: 100%; } -a, a:visited { - text-decoration: underline; - color: #34345C; + +#post-form-inner .post-table tr { + background-color: transparent; } -p.intro a.post_no, p.intro a.email, p.intro a.post_anchor { - color: #ff0000; + +.post-table th, .post-table-options th { + width: 85px; } -p.intro > a:nth-child(5) { - margin-left: 0.6em; + +.post-table-options { + display: none; } -a.post_no { - text-decoration: none; - margin: 0; - padding: 0; + +.required-field-cell { + vertical-align: top; } -p.intro a.post_no { - color: inherit; + +.show-options-cell { + text-align: right; } -p.intro a.post_no, p.intro a.email { - margin: 0; + +.hidden { + display:none; } -p.intro a.email span.name { - color: #34345C; + +a,a:visited { + text-decoration: underline; + color: #34345C; } -p.intro a.email:hover span.name { - color: #ff0000; + +a:hover,.intro a.post_no:hover { + color: #ff0000; } -p.intro label { - display: inline; + +a.post_no { + text-decoration: none; + margin: 0; + padding: 0; } -p.intro time, p.intro a.ip-link, p.intro a.capcode { - direction: ltr; - unicode-bidi: embed; + +.intro a.post_no { + color: inherit; +} + +.intro a.post_no,p.intro a.email,p.intro a.post_anchor { + margin: 0; +} + +.intro a.email span.name { + color: #34345C; +} + +.intro a.email:hover span.name { + color: #ff0000; +} + +.intro label { + display: inline; } -.badges { - text-align: center; - clear: both; + +.intro time,p.intro a.ip-link,p.intro a.capcode { + direction: ltr; + unicode-bidi: embed; } + h2 { - color: #AF0A0F; - font-size: 11pt; - margin: 0; - padding: 0; + color: #AF0A0F; + font-size: 11pt; + margin: 0; + padding: 0; } + header { - margin: 1em 0; -} -@font-face { - font-family: 'lain'; - src: url('./fonts/nrdyyh.woff') format('woff'), - url('./fonts/tojcxo.TTF') format('truetype'); + margin: 1em 0; } + h1 { - font-family: 'lain', tahoma; - letter-spacing: -2px; - font-size: 18pt; - margin: 0; + font-family: tahoma; + letter-spacing: -2px; + font-size: 20pt; + margin: 0; } -header div.subtitle, h1 { - color: #AF0A0F; - text-align: center; + +header div.subtitle,h1 { + color: #AF0A0F; + text-align: center; } + header div.subtitle { - margin: 5px; - font-size: 8pt; + font-size: 8pt; } -[name="post"] * { - -moz-appearance: none!important; + +form table { + margin: auto; } -.unimportant, .unimportant * { - font-size: 10px; + +form table input { + height: auto; } -.file { - float: left; - margin-right: 2px; +input[type="text"],input[type="password"],textarea { + border: 1px solid #a9a9a9; + text-indent: 0; + text-shadow: none; + text-transform: none; + word-spacing: normal; + font-size: inherit; + font-family: sans-serif; + + padding:0px!important; } -.file:not(.multifile) .post-image { - float: left; + + + +#upload input[type="file"] { + max-width: 230px; } -[data-board] > .files > :nth-child(1):not(.multifile) > a:before { - content: url('/static/partyhat.gif'); - float: left; - display: block; - margin-right: -160px; - position: relative; - top: -120px; - left: -30px; - pointer-events: none; +form table tr td { + text-align: left; + margin: 0; + padding: 0; +} + +form table.mod tr td { + padding: 2px; +} + +form table tr th { + text-align: left; + padding: 4px; +} + +form table tr th { + background: #98E; +} + +form table tr td div.center { + text-align: center; + float: left; + padding: 3px; + padding-top: 0px; + border: 1px dashed black; + margin: 2px +} + +/*form table tr td div input { + display: block; + margin: 2px auto 0 auto; +} +form table tr td div label { + font-size: 10px; +}*/ + +.unimportant,.unimportant * { + font-size: 10px; } -[data-board] > .files > :nth-child(1).multifile > a:before { - content: url('/static/partyhat.gif'); - float: left; - display: block; - margin-right: -160px; - position: relative; - top: -120px; - left: -50px; - pointer-events: none; + +.file { + float: left; + margin-right: 2px; +} + +.file:not(.multifile) .post-image { + float: left; } + .file:not(.multifile) { - float: none; + float: none; } + p.fileinfo { - display: block; - margin: 0 0 0px 0px; - white-space: normal!important; -} -.fileinfo :not(a) { - word-wrap: break-word; + display: block; + margin: 0 0 0 20px; } + div.post p.fileinfo { - padding-left: 5px; + padding-left: 5px; } div.banner { - background-color: #E04000; - border: 1px solid #E04000; - font-size: 12pt; - font-weight: bold; - text-align: center; - margin: 0 auto; - height: 14px; + background-color: #E04000; + font-size: 12pt; + font-weight: bold; + text-align: center; + margin: 1em 0; } -div.banner, div.banner a { - color: white; + +div.banner,div.banner a { + color: white; } + div.banner a:hover { - color: #EEF2FF; - text-decoration: none; -} -img.banner, img.board_image { - display: block; - border: 1px solid #666; - margin: 12px auto 0 auto; - max-width: 100%!important; - clear: both; + color: #EEF2FF; + text-decoration: none; } -img.post-image { - display: block; - float: left; - margin: 5px 10px 5.5px 19px; - border: none; + +img.banner,img.board_image { + display: block; + border: 1px solid #a9a9a9; + margin: 12px auto 0 auto; } -div.post img.post-image { - padding: 5px; - padding-left: 0; - margin: 4px 10px 0 0; + +.post-image { + display: block; + float: left; + margin: 5px 20px 10px 20px; + border: none; } -.multifile img.post-image { - margin-left: 0px; - margin-top: 0px; + +.full-image { + float: left; + padding: 5px; + margin: 0 20px 0 0; + max-width: 98%; } -div.post.reply img.post-image { - margin-left: 19px; + +div.post .post-image { + padding: 5px; + margin: 0 20px 0 0; } + div.post img.icon { - display: inline; - margin: 0 5px; - padding: 0; + display: inline; + margin: 0 5px; + padding: 0; } -div.post i.fa { - margin: 0 4px; - font-size: 16px; + +div.post i.fa, div.thread i.fa { + margin: 0 4px; + font-size: 16px; } + div.post.op { - margin-right: 20px; - margin-bottom: 5px; + margin-right: 20px; + margin-bottom: 5px; } div.post.op hr { - border-color: #D9BFB7; + border-color: #D9BFB7; } -p.intro { - margin: 2px 0; - padding: 0; - padding-bottom: 0.2em; -} -.post.reply p.intro { - white-space: nowrap; +.intro { + margin: 0.5em 0; + padding: 0; + padding-bottom: 0.2em; } + input.delete { - float: left; - margin: 0px 6px 0 0; - position: relative; - top: 2px; -} -p.intro span.subject { - color: #0F0C5D; - font-weight: bold; -} -p.intro span.name { - color: #117743; - font-weight: bold; + float: left; + margin: 1px 6px 0 0; } -p.intro span.capcode, p.intro a.capcode, p.intro a.nametag { - color: #F00000; - margin-left: 0; + +.intro span.subject { + color: #0F0C5D; + font-weight: bold; } -p.intro .mentioned a{ - margin-left: 8px; + +.intro span.name { + color: #117743; + font-weight: bold; } -div.delete { - float: right; - margin-bottom: 2px; + +.intro span.capcode,p.intro a.capcode,p.intro a.nametag { + color: #F00000; + margin-left: 0; } -div.delete :not([type="submit"]):not([type="checkbox"]) { - width: 166px; + +.intro a { + margin-left: 5px; } -div.delete [type="submit"] { - margin-left: 2px; + +.sage { + color: red; + font-weight: bold; } -div.postcontainer -{ - display: inline-block; - white-space: nowrap; /* changed "nowrap" to */ - word-break: break-word; /* bugfix: letters no longer shoot around the screen */ - max-width: 100%!important; + +.required-star { + color: maroon; } -div.post.reply p { - margin: 3px 0 0 0; + +div.post p { + display: block; + margin: 0; + + line-height: 1.16em; + font-size: 13px; + min-height: 1.16em; } -div.post.reply p.fileinfo { - margin-left: 13px; + +div.post div.body { + margin-top: 0.8em; + padding-right: 3em; + padding-bottom: 0.3em; } + div.post.reply div.body { - margin-left:19px; - margin-top: 9px; - padding-right: 3em; - padding-bottom: 8px; -} -pre { - overflow: auto; + margin-left: 1.8em; } + div.post.reply.highlighted { - background: #D6BAD0; + background: #D6BAD0; } + div.post.reply div.body a { - color: #D00; - word-wrap: break-word; - word-break: break-all; - white-space: pre-wrap; + color: #D00; } + div.post div.body { - white-space: pre-wrap; /* css-3 */ - white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ - white-space: -pre-wrap; /* Opera 4-6 */ - white-space: -o-pre-wrap; /* Opera 7 */ - word-wrap: normal; - margin-left: 19px; -} -div.sidearrows { - display: inline-block; - margin-top: 0px; - float: left; - box-sizing: border-box; - width: 18px; + word-wrap: break-word; + white-space: pre-wrap; } + div.post.reply { - background: #D6DAF0; - margin: 1.5px 0px; - padding: 0.2em 0.3em 0.5em 0.6em; - border-width: 1px; - border-style: none solid solid none; - border-color: #B7C5D9; - display: inline-block; - max-width: 97%!important; + background: #D6DAF0; + 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; +} + +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%; +} +div.post_modified div.content-status:first-child { + margin-top: 1.3em; +} + +div.post_modified div.content-status:first-child { + margin-top: 1.3em; } + +a.dashed-underline { + text-decoration: none; + border-bottom: 1px dashed; +} + span.trip { - color: #228854; + color: #228854; } -span.quote { - color: #789922; + +.quote { + color: #789922; } + span.omitted { - display: block; - margin-top: 1em; - opacity: 0.7; - margin-left: 19px; + display: block; + margin-top: 1em; } + br.clear { - clear: left; - display: block; + clear: left; + display: block; } + span.controls { - float: right; - margin: 0; - padding: 0; - font-size: 80%; + float: right; + margin: 0; + padding: 0; + font-size: 80%; } + span.controls.op { - float: none; - margin-left: 10px; + float: none; + margin-left: 10px; } + span.controls a { - margin: 0; + margin: 0; } + div#wrap { - width: 900px; - margin:0 auto; + width: 900px; + margin: 0 auto; } + +div.module, div.ban { - background: white; - border: 1px solid #98E; - max-width: 766px; - margin: -2px auto 30px auto; + background: white; + border: 1px solid #98E; + max-width: 700px; + margin: 30px auto; } -div.ban p, div.ban h2 { - padding: 3px 7px; + +div.ban p, +div.ban h2 { + padding: 3px 7px; } + div.ban h2 { - background: #98E; - color: black; - font-size: 12pt; - word-wrap: break-word; + background: #98E; + color: black; + font-size: 12pt; } + div.ban p { - font-size: 12px; - margin-bottom: 12px; + font-size: 12px; + margin-bottom: 12px; } + div.ban p.reason { - font-weight: bold; + font-weight: bold; } + span.heading { - color: #AF0A0F; - font-size: 11pt; - font-weight: bold; + color: #AF0A0F; + font-size: 11pt; + font-weight: bold; } + span.spoiler { - background: black; - color: black; - padding: 0 1px; + background: black; + color: black; + padding: 0 1px; } + div.post.reply div.body span.spoiler a { - color: black; + color: black; } -span.spoiler:hover, div.post.reply div.body span.spoiler:hover a { - color: white; + +span.spoiler:hover,div.post.reply div.body span.spoiler:hover a { + color: white; +} + +div.styles { + float: right; + padding-bottom: 20px; } + div.styles a { - margin: 0 10px; + margin: 0 10px; } + div.styles a.selected { - text-decoration: none; + text-decoration: none; } -fieldset label { - display: block; -} -.bar { - -moz-box-shadow: 0 0 40px #d1d5ee; - -webkit-box-shadow: 0 0 40px #d1d5ee; - box-shadow: 0 0 40px #d1d5ee; - display: table; - position: fixed; - width: 100%; - left: 0px; - z-index: 3; - background-color: #D6DAF0; - border-color: #B7C5D9; -} -.bar > :not(script) { - display: table-cell; - vertical-align: middle; +table.test { + width: 100%; } -.bar.top { - text-align: center; - top: 0px; - border-bottom: 1px solid #B7C5D9; + +table.test td,table.test th { + text-align: left; + padding: 5px; } -.bar.bottom { - bottom: 0px; - border-top: 1px solid #B7C5D9; +table.test tr.h th { + background: #98E; } -div.pages, div.boardlist { - padding: 2px 0px 3px 5px; - min-height: 17px!important; + +table.test td img { + margin: 0; } -div.pages { - padding: 0px 0px 0px 5px; + +fieldset label { + display: block; } div.pages { - color: #89A; - background: transparent!important; - border-right: 1px solid #B7C5D9; - border-bottom: 1px solid #B7C5D9; - border-width: 0 0 0 0!important; - display: table-cell; - margin-top: -1px; + /*! color: #89A; */ + /*! background: #D6DAF0; */ + display: inline-block; + padding: 8px; + /*! margin: 8px 0 4px 0; */ + /*! border-right: 1px solid #B7C5D9; */ + /*! border-bottom: 1px solid #B7C5D9; */ } + div.pages.top { - bottom:0px; - left: 0px; - width: 100%; - position: fixed; - z-index: 99; - font-size: 10pt; - text-align: left; + display: block; + padding: 5px 8px; + margin-bottom: 5px; + position: fixed; + top: 0; + right: 0; + opacity: 0.9; +} +@media screen and (max-width: 800px) { + div.pages.top { + display: none!important; + } } div.pages a.selected { - color: black; - font-weight: bolder; + color: black; + font-weight: bolder; } + div.pages a { - text-decoration: none; + text-decoration: none; } + div.pages form { - margin-top: -1px; - padding: 0; - display: inline; + margin: 0; + padding: 0; + display: inline; } -div.pages form input { - margin: 0 5px; - margin-top: -1px; - display: inline; -} -div.boardlist { - color: #89A; - font-size: 10pt; - margin-top: 0px; - text-align: center; - margin: 0 auto; +div.pages form input { + margin: 0 5px; + display: inline; } -#style-select { - display: table-cell; - font-size: 10pt; - z-index: 3; - text-align: right; - width: auto; -} -#style-select select { - margin-right: -1px; - padding: 3px 4px 3px 4px; - margin-bottom: -1px; - margin-top: -1px; -} hr { - border: none; - border-top: 1px solid #B7C5D9; - height: 0; - clear: left; -} -#boardfront .boardlist { - margin-bottom: -28px; -} -/*new 051214 */ -body #boardfront { - width: 100%; -} -div.boardlist.bottom { - margin-top: 0px; - clear: right; -} -div.boardlist a { - text-decoration: none; + border: none; + border-top: 1px solid #B7C5D9; + height: 0; + clear: left; } + div.report { - color: #333; -} -table.modlog { - margin: auto; - width: 100%; -} -table.modlog tr td { - text-align: left; - margin: 0; - padding: 4px 15px 0 0; -} -table.modlog tr th { - text-align: left; - padding: 4px 15px 5px 5px; - white-space: nowrap; -} -table.modlog tr th { - background: #98E; -} -td.minimal, th.minimal { - width: 1%; - white-space: nowrap; + color: #333; } + div.top_notice { - text-align: center; - margin: 5px auto; + text-align: center; + margin: 5px auto; } + span.public_ban { - display: block; - color: red; - font-weight: bold; - margin-top: 15px; + display: block; + color: red; + font-weight: bold; + margin-top: 15px; } + span.toolong { - display: block; - margin-top: 15px; + display: block; + margin-top: 15px; } + div.blotter { - color: red; - font-weight: bold; - text-align: center; -} -div.blotter img { - max-width: 100%!important; -} -table.mod.config-editor { - font-size: 9pt; - width: 100%; + color: red; + font-weight: bold; + text-align: center; } -table.mod.config-editor td { - text-align: left; - padding: 5px; - border-bottom: 1px solid #98e; + +.desktop-style div.boardlist:not(.bottom) { + 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; } -table.mod.config-editor input[type="text"] { - width: 98%; + +.desktop-style body { + padding-top: 20px; } .desktop-style .sub { background: inherit; } + .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 { + +.desktop-style .sub .sub:hover,.desktop-style .sub .sub.hover { display: inline; text-indent: 0; background: inherit; @@ -648,90 +762,692 @@ table.mod.config-editor input[type="text"] { text-align: center; overflow: hidden; } -.reply-hidden { - background-color: red!important; -} + #attention_bar_form { display: none; padding: 0; margin: 0; } + #attention_bar_input { width: 100%; padding: 0; margin: 0; text-align: center; } + #attention_bar:hover { - background-color: rgba(100%, 100%, 100%, 0.2); + background-color: rgba(100%,100%,100%,0.2); } -p.intro.thread-hidden { - margin: 0; - padding: 0; + +.intro.thread-hidden { + margin: 0; + padding: 0; } form.ban-appeal { - margin: 9px 20px; + margin: 9px 20px; } + form.ban-appeal textarea { - display: block; + display: block; } -.theme-catalog #Grid > li { - display:inline-block; +.MathJax_Display { + display:inline!important; +} +pre { + margin:0 + display: inline!important; } + .theme-catalog div.thread img { - float:none!important; - margin: auto; - margin-bottom: 12px; - 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); + 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; - margin-bottom:25px; - margin-left: 20px; - margin-right: 15px; - text-align:center; - font-weight:normal; - width:205px; - overflow:hidden; - position: relative; - font-size:11px; - padding: 15px; - max-height:300px; - background: rgba(182, 182, 182, 0.12); - border: 2px solid rgba(111, 111, 111, 0.34); + display: inline-block; + vertical-align: top; + text-align: center; + font-weight: normal; + margin-top: 2px; + margin-bottom: 2px; + padding: 2px; + height: 300px; + width: 205px; + overflow: hidden; + position: relative; + font-size: 11px; + 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; + 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.threads{ - text-align: center; - margin-left: -20px; + +.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 { - width: 200px; - max-width: 200px; - max-height: 350px; + min-width:140px; max-width: 140px; + max-height: 192px; +} + +.theme-catalog div.grid-size-medium img { + max-height: 33%; + max-width: 95% +} + +.theme-catalog div.grid-size-medium { + min-width:200px; max-width: 200px; + max-height: 274px; +} + +.theme-catalog div.grid-size-large img { + max-height: 40%; + max-width: 95% } .theme-catalog div.grid-size-large { - width: 300px; - max-width: 300px; - max-height: 450px; + min-width: 256px; max-width: 256px; + max-height: 384px; } .theme-catalog img.thread-image { - height: auto; - max-width: 100%; + height: auto; + max-width: 100%; +} + +@media (max-width: 420px) { + .theme-catalog ul#Grid { + padding-left: 18px; + } + + .theme-catalog div.thread { + width: auto; + margin-left: 0; + margin-right: 0; + } + + .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; +} + +.new-posts { + opacity: 0.6; + margin-top: 1em; +} + +.new-threads, .board-settings { + text-align: center; +} + +#options_handler, #alert_handler { + position: fixed; + 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; + 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; + height: 360px; +} + +#alert_div { + width: 500px; +} + +#alert_message { + text-align: center; + margin: 13px; + font-size: 110%; +} + +.alert_button { + margin-bottom: 13px; +} + +#options_div textarea { + max-width: 100%; +} + +#options_close, #alert_close { + 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; + top: 0px; + bottom: 0px; + left: 81px; + right: 0px; + text-align: left; + font-size: 12px; + overflow-y: auto; +} + +.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; +} + +.mentioned { + word-wrap: break-word; +} + +.poster_id { + cursor: pointer; + white-space:nowrap; +} + +.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) { + .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; + float: right; + margin-right: 10px; +} +#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; +} +.own_post { + font-style: italic; + font-weight: normal; + opacity: .666; +} +div.mix { + display: inline-block; +} + +/* Mona Font */ +.aa { + font-family: Mona, "MS PGothic", "MS Pゴシック", sans-serif; + display: block!important; + font-size: 12pt; + line-height: 1.1; +} +.dx, +.dy, +.dz { + width: 30px; + text-align: right; + display: inline-block; +} + +/* Dice */ +.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; +} /* File selector */ .dropzone { @@ -811,39 +1527,290 @@ form.ban-appeal textarea { color: rgba(125, 125, 125, 1); } +table.board-list-table { + display: table; + margin: -2px; + margin-bottom: 10px; + overflow: hidden; + table-layout: fixed; +} +table.board-list-table .board-cell { + position: static; + margin: 0; + padding: 0; + box-sizing: border-box; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +table.board-list-table .board-cell::after { + content: ' '; + clear: both; +} +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 { + position: relative; + height: 15px; + width: auto; + padding: 0 15px 0 4px; +} +table.board-list-table .board-tags .tag-link { + display: inline; +} +table.board-list-table .board-tags .board-cell:hover { + position: absolute; + background: #EEF2FF; + line-height: 23px; + top: 0; + bottom: 0; + width: 310px; +} +table.board-list-table tr:nth-of-type( even ) .board-tags .board-cell { + background: #D6DAF0; +} +table.board-list-table .board-uri a { + display: inline-block; + float: left; +} +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 { + color: #34345C; + margin: 0 0 0 0.6em; + float: right; +} -/* Containerchan */ - video.post-image { - display: block; - float: left; - margin: 10px 20px; - border: none; +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%; } - div.post video.post-image { - padding: 0px; - margin: 10px 25px 5px 5px; + + 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; } -.pulse { - animation: pulse 0.53452115812918s linear 90; - -webkit-animation: pulse 0.53452115812918s linear 90; } -@keyframes pulse { - 0% { height: 450px; margin-bottom: -25px; margin-top: -25px;} - 100% { height: 350px; margin-bottom: 25px; margin-top: 25px;} + +#post-moderation-fields { + display: none; } -@-webkit-keyframes pulse { - 0% { height: 450px; margin-bottom: -25px; margin-top: -25px;} - 100% { height: 350px; margin-bottom: 25px; margin-top: 25px;} + +.announcement { + font-size: 75%; + padding-bottom: 1%; + margin-left: 5%; + margin-right: 5%; } -#threadbody .boardlist .sub:last-child, .recentbody .boardlist .sub:last-child, .donatebody .boardlist .sub:last-child { - float: right; + +/* Gallery view */ +#gallery_images { + position: absolute; + right: 0px; + bottom: 0px; + top: 0px; + width: 12%; + background-color: rgba(0, 0, 0, 0.4); + overflow: auto; } -span.sub { - white-space: nowrap!important; +#gallery_toolbar { + position: absolute; + right: 12%; + left: 0px; + bottom: 0px; + height: 32px; + background-color: rgba(0, 0, 0, 0.4); + text-align: right; +} +#gallery_images img { + width: 100%; +} +#gallery_toolbar a { + font-size: 28px; + padding-right: 5px; +} +#gallery_main { + position: absolute; + left: 0px; + right: 12%; + bottom: 32px; + top: 0px; + padding: 10px; } -footer { - clear: both; +#gallery_images img { + opacity: 0.6; + -webkit-transition: all 0.5s; + transition: all 0.5s; +} +#gallery_images img:hover, #gallery_images img.active { + opacity: 1; +} +#gallery_images img.active { + -webkit-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1); + -moz-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1); + box-shadow: 0px 0px 29px 2px rgba(255,255,255,1); + z-index: 1; } +#gallery_main img, #gallery_main video { + max-width: 100%; + max-height: 100%; + position: absolute; +} + +/* Fileboard */ +table.fileboard th, table.fileboard td { + padding: 2px; + text-align: center; +} +table.fileboard .intro a { + margin-left: 0px; +} + + + |
