diff --git a/inc/api.php b/inc/api.php index a140cd7e..31cf2293 100644 --- a/inc/api.php +++ b/inc/api.php @@ -113,7 +113,7 @@ class Api { $apiPost['ext'] = substr($file->file, $dotPos); $dotPos = strrpos($file->file, '.'); $apiPost['tim'] = substr($file->file, 0, $dotPos); - //$apiPost['md5'] = base64_encode(md5_file($file->file_path, true)); + $apiPost['md5'] = base64_encode(hex2bin($post->filehash)); } return $apiPost; diff --git a/inc/config.php b/inc/config.php index 3905f198..0d66f72d 100644 --- a/inc/config.php +++ b/inc/config.php @@ -1136,6 +1136,8 @@ // This is a particularly advanced feature - contact ctrlcctrlv or rails unless you // really know what you're doing $config['dir']['img_root'] = ''; + // DO NOT COMMENT OUT, LEAVE BLANK AND OVERRIDE IN INSTANCE CONFIG + // Though, you shouldnt be editing this file, so what do I know? // For load balancing, having a seperate server (and domain/subdomain) for serving static content is diff --git a/inc/instance-config.php b/inc/instance-config.php index 40efad1c..6e541c5f 100644 --- a/inc/instance-config.php +++ b/inc/instance-config.php @@ -120,6 +120,7 @@ $config['additional_javascript'][] = 'js/toggle-locked-threads.js'; $config['additional_javascript'][] = 'js/toggle-images.js'; $config['additional_javascript'][] = 'js/mobile-style.js'; + $config['additional_javascript'][] = 'js/id_highlighter.js' $config['font_awesome_css'] = '//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css'; diff --git a/js/catalog-link.js b/js/catalog-link.js index 5c5d9b13..05ee9efb 100644 --- a/js/catalog-link.js +++ b/js/catalog-link.js @@ -15,13 +15,8 @@ function catalog() { var board = $("input[name='board']"); -if (board.length>0) { -if (window.location.pathname.indexOf("/res/")>0){ //if we are inside a thread -var catalog_url = '../catalog.html'; -} -else { -var catalog_url = 'catalog.html'; -} +var catalog_url = configRoot + board.first().val() + "/catalog.html"; + var pages = document.getElementsByClassName('pages')[0]; var bottom = document.getElementsByClassName('boardlist bottom')[0] var subtitle = document.getElementsByClassName('subtitle')[0]; @@ -57,7 +52,6 @@ if (subtitle) { subtitle.appendChild(link2); } } -} if (active_page == 'thread' || active_page == 'index') { $(document).ready(catalog); diff --git a/js/id_colors.js b/js/id_colors.js new file mode 100644 index 00000000..7d531fde --- /dev/null +++ b/js/id_colors.js @@ -0,0 +1,37 @@ +if (active_page == 'thread' || active_page == 'index') { + $(document).ready(function(){ + $.hash = function(str) { + var i, j, msg = 0; + + for (i = 0, j = str.length; i < j; ++i) { + msg = ((msg << 5) - msg) + str.charCodeAt(i); + } + + return msg; + }; + + function stringToRGB(str){ + var rgb, hash; + + rgb = []; + hash = $.hash(str); + + rgb[0] = (hash >> 24) & 0xFF; + rgb[1] = (hash >> 16) & 0xFF; + rgb[2] = (hash >> 8) & 0xFF; + + return rgb; + } + + $(".poster_id").each(function(){ + var rgb = stringToRGB($(this).text()); + + $(this).css({ + "background-color": "rgb("+rgb[0]+", "+rgb[1]+", "+rgb[2]+")", + "padding": "3px 5px", + "border-radius": "8px", + "color": "white" + }); + }); + }); +} diff --git a/js/id_highlighter.js b/js/id_highlighter.js new file mode 100644 index 00000000..82e2c79d --- /dev/null +++ b/js/id_highlighter.js @@ -0,0 +1,44 @@ +if (active_page == 'thread' || active_page == 'index') { + $(document).ready(function(){ + function arrayRemove(a, v) { a.splice(a.indexOf(v) == -1 ? a.length : a.indexOf(v), 1); } + + var idshighlighted = []; + + function getPostsById(id){ + return $(".poster_id").filter(function(i){ + return $(this).text() == id; + }); + } + + function getMasterPosts(parents){ + if(!parents.hasClass("post")) return; + + var toRet = []; + + $(parents).each(function(){ + if($(this).hasClass("post")) + toRet.push($(this)); + }); + + return toRet; + } + + $(".poster_id").click(function(){ + var id = $(this).text(); + + if($.inArray(id, idshighlighted) !== -1){ + arrayRemove(idshighlighted, id); + + $(getMasterPosts(getPostsById(id).parents())).each(function(i){ + $(this).removeClass("highlighted"); + }); + }else{ + idshighlighted.push(id); + + $(getMasterPosts(getPostsById(id).parents())).each(function(i){ + $(this).addClass("highlighted"); + }); + } + }); + }); +} diff --git a/js/multi-image.js b/js/multi-image.js index 77c3f766..db4c6bd2 100644 --- a/js/multi-image.js +++ b/js/multi-image.js @@ -21,7 +21,9 @@ function multi_image() { var new_file = '
'; $('[type=file]:last').after(new_file); - $('form:not([id="quick-reply"]) [type=file]:last').after(new_file); + if ($("#quick-reply").length) { + $('form:not(#quick-reply) [type=file]:last').after(new_file); + } if (typeof setup_form !== 'undefined') setup_form($('form[name="post"]')); } }) diff --git a/stylesheets/style.css b/stylesheets/style.css index 109fccc7..f7a70780 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -1,446 +1,554 @@ body { - background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%; - color: black; - font-family: arial, helvetica, sans-serif; - font-size: 10pt; - margin: 0 8px; - padding-left: 5px; - padding-right: 5px; + 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; } table * { - margin: 0; + margin: 1px; } a, a:visited { - text-decoration: underline; - color: #34345C; + text-decoration: underline; + color: #34345C; } + a:hover, p.intro a.post_no:hover { - color: #ff0000; + color: #ff0000; } + a.post_no { - text-decoration: none; - margin: 0; - padding: 0; + text-decoration: none; + margin: 0; + padding: 0; } p.intro a.post_no { - color: inherit; + color: inherit; } + p.intro a.post_no, p.intro a.email, p.intro a.post_anchor { - margin: 0; + margin: 0; } + p.intro a.email span.name { - color: #34345C; + color: #34345C; } + p.intro a.email:hover span.name { - color: #ff0000; + color: #ff0000; } + p.intro label { - display: inline; + display: inline; } + p.intro time, p.intro a.ip-link, p.intro a.capcode { - direction: ltr; - unicode-bidi: embed; + 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; + margin: 1em 0; } + h1 { - font-family: tahoma; - letter-spacing: -2px; - font-size: 20pt; - margin: 0; + font-family: tahoma; + letter-spacing: -2px; + font-size: 20pt; + margin: 0; } + header div.subtitle, h1 { - color: #AF0A0F; - text-align: center; + color: #AF0A0F; + text-align: center; } + header div.subtitle { - font-size: 8pt; + font-size: 8pt; } + form { - margin-bottom: 4em; + margin-bottom: 4em; } + form table { - margin: auto; + margin: auto; } + form table input { - height: auto; + height: auto; } + input[type="text"], input[type="password"], textarea { - border: 1px solid #a9a9a9; - text-indent: 0; - text-shadow: none; - text-transform: none; - word-spacing: normal; + border: 1px solid #a9a9a9; + text-indent: 0; + text-shadow: none; + text-transform: none; + word-spacing: normal; + max-width: 75%; } + +#quick-reply input[type="text"], input[type="password"], #quick-reply textarea { + max-width: 100%; +} + form table tr td { - text-align: left; - margin: 0; - padding: 0; + text-align: left; + margin: 0; + padding: 0; } + form table.mod tr td { - padding: 2px; + padding: 2px; } + form table tr th { - text-align: left; - padding: 4px; + text-align: left; + padding: 4px; } + form table tr th { - background: #98E; + background: #98E; } + form table tr td div.center { - text-align: center; - float: left; - padding-left: 3px; + text-align: center; + float: left; + padding-left: 3px; } + form table tr td div input { - display: block; - margin: 2px auto 0 auto; + display: block; + margin: 2px auto 0 auto; } + form table tr td div label { - font-size: 10px; + font-size: 10px; } + .unimportant, .unimportant * { - font-size: 10px; + font-size: 10px; } + .file { float: left; margin-right: 2px; } + .file:not(.multifile) .post-image { float: left; } + .file:not(.multifile) { float: none; } -p.fileinfo { - display: block; - margin: 0 0 0 20px; -} -div.post p.fileinfo { - padding-left: 5px; -} -div.banner { - background-color: #E04000; - font-size: 12pt; - font-weight: bold; - text-align: center; - margin: 1em 0; -} -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 #a9a9a9; - margin: 12px auto 0 auto; -} -.post-image { - display: block; - float: left; - margin: 5px 20px 10px 20px; - border: none; -} -div.post .post-image { - padding: 5px; - margin: 0 20px 0 0; -} -div.post img.icon { - display: inline; - margin: 0 5px; - padding: 0; -} -div.post i.fa { - margin: 0 4px; - font-size: 16px; -} -div.post.op { - margin-right: 20px; - margin-bottom: 5px; -} -div.post.op hr { - border-color: #D9BFB7; -} -p.intro { - margin: 0.5em 0; - padding: 0; - padding-bottom: 0.2em; -} -input.delete { - float: left; - margin: 1px 6px 0 0; -} -p.intro span.subject { - color: #0F0C5D; - font-weight: bold; -} -p.intro span.name { - color: #117743; - font-weight: bold; -} -p.intro span.capcode, p.intro a.capcode, p.intro a.nametag { - color: #F00000; - margin-left: 0; -} -p.intro a { - margin-left: 8px; -} -div.delete { - float: right; -} -div.post.reply p { - margin: 0.3em 0 0 0; -} -div.post.reply div.body { - margin-left: 1.8em; - margin-top: 0.8em; - padding-right: 3em; - padding-bottom: 0.3em; -} -div.post.reply.highlighted { - background: #D6BAD0; -} -div.post.reply div.body a { - color: #D00; -} -div.post { - max-width: 95%; - padding-left:20px; -} -div.post div.body { - word-wrap: break-word; - white-space: pre-wrap; -} -div.post.reply { - background: #D6DAF0; - margin: 0.2em 16px; - padding: 0.2em 0.3em 0.5em 0.6em; - border-width: 1px; - border-style: none solid solid none; - border-color: #B7C5D9; - display: inline-block; -} -span.trip { - color: #228854; -} -span.quote { - color: #789922; -} -span.omitted { - display: block; - margin-top: 1em; -} -br.clear { - clear: left; - display: block; -} -span.controls { - float: right; - margin: 0; - padding: 0; - font-size: 80%; -} -span.controls.op { - float: none; - margin-left: 10px; -} -span.controls a { - margin: 0; -} -div#wrap { - width: 900px; - margin:0 auto; -} -div.ban { - background: white; - border: 1px solid #98E; - max-width: 700px; - margin: 30px auto; -} -div.ban p, div.ban h2 { - padding: 3px 7px; -} -div.ban h2 { - background: #98E; - color: black; - font-size: 12pt; -} -div.ban p { - font-size: 12px; - margin-bottom: 12px; -} -div.ban p.reason { - font-weight: bold; -} -span.heading { - color: #AF0A0F; - font-size: 11pt; - font-weight: bold; -} -span.spoiler { - background: black; - color: black; - padding: 0 1px; -} -div.post.reply div.body span.spoiler a { - color: black; -} -span.spoiler:hover, div.post.reply div.body span.spoiler:hover a { - color: white; -} -div.styles { - float: right; - padding-bottom: 20px; +p.fileinfo { + display: block; + margin: 0 0 0 20px; } + +div.post p.fileinfo { + padding-left: 5px; +} + +div.banner { + background-color: #E04000; + font-size: 12pt; + font-weight: bold; + text-align: center; + margin: 1em 0; +} + +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 #a9a9a9; + margin: 12px auto 0 auto; +} + +.post-image { + display: block; + float: left; + margin: 5px 20px 10px 20px; + border: none; +} + +div.post .post-image { + padding: 5px; + margin: 0 20px 0 0; +} + +div.post img.icon { + display: inline; + margin: 0 5px; + padding: 0; +} + +div.post i.fa { + margin: 0 4px; + font-size: 16px; +} + +div.post.op { + margin-right: 20px; + margin-bottom: 5px; +} + +div.post.op hr { + border-color: #D9BFB7; +} + +p.intro { + margin: 0.5em 0; + padding: 0; + padding-bottom: 0.2em; + clear: both; +} + +input.delete { + float: left; + margin: 1px 6px 0 0; +} + +p.intro span.subject { + color: #0F0C5D; + font-weight: bold; +} + +p.intro span.name { + color: #117743; + font-weight: bold; +} + +p.intro span.capcode, p.intro a.capcode, p.intro a.nametag { + color: #F00000; + margin-left: 0; +} + +p.intro a { + margin-left: 8px; +} + +div.delete { + float: right; +} + +div.post.reply p { + margin: 0.3em 0 0 0; +} + +div.post.reply div.body { + margin-left: 1.8em; + margin-top: 0.8em; + padding-right: 3em; + padding-bottom: 0.3em; +} + +div.post.reply.highlighted { + background: #D6BAD0; +} + +div.post.reply div.body a { + color: #D00; +} + +div.post { + max-width: 95%; + padding-left: 20px; +} + +div.post div.body { + word-wrap: break-word; + white-space: pre-wrap; +} + +div.post.reply { + background: #D6DAF0; + margin: 0.2em 4px; + 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: 95%; +} + +span.trip { + color: #228854; +} + +span.quote { + color: #789922; +} + +span.omitted { + display: block; + margin-top: 1em; +} + +br.clear { + clear: left; + display: block; +} + +span.controls { + float: right; + margin: 0; + padding: 0; + font-size: 80%; +} + +span.controls.op { + float: none; + margin-left: 10px; +} + +span.controls a { + margin: 0; +} + +div#wrap { + width: 900px; + margin: 0 auto; +} + +div.ban { + background: white; + border: 1px solid #98E; + max-width: 700px; + margin: 30px auto; +} + +div.ban p, div.ban h2 { + padding: 3px 7px; +} + +div.ban h2 { + background: #98E; + color: black; + font-size: 12pt; +} + +div.ban p { + font-size: 12px; + margin-bottom: 12px; +} + +div.ban p.reason { + font-weight: bold; +} + +span.heading { + color: #AF0A0F; + font-size: 11pt; + font-weight: bold; +} + +span.spoiler { + background: black; + color: black; + padding: 0 1px; +} + +div.post.reply div.body span.spoiler a { + color: black; +} + +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; } + table.test { - width: 100%; + width: 100%; } + table.test td, table.test th { - text-align: left; - padding: 5px; + text-align: left; + padding: 5px; } + table.test tr.h th { - background: #98E; + background: #98E; } + table.test td img { - margin: 0; + margin: 0; } + fieldset label { - display: block; + display: block; } + div.pages { - color: #89A; - background: #D6DAF0; - display: inline; - padding: 8px; - border-right: 1px solid #B7C5D9; - border-bottom: 1px solid #B7C5D9; + color: #89A; + background: #D6DAF0; + display: inline; + padding: 8px; + border-right: 1px solid #B7C5D9; + border-bottom: 1px solid #B7C5D9; } + div.pages.top { - display: block; - padding: 5px 8px; - margin-bottom: 5px; - position: fixed; - top: 0; - right: 0; - opacity: 0.9; + 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.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: 0; - padding: 0; - display: inline; + margin: 0; + padding: 0; + display: inline; } + div.pages form input { - margin: 0 5px; - display: inline; + margin: 0 5px; + display: inline; } + hr { - border: none; - border-top: 1px solid #B7C5D9; - height: 0; - clear: left; + border: none; + border-top: 1px solid #B7C5D9; + height: 0; + clear: left; } + div.boardlist { - color: #89A; - font-size: 9pt; - margin-top: 3px; + color: #89A; + font-size: 9pt; + margin-top: 3px; } + div.boardlist.bottom { - margin-top: 20px; + margin-top: 20px; } + div.boardlist a { - text-decoration: none; + text-decoration: none; } + div.report { - color: #333; + color: #333; } + table.modlog { - margin: auto; - width: 100%; + margin: auto; + width: 100%; } + table.modlog tr td { - text-align: left; - margin: 0; - padding: 4px 15px 0 0; + 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; + text-align: left; + padding: 4px 15px 5px 5px; + white-space: nowrap; } + table.modlog tr th { - background-color: #98E; + background: #98E; } + td.minimal, th.minimal { - width: 1%; - white-space: nowrap; + width: 1%; + white-space: nowrap; } + 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; + color: red; + font-weight: bold; + text-align: center; } + table.mod.config-editor { - font-size: 9pt; - width: 100%; + font-size: 9pt; + width: 100%; } + table.mod.config-editor td { - text-align: left; - padding: 5px; - border-bottom: 1px solid #98e; + text-align: left; + padding: 5px; + border-bottom: 1px solid #98e; } + table.mod.config-editor input[type="text"] { - width: 98%; + width: 98%; } + .desktop-style div.boardlist:nth-child(1) { position: fixed; top: 0; @@ -450,6 +558,7 @@ table.mod.config-editor input[type="text"] { margin-top: 0; z-index: 30; } + .desktop-style div.boardlist:nth-child(1):hover, .desktop-style div.boardlist:nth-child(1).cb-menu { background-color: rgba(90%, 90%, 90%, 0.6); } @@ -461,12 +570,14 @@ table.mod.config-editor input[type="text"] { .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 { display: inline; text-indent: 0; @@ -481,59 +592,67 @@ table.mod.config-editor input[type="text"] { text-align: center; overflow: hidden; } + #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); } + p.intro.thread-hidden { - margin: 0; - padding: 0; + margin: 0; + padding: 0; } form.ban-appeal { - margin: 9px 20px; + margin: 9px 20px; } + form.ban-appeal textarea { - display: block; + display: block; } + .MathJax_Display { display:inline!important } pre { margin:0 } + .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); + 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; - font-weight:normal; + 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; + 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; @@ -542,10 +661,12 @@ pre { background: rgba(182, 182, 182, 0.12); border: 2px solid rgba(111, 111, 111, 0.34); } + .theme-catalog div.thread strong { display: block; } -.theme-catalog div.threads{ + +.theme-catalog div.threads { text-align: center; margin-left: -20px; } @@ -556,7 +677,7 @@ div.thread:hover { } .theme-catalog div.grid-size-vsmall img { - max-height: 64px; + max-height: 64px; max-width: 100px; } @@ -597,12 +718,13 @@ div.thread:hover { .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; } @@ -612,18 +734,22 @@ div.thread:hover { 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; } @@ -632,35 +758,41 @@ div.thread:hover { .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: " [ "; + content: " [ "; } + .boardlist:not(.compact-boardlist) #watch-pinned::after { - content: " ] "; + content: " ] "; } + .boardlist:not(.compact-boardlist) #watch-pinned { display: inline; } + .boardlist:not(.compact-boardlist) #watch-pinned a { - margin-left: 3pt; + 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; + vertical-align: middle; } /* live-index.js */ @@ -668,6 +800,7 @@ div.thread:hover { opacity: 0.6; margin-top: 1em; } + .new-threads { text-align: center; } @@ -675,19 +808,29 @@ div.thread:hover { /* options.js */ #options_handler { position: fixed; - top: 0px; left: 0px; right: 0px; bottom: 0px; - width: 100%; height: 100%; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + width: 100%; + height: 100%; text-align: center; z-index: 9900; } + #options_background { background: black; opacity: 0.5; position: absolute; - top: 0px; left: 0px; right: 0px; bottom: 0px; - width: 100%; height: 100%; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; + width: 100%; + height: 100%; z-index: -1; } + #options_div { background-color: #d6daf0; border: 1px solid black; @@ -697,12 +840,16 @@ div.thread:hover { width: 600px; height: 300px; } + #options_close { - top: 0px; right: 0px; + top: 0px; + right: 0px; position: absolute; margin-right: 3px; - font-size: 20px; z-index: 100; + font-size: 20px; + z-index: 100; } + #options_tablist { padding: 0px 5px; left: 0px; @@ -712,28 +859,36 @@ div.thread:hover { 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; + top: 0px; + bottom: 0px; + left: 81px; + right: 0px; text-align: left; font-size: 12px; } + .options_tab h2 { text-align: center; margin-bottom: 5px; @@ -745,8 +900,13 @@ div.thread:hover { height: 100%; margin-top: 0px; } + .mentioned { - word-wrap: break-word; + word-wrap: break-word; +} + +.poster_id{ + cursor: pointer; } code > pre { @@ -756,5 +916,16 @@ code > pre { } code > pre > span.pln { - color:grey; + color: grey; +} + + +@media screen and (min-width: 768px) { + p.intro { + clear: none; + } + + div.post div.body { + clear: none; + } } diff --git a/stylesheets/v8ch.css b/stylesheets/v8ch.css new file mode 100644 index 00000000..bd8e68ab --- /dev/null +++ b/stylesheets/v8ch.css @@ -0,0 +1,191 @@ +@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro); + +body{ + background: #eee !important; + font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif !important; +} + +a{ + text-decoration: none; +} + +.boardlist{ + width: 100% !important; + position: fixed !important; + z-index: 99999 !important; + top: 0 !important; + left: 0 !important; + color: #222 !important; + background: #fff !important; + padding: 1em !important; + box-sizing: border-box !important; + margin-top: 0 !important; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important; +} + +img.banner, +img.board_image{ + border: none !important; +} + +.board_image, +.board_image + header{ + margin-top: 3.75em !important; + margin-bottom: 1em !important; + float: left !important; +} + +.board_image + header{ + margin-left: 1em !important; +} + +header, +header h1, +header .subtitle{ + text-align: left !important; +} + +.board_image + header + .banner{ + width: 100% !important; + float: left !important; + margin-top: 0 !important; + margin-left: 0 !important; + padding: 0.5em 0 !important; + background-color: #666 !important; +} + +form[name=post]{ + box-sizing: border-box !important; + position: fixed !important; + bottom: 0 !important; + right: 0 !important; + background: #fff !important; + margin-bottom: 0 !important; + padding: 1em !important; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) !important; +} + +form[name=post] input[type="text"], +form[name=post] textarea{ + width: 100% !important; + padding: 0.5em !important; + box-sizing: border-box !important; +} + +form table tr th{ + color: #fff !important; + background: #222 !important; +} + +#expand-all-images, +#shrink-all-images, +#treeview{ + right: 1em !important; + position: absolute !important; +} + +#expand-all-images{ + margin-top: 4em !important; +} + +#treeview{ + margin-top: 5em !important; +} + +#shrink-all-images{ + margin-top: 6em !important; +} + +#expand-all-images + hr, +#shrink-all-images + hr{ + opacity: 0 !important; + margin: 0 !important; +} + +#treeview + hr{ + opacity: 0 !important; + clear: both !important; +} + +#options_handler{ + margin-top: 3em !important; +} + +[id^=thread]{ + background: #f8f8f8 !important; + margin-bottom: 1em !important; + padding: 1em 1em 0 1em !important; + border: none !important; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2) !important; +} + +[id^=thread] hr{ + display: none !important; +} + +[id^=thread] div.post.reply { + margin: 0.5em 1em !important; + padding: 0.5em !important; + color: #222 !important; + background: #fff !important; + border: none !important; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important; +} + +[id^=thread] div.post.reply.highlighted { + background: #fec !important; +} + +p.intro.thread-hidden{ + padding-bottom: 1em !important; +} + +#vechan-reply, +#update_thread{ + float: right; + margin-right: 0.25em !important; + cursor: pointer !important; +} + +#update_thread{ + padding-left: 0 !important; +} + +#update_secs{ + color: #900 !important; +} + +.theme-catalog header{ + margin-top: 4em !important; +} + +.theme-catalog div.threads{ + text-align: left !important; +} + +.theme-catalog div.thread{ + color: #222 !important; + word-break: break-all !important; + background: #fff !important; + border: none !important; + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important; +} + +.boardlist.bottom, +.sub[data-description='1'], +.sub[data-description='2'], +.sub[data-description='3'], +#quick-reply{ + display: none !important; +} + +#favorite-star{ + text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important; +} + +pre.prettyprint.prettyprinted{ + display: block !important; + overflow-x: scroll !important; +} + +/* If you want to make a redistributable style, be sure to have a Yotsuba B theme selected. */