From d98eb528a56fef737b40c6435af36416c732eec4 Mon Sep 17 00:00:00 2001 From: adonisk Date: Fri, 26 Sep 2014 19:08:46 +0200 Subject: [PATCH 01/20] v8ch.css --- stylesheets/v8ch.css | 191 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 191 insertions(+) create mode 100644 stylesheets/v8ch.css 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. */ From b4fd7c8e2ce8d5fbeddd95ff9788a12ada900d8d Mon Sep 17 00:00:00 2001 From: Jayden Callahan Date: Sat, 27 Sep 2014 03:03:54 +0930 Subject: [PATCH 02/20] A quick update to config.php --- inc/config.php | 2 ++ 1 file changed, 2 insertions(+) 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 From 2e46875125867886780a2a0dcc022e01c111bcf4 Mon Sep 17 00:00:00 2001 From: kaernyk Date: Fri, 26 Sep 2014 14:38:08 -0400 Subject: [PATCH 03/20] Improvements to mobile display on boards/catalog --- stylesheets/style.css | 1124 ++++++++++++++++++++++++----------------- 1 file changed, 648 insertions(+), 476 deletions(-) diff --git a/stylesheets/style.css b/stylesheets/style.css index f26d01a8..129dcffb 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -1,457 +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: #000; + font-family: arial,helvetica,sans-serif; + font-size: 10pt; + min-width: 200px; + max-width: 100%; + margin: 4px!important; + padding: 4px!important; } table * { - margin: 0; + margin: 0; } -a, a:visited { - text-decoration: underline; - color: #34345C; +a,a:visited { + text-decoration: underline; + color: #34345C; } -a:hover, p.intro a.post_no:hover { - color: #ff0000; + +a:hover,p.intro a.post_no:hover { + color: red; } + a.post_no { - text-decoration: none; - margin: 0; - padding: 0; + text-decoration: none; + margin: 0; + padding: 0; +} + +p.intro a.post_no,p.intro a.email,p.intro a.post_anchor { + margin: 0; } p.intro a.post_no { - color: inherit; -} -p.intro a.post_no, -p.intro a.email, -p.intro a.post_anchor { - margin: 0; + color: inherit; } + p.intro a.email span.name { - color: #34345C; + color: #34345C; } + p.intro a.email:hover span.name { - color: #ff0000; + color: red; } + p.intro label { - display: inline; + display: inline; } -p.intro time, p.intro a.ip-link, p.intro a.capcode { - direction: ltr; - unicode-bidi: embed; + +p.intro time,p.intro a.ip-link,p.intro a.capcode { + direction: ltr; + unicode-bidi: embed; +} + +header { + margin: 1em 0; +} + +header div.subtitle,h1 { + color: #AF0A0F; + text-align: center; +} + +header div.subtitle { + font-size: 8pt; +} + +h1 { + font-family: tahoma; + letter-spacing: -2px; + font-size: 20pt; + margin: 0; } h2 { - color: #AF0A0F; - font-size: 11pt; - margin: 0; - padding: 0; -} -header { - margin: 1em 0; -} -h1 { - font-family: tahoma; - letter-spacing: -2px; - font-size: 20pt; - margin: 0; -} -header div.subtitle, h1 { - color: #AF0A0F; - text-align: center; -} -header div.subtitle { - font-size: 8pt; + color: #AF0A0F; + font-size: 11pt; + margin: 0; + padding: 0; } + form { - margin-bottom: 4em; + margin-bottom: 4em; } + form table { - margin: auto; + margin: auto; } + form table input { - height: auto; + height: auto; + width: 100%; } -input[type="text"], input[type="password"], textarea { - border: 1px solid #a9a9a9; - text-indent: 0; - text-shadow: none; - text-transform: none; - word-spacing: normal; + +input[type="text"],input[type="password"],textarea { + height: auto; + 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; -} -form table tr th { - background: #98E; + text-align: left; + padding: 4px; + 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; } + form table tr td div label { - font-size: 10px; + font-size: 10px; } -.unimportant, .unimportant * { - font-size: 10px; + +.unimportant,.unimportant * { + 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: 700; + text-align: center; + margin: 1em 0; +} + +div.banner,div.banner a { + color: #fff; +} + +div.banner a:hover { + color: #EEF2FF; + text-decoration: none; +} + +img.banner,img.board_image { + display: block; + border: 1px solid #a9a9a9; + margin: 12px auto 0; +} + +.post-image { + display: block; + float: left; + margin: 4px 16px 8px; + border: none; +} + +div.post .post-image { + padding: 1px; + margin: 4px 20px 4px 4px; +} + +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: .5em 0; + padding: 0 0 .2em; + clear: both; +} + +input.delete { + float: left; + margin: 1px 6px 0 0; +} + +p.intro span.subject { + color: #0F0C5D; + font-weight: 700; +} + +p.intro span.name { + color: #117743; + font-weight: 700; +} + +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 { + max-width: 85%; +} + +div.post.reply p { + margin: .3em 0 0; +} + +div.post.reply div.body { + margin-left: 1em; + margin-top: 1em; + padding-right: 2em; + padding-bottom: .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; + clear: both; +} + +div.post.reply { + background: #D6DAF0; + margin: .2em 16px; + padding: .2em .3em .5em .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: #fff; + 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: #000; + font-size: 12pt; +} + +div.ban p { + font-size: 12px; + margin-bottom: 12px; +} + +div.ban p.reason { + font-weight: 700; +} + +span.heading { + color: #AF0A0F; + font-size: 11pt; + font-weight: 700; +} + +span.spoiler { + background: #000; + color: #000; + padding: 0 1px; +} + +div.post.reply div.body span.spoiler a { + color: #000; +} + +span.spoiler:hover,div.post.reply div.body span.spoiler:hover a { + color: #fff; +} + +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; + +table.test td,table.test th { + 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: .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: #000; + 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; + background: #98E; } -table.modlog tr th { - background: #98E; -} -td.minimal, th.minimal { - width: 1%; - white-space: nowrap; + +td.minimal,th.minimal { + 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: 700; + 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: 700; + 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; left: 0; right: 0; - /*text-shadow: white 1px 0 6px, white 1px 0 6px, black 1px 0 3px;*/ 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); + +.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); } .desktop-style body { @@ -461,13 +558,15 @@ 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; + 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; @@ -481,60 +580,70 @@ 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); + 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; } -.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; - font-weight:normal; - margin-top: 2px; - margin-bottom: 2px; + +ul#Grid { 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); + margin: 2px 0 2px .5em; } + +.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; + position: relative; + overflow: hidden; + vertical-align: top; + text-align: center; + font-weight: 400; + margin: 2px 0; + padding: 2px; + font-size: 11px; + 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; } @@ -544,15 +653,18 @@ div.thread:hover { border-color: #B7C5D9; } +div.thread.grid-li { + padding: 0; +} + .theme-catalog div.grid-size-vsmall img { - max-height: 64px; - max-width: 100px; + max-height: 64px; + max-width: 96px; } .theme-catalog div.grid-size-vsmall { - width: 100px; - max-width: 100px; - max-height: 150px; + width:128px; + height: 160px; } .theme-catalog div.grid-size-small img { @@ -561,20 +673,18 @@ div.thread:hover { } .theme-catalog div.grid-size-small { - width: 200px; - max-width: 225px; - max-height: 300px; + width: 144px; + height:256px; } .theme-catalog div.grid-size-large img { - max-height: 148px; + max-height: 175px; max-width: 300px; } .theme-catalog div.grid-size-large { - width: 300px; - max-width: 300px; - max-height: 450px; + width: 225px; + height: 384px; } .theme-catalog img.thread-image { @@ -582,169 +692,231 @@ div.thread:hover { 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; - } -} - .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; + padding: 5px 6px 8px; } -/* styles also used by watch.js */ .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); + 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; + margin-left: 0; } .compact-boardlist #watch-pinned { display: inline-block; - vertical-align: middle; + vertical-align: middle; } -/* live-index.js */ .new-posts { - opacity: 0.6; + opacity: .6; margin-top: 1em; } + .new-threads { text-align: center; } -/* options.js */ -#options_handler { - position: fixed; - 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%; - z-index: -1; -} -#options_div { - background-color: #d6daf0; - border: 1px solid black; - display: inline-block; - position: relative; - margin-top: 20px; - width: 600px; - height: 300px; -} -#options_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; -} -.options_tab h2 { - text-align: center; - margin-bottom: 5px; -} - .mobile-style #options_div { display: block; width: 100%; height: 100%; - margin-top: 0px; -} -.mentioned { - word-wrap: break-word; + margin-top: 0; } +#options_handler { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + width: 100%; + height: 100%; + text-align: center; + z-index: 9900; +} + +#options_background { + background: #000; + opacity: .5; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + width: 100%; + height: 100%; + z-index: -1; +} + +#options_div { + background-color: #d6daf0; + border: 1px solid #000; + display: inline-block; + position: relative; + margin-top: 20px; + width: 600px; + height: 300px; +} + +#options_close { + top: 0; + right: 0; + position: absolute; + margin-right: 3px; + font-size: 20px; + z-index: 100; +} + +#options_tablist { + border-right: 1px solid #000; + padding: 0 5px; + top: 0; + bottom: 0; + left: 0; + height: 100%; + width: 70px; +} + +.options_tab { + position: absolute; + top: 0; + bottom: 0; + left: 81px; + right: 0; + padding: 10px; + text-align: left; + font-size: 12px; +} + +.options_tab h2 { + text-align: center; + margin-bottom: 5px; +} + +.options_tab_icon { + padding: 5px; + color: #000; + cursor: pointer; +} + +.options_tab_icon.active { + color: red; +} + +.options_tab_icon i { + font-size: 20px; +} + +.options_tab_icon div { + font-size: 11px; +} code > pre { -/* Better code tags */ - background:black; - max-width:inherit; + background: #000; + max-width: 80%; + padding: 0; + margin: 0; + overflow: auto; } code > pre > span.pln { - color:grey; + color: grey; } + +.mentioned { + word-wrap: break-word; +} + +@media screen and (min-width: 768px) { + p.intro { + clear: none; + } + + div.post div.body { + clear: none; + } + + .theme-catalog div.grid-size-vsmall img { + max-height: 96px; + max-width: 160px; + } + + .theme-catalog div.grid-size-vsmall { + width: 160px; + height: 256px; + } + + .theme-catalog div.grid-size-small img { + max-height: 160px; + max-width: 225px; + } + + .theme-catalog div.grid-size-small { + width: 225px; + height:320px; + } + + .theme-catalog div.grid-size-large img { + max-height: 200px; + max-width: 300px; + } + + .theme-catalog div.grid-size-large { + width: 300px; + height: 409px; + } + + .theme-catalog img.thread-image { + height: auto; + max-width: 100%; + } +} \ No newline at end of file From c115ebc7e0c7077e10756159d9c31a531d5ca583 Mon Sep 17 00:00:00 2001 From: kaernyk Date: Fri, 26 Sep 2014 22:54:01 -0400 Subject: [PATCH 04/20] Improved image handling in catalog for various screen sizes --- stylesheets/style.css | 47 ++++++------------------------------------- 1 file changed, 6 insertions(+), 41 deletions(-) diff --git a/stylesheets/style.css b/stylesheets/style.css index 129dcffb..0f6fca49 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -658,8 +658,8 @@ div.thread.grid-li { } .theme-catalog div.grid-size-vsmall img { - max-height: 64px; - max-width: 96px; + max-height: 50%; + max-width: 99%; } .theme-catalog div.grid-size-vsmall { @@ -668,8 +668,8 @@ div.thread.grid-li { } .theme-catalog div.grid-size-small img { - max-height: 128px; - max-width: 225px; + max-height: 50%; + max-width: 99%; } .theme-catalog div.grid-size-small { @@ -678,8 +678,8 @@ div.thread.grid-li { } .theme-catalog div.grid-size-large img { - max-height: 175px; - max-width: 300px; + max-height: 50%; + max-width: 99%; } .theme-catalog div.grid-size-large { @@ -884,39 +884,4 @@ code > pre > span.pln { div.post div.body { clear: none; } - - .theme-catalog div.grid-size-vsmall img { - max-height: 96px; - max-width: 160px; - } - - .theme-catalog div.grid-size-vsmall { - width: 160px; - height: 256px; - } - - .theme-catalog div.grid-size-small img { - max-height: 160px; - max-width: 225px; - } - - .theme-catalog div.grid-size-small { - width: 225px; - height:320px; - } - - .theme-catalog div.grid-size-large img { - max-height: 200px; - max-width: 300px; - } - - .theme-catalog div.grid-size-large { - width: 300px; - height: 409px; - } - - .theme-catalog img.thread-image { - height: auto; - max-width: 100%; - } } \ No newline at end of file From a3c03932c31b952a73ce614ab651cef7fd986451 Mon Sep 17 00:00:00 2001 From: kaernyk Date: Sat, 27 Sep 2014 01:38:25 -0400 Subject: [PATCH 05/20] Fix mobile scaling/padding --- stylesheets/style.css | 359 ++++++++++++++++++++++-------------------- 1 file changed, 192 insertions(+), 167 deletions(-) diff --git a/stylesheets/style.css b/stylesheets/style.css index 0f6fca49..a3eea7f9 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -1,25 +1,24 @@ body { - background: #EEF2FF url(img/fade-blue.png) repeat-x 50% 0; - color: #000; - font-family: arial,helvetica,sans-serif; - font-size: 10pt; - min-width: 200px; - max-width: 100%; - margin: 4px!important; - padding: 4px!important; + background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%; + color: black; + font-family: arial, helvetica, sans-serif; + font-size: 11pt; + margin: 0 4px; + padding-left: 4px; + padding-right: 4px; } table * { - margin: 0; + margin: 1px; } -a,a:visited { +a, a:visited { text-decoration: underline; color: #34345C; } -a:hover,p.intro a.post_no:hover { - color: red; +a:hover, p.intro a.post_no:hover { + color: #ff0000; } a.post_no { @@ -28,44 +27,44 @@ a.post_no { padding: 0; } -p.intro a.post_no,p.intro a.email,p.intro a.post_anchor { - margin: 0; -} - p.intro a.post_no { color: inherit; } +p.intro a.post_no, +p.intro a.email, +p.intro a.post_anchor { + margin: 0; +} + p.intro a.email span.name { color: #34345C; } p.intro a.email:hover span.name { - color: red; + color: #ff0000; } p.intro label { display: inline; } -p.intro time,p.intro a.ip-link,p.intro a.capcode { +p.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; +} + header { margin: 1em 0; } -header div.subtitle,h1 { - color: #AF0A0F; - text-align: center; -} - -header div.subtitle { - font-size: 8pt; -} - h1 { font-family: tahoma; letter-spacing: -2px; @@ -73,11 +72,13 @@ h1 { margin: 0; } -h2 { +header div.subtitle, h1 { color: #AF0A0F; - font-size: 11pt; - margin: 0; - padding: 0; + text-align: center; +} + +header div.subtitle { + font-size: 8pt; } form { @@ -90,12 +91,15 @@ form table { form table input { height: auto; - width: 100%; } -input[type="text"],input[type="password"],textarea { - height: auto; - width: 100%; +input[type="text"], input[type="password"], textarea { + border: 1px solid #a9a9a9; + text-indent: 0; + text-shadow: none; + text-transform: none; + word-spacing: normal; + max-width: 75%; } form table tr td { @@ -111,6 +115,9 @@ form table.mod tr td { form table tr th { text-align: left; padding: 4px; +} + +form table tr th { background: #98E; } @@ -122,14 +129,14 @@ form table tr td div.center { form table tr td div input { display: block; - margin: 2px auto 0; + margin: 2px auto 0 auto; } form table tr td div label { font-size: 10px; } -.unimportant,.unimportant * { +.unimportant, .unimportant * { font-size: 10px; } @@ -158,13 +165,13 @@ div.post p.fileinfo { div.banner { background-color: #E04000; font-size: 12pt; - font-weight: 700; + font-weight: bold; text-align: center; margin: 1em 0; } -div.banner,div.banner a { - color: #fff; +div.banner, div.banner a { + color: white; } div.banner a:hover { @@ -172,22 +179,22 @@ div.banner a:hover { text-decoration: none; } -img.banner,img.board_image { +img.banner, img.board_image { display: block; border: 1px solid #a9a9a9; - margin: 12px auto 0; + margin: 12px auto 0 auto; } .post-image { display: block; float: left; - margin: 4px 16px 8px; + margin: 5px 20px 10px 20px; border: none; } div.post .post-image { - padding: 1px; - margin: 4px 20px 4px 4px; + padding: 5px; + margin: 0 20px 0 0; } div.post img.icon { @@ -211,8 +218,9 @@ div.post.op hr { } p.intro { - margin: .5em 0; - padding: 0 0 .2em; + margin: 0.5em 0; + padding: 0; + padding-bottom: 0.2em; clear: both; } @@ -223,15 +231,15 @@ input.delete { p.intro span.subject { color: #0F0C5D; - font-weight: 700; + font-weight: bold; } p.intro span.name { color: #117743; - font-weight: 700; + font-weight: bold; } -p.intro span.capcode,p.intro a.capcode,p.intro a.nametag { +p.intro span.capcode, p.intro a.capcode, p.intro a.nametag { color: #F00000; margin-left: 0; } @@ -244,19 +252,15 @@ div.delete { float: right; } -div.post.reply { - max-width: 85%; -} - div.post.reply p { - margin: .3em 0 0; + margin: 0.3em 0 0 0; } div.post.reply div.body { - margin-left: 1em; - margin-top: 1em; - padding-right: 2em; - padding-bottom: .3em; + margin-left: 1.8em; + margin-top: 0.8em; + padding-right: 3em; + padding-bottom: 0.3em; } div.post.reply.highlighted { @@ -275,17 +279,17 @@ div.post { div.post div.body { word-wrap: break-word; white-space: pre-wrap; - clear: both; } div.post.reply { background: #D6DAF0; - margin: .2em 16px; - padding: .2em .3em .5em .6em; + 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 { @@ -328,19 +332,19 @@ div#wrap { } div.ban { - background: #fff; + background: white; border: 1px solid #98E; max-width: 700px; margin: 30px auto; } -div.ban p,div.ban h2 { +div.ban p, div.ban h2 { padding: 3px 7px; } div.ban h2 { background: #98E; - color: #000; + color: black; font-size: 12pt; } @@ -350,27 +354,27 @@ div.ban p { } div.ban p.reason { - font-weight: 700; + font-weight: bold; } span.heading { color: #AF0A0F; font-size: 11pt; - font-weight: 700; + font-weight: bold; } span.spoiler { - background: #000; - color: #000; + background: black; + color: black; padding: 0 1px; } div.post.reply div.body span.spoiler a { - color: #000; + color: black; } -span.spoiler:hover,div.post.reply div.body span.spoiler:hover a { - color: #fff; +span.spoiler:hover, div.post.reply div.body span.spoiler:hover a { + color: white; } div.styles { @@ -390,7 +394,7 @@ table.test { width: 100%; } -table.test td,table.test th { +table.test td, table.test th { text-align: left; padding: 5px; } @@ -423,17 +427,17 @@ div.pages.top { position: fixed; top: 0; right: 0; - opacity: .9; + opacity: 0.9; } @media screen and (max-width: 800px) { div.pages.top { - display: none!important; + display: none !important; } } div.pages a.selected { - color: #000; + color: black; font-weight: bolder; } @@ -492,10 +496,13 @@ 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 { +td.minimal, th.minimal { width: 1%; white-space: nowrap; } @@ -508,7 +515,7 @@ div.top_notice { span.public_ban { display: block; color: red; - font-weight: 700; + font-weight: bold; margin-top: 15px; } @@ -519,7 +526,7 @@ span.toolong { div.blotter { color: red; - font-weight: 700; + font-weight: bold; text-align: center; } @@ -543,12 +550,13 @@ table.mod.config-editor input[type="text"] { top: 0; left: 0; right: 0; + /*text-shadow: white 1px 0 6px, white 1px 0 6px, black 1px 0 3px;*/ 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); +.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); } .desktop-style body { @@ -563,10 +571,10 @@ table.mod.config-editor input[type="text"] { display: inline-block; text-indent: -9000px; width: 7px; - background: url(img/arrow.png) right center no-repeat; + 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; @@ -595,7 +603,7 @@ table.mod.config-editor input[type="text"] { } #attention_bar:hover { - background-color: rgba(100%,100%,100%,0.2); + background-color: rgba(100%, 100%, 100%, 0.2); } p.intro.thread-hidden { @@ -611,32 +619,31 @@ form.ban-appeal textarea { display: block; } -ul#Grid { - padding: 2px; - margin: 2px 0 2px .5em; -} - .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); + 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; - position: relative; - overflow: hidden; vertical-align: top; text-align: center; - font-weight: 400; - margin: 2px 0; + font-weight: normal; + margin-top: 2px; + margin-bottom: 2px; padding: 2px; + height: 300px; + width: 205px; + overflow: hidden; + position: relative; font-size: 11px; - background: rgba(182,182,182,0.12); - border: 2px solid rgba(111,111,111,0.34); + max-height: 300px; + background: rgba(182, 182, 182, 0.12); + border: 2px solid rgba(111, 111, 111, 0.34); } .theme-catalog div.thread strong { @@ -653,38 +660,37 @@ div.thread:hover { border-color: #B7C5D9; } -div.thread.grid-li { - padding: 0; -} - .theme-catalog div.grid-size-vsmall img { - max-height: 50%; - max-width: 99%; + max-height: 64px; + max-width: 100px; } .theme-catalog div.grid-size-vsmall { - width:128px; - height: 160px; + width: 100px; + max-width: 100px; + max-height: 150px; } .theme-catalog div.grid-size-small img { - max-height: 50%; - max-width: 99%; + max-height: 128px; + max-width: 225px; } .theme-catalog div.grid-size-small { - width: 144px; - height:256px; + width: 200px; + max-width: 225px; + max-height: 300px; } .theme-catalog div.grid-size-large img { - max-height: 50%; - max-width: 99%; + max-height: 148px; + max-width: 300px; } .theme-catalog div.grid-size-large { - width: 225px; - height: 384px; + width: 300px; + max-width: 300px; + max-height: 450px; } .theme-catalog img.thread-image { @@ -692,6 +698,22 @@ div.thread.grid-li { 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; + } +} + .compact-boardlist { padding: 3px; padding-bottom: 0; @@ -713,9 +735,10 @@ div.thread.grid-li { } .compact-boardlist .cb-cat { - padding: 5px 6px 8px; + padding: 5px 6px 8px 6px; } +/* styles also used by watch.js */ .cb-menuitem { display: table-row; } @@ -724,7 +747,7 @@ div.thread.grid-li { padding: 5px; display: table-cell; text-align: left; - border-top: 1px solid rgba(0,0,0,0.5); + border-top: 1px solid rgba(0, 0, 0, 0.5); } .cb-menuitem span.cb-uri { @@ -748,7 +771,7 @@ div.thread.grid-li { } .boardlist:not(.compact-boardlist) #watch-pinned a:first-child { - margin-left: 0; + margin-left: 0pt; } .compact-boardlist #watch-pinned { @@ -756,8 +779,9 @@ div.thread.grid-li { vertical-align: middle; } +/* live-index.js */ .new-posts { - opacity: .6; + opacity: 0.6; margin-top: 1em; } @@ -765,19 +789,13 @@ div.thread.grid-li { text-align: center; } -.mobile-style #options_div { - display: block; - width: 100%; - height: 100%; - margin-top: 0; -} - +/* options.js */ #options_handler { position: fixed; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; width: 100%; height: 100%; text-align: center; @@ -785,13 +803,13 @@ div.thread.grid-li { } #options_background { - background: #000; - opacity: .5; + background: black; + opacity: 0.5; position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0px; + left: 0px; + right: 0px; + bottom: 0px; width: 100%; height: 100%; z-index: -1; @@ -799,7 +817,7 @@ div.thread.grid-li { #options_div { background-color: #d6daf0; - border: 1px solid #000; + border: 1px solid black; display: inline-block; position: relative; margin-top: 20px; @@ -808,8 +826,8 @@ div.thread.grid-li { } #options_close { - top: 0; - right: 0; + top: 0px; + right: 0px; position: absolute; margin-right: 3px; font-size: 20px; @@ -817,34 +835,18 @@ div.thread.grid-li { } #options_tablist { - border-right: 1px solid #000; - padding: 0 5px; - top: 0; - bottom: 0; - left: 0; - height: 100%; + padding: 0px 5px; + left: 0px; width: 70px; -} - -.options_tab { - position: absolute; - top: 0; - bottom: 0; - left: 81px; - right: 0; - padding: 10px; - text-align: left; - font-size: 12px; -} - -.options_tab h2 { - text-align: center; - margin-bottom: 5px; + top: 0px; + bottom: 0px; + height: 100%; + border-right: 1px solid black; } .options_tab_icon { padding: 5px; - color: #000; + color: black; cursor: pointer; } @@ -860,21 +862,44 @@ div.thread.grid-li { font-size: 11px; } -code > pre { - background: #000; - max-width: 80%; +.options_tab { + padding: 10px; + position: absolute; + top: 0px; + bottom: 0px; + left: 81px; + right: 0px; + text-align: left; + font-size: 12px; +} + +.options_tab h2 { + text-align: center; + margin-bottom: 5px; +} + +.mobile-style #options_div { + display: block; + width: 100%; + height: 100%; + margin-top: 0px; +} + +.mentioned { + word-wrap: break-word; +} + +pre { + width: 99%; padding: 0; margin: 0; - overflow: auto; + overflow:auto; } code > pre > span.pln { color: grey; } -.mentioned { - word-wrap: break-word; -} @media screen and (min-width: 768px) { p.intro { From d9f20c290db89b17640228df6c405925e9ead587 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Fri, 26 Sep 2014 16:55:16 -0700 Subject: [PATCH 06/20] Updated threadscroll.js with bettter compatibility --- js/threadscroll.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/threadscroll.js b/js/threadscroll.js index c3c6deef..0a233f58 100644 --- a/js/threadscroll.js +++ b/js/threadscroll.js @@ -16,7 +16,7 @@ if(active_page == "index" || active_page == "ukko"){ if(par.length == 1){ if(par.prev().attr("id") != null){ if(par.prev().attr("id").match("^thread")){ - window.location.href = window.location.protocol+"//"+window.location.host+window.location.pathname+"#"+par.prev().attr("id"); + par.prev()[0].scrollIntoView(true); } } } @@ -28,7 +28,7 @@ if(active_page == "index" || active_page == "ukko"){ if(par.length == 1){ if(par.next().attr("id") != null){ if(par.next().attr("id").match("^thread")){ - window.location.href = window.location.protocol+"//"+window.location.host+window.location.pathname+"#"+par.next().attr("id"); + par.next()[0].scrollIntoView(true); } } } From 56f3d89774654f2cfa747e9fd9881fb9efb92223 Mon Sep 17 00:00:00 2001 From: 8chan Date: Sat, 27 Sep 2014 00:44:41 +0000 Subject: [PATCH 07/20] Fix multi image from quick reply Conflicts: js/multi-image.js --- js/multi-image.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/multi-image.js b/js/multi-image.js index 32d1f256..77c3f766 100644 --- a/js/multi-image.js +++ b/js/multi-image.js @@ -18,7 +18,10 @@ function multi_image() { var images_len = $('form:not([id="quick-reply"]) [type=file]').length; if (!(images_len >= max_images)) { - $('.add_image').after('
'); + var new_file = '
'; + + $('[type=file]:last').after(new_file); + $('form:not([id="quick-reply"]) [type=file]:last').after(new_file); if (typeof setup_form !== 'undefined') setup_form($('form[name="post"]')); } }) From 6fd3b64c679d0640796b3fb3d5972fc465bfa954 Mon Sep 17 00:00:00 2001 From: 8chan Date: Sat, 27 Sep 2014 00:44:55 +0000 Subject: [PATCH 08/20] Disallow multiple Shrink all images appearing fixes vichan-devel#91 --- js/expand-all-images.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/js/expand-all-images.js b/js/expand-all-images.js index fc273e5e..5545045c 100644 --- a/js/expand-all-images.js +++ b/js/expand-all-images.js @@ -27,7 +27,10 @@ onready(function(){ $(this).parent().click(); }); - $('hr:first').before('
'); + if (!$('#shrink-all-images').length) { + $('hr:first').before('
'); + } + $('div#shrink-all-images a') .text(_('Shrink all images')) .click(function(){ From dda746201396977321b5c639a2fc8cf0575588a0 Mon Sep 17 00:00:00 2001 From: czaks Date: Sat, 27 Sep 2014 11:13:04 +0200 Subject: [PATCH 09/20] catalog link not always working; fix ctrlcctrlv#88 --- js/catalog-link.js | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) 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); From 6c139caf3cd2ba34e03844a88f27038320c77dc9 Mon Sep 17 00:00:00 2001 From: czaks Date: Sat, 27 Sep 2014 11:16:16 +0200 Subject: [PATCH 10/20] style.css: setting default font size is imo a bit invasive --- stylesheets/style.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/stylesheets/style.css b/stylesheets/style.css index a3eea7f9..5c24679c 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -2,7 +2,7 @@ body { background: #EEF2FF url('img/fade-blue.png') repeat-x 50% 0%; color: black; font-family: arial, helvetica, sans-serif; - font-size: 11pt; + font-size: 10pt; margin: 0 4px; padding-left: 4px; padding-right: 4px; @@ -909,4 +909,4 @@ code > pre > span.pln { div.post div.body { clear: none; } -} \ No newline at end of file +} From f2e101f30d2abf17c481fb59ff1a9394cc9e43d5 Mon Sep 17 00:00:00 2001 From: czaks Date: Sat, 27 Sep 2014 11:22:28 +0200 Subject: [PATCH 11/20] fix multi-image.js when quick-reply isn`t loaded --- js/multi-image.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) 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"]')); } }) From 629b1c92a6cb6971da36bcc84e38d9e6600e7124 Mon Sep 17 00:00:00 2001 From: czaks Date: Sat, 27 Sep 2014 11:26:30 +0200 Subject: [PATCH 12/20] fix a recently introduced quick-reply max-width issue --- stylesheets/style.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/stylesheets/style.css b/stylesheets/style.css index 5c24679c..5be0ce0f 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -102,6 +102,10 @@ input[type="text"], input[type="password"], textarea { 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; From ef53af04ec42359d66489b10dee0f4f1778c3b0a Mon Sep 17 00:00:00 2001 From: czaks Date: Sat, 27 Sep 2014 11:31:30 +0200 Subject: [PATCH 13/20] fix a recently added md5 api field --- inc/api.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/inc/api.php b/inc/api.php index 3769a9c9..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; From 677a9a84289f0bd1612bcf9c3551f49124712719 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Sat, 27 Sep 2014 09:47:11 -0700 Subject: [PATCH 14/20] Create id_highlighter --- js/id_highlighter | 40 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) create mode 100644 js/id_highlighter diff --git a/js/id_highlighter b/js/id_highlighter new file mode 100644 index 00000000..60052031 --- /dev/null +++ b/js/id_highlighter @@ -0,0 +1,40 @@ +Array.prototype.remove = function(v) { this.splice(this.indexOf(v) == -1 ? this.length : this.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){ + idshighlighted.remove(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"); + }); + } +}); From 4c720120e401f885b07e9fb9952ec0bffa8957a6 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Sat, 27 Sep 2014 09:49:17 -0700 Subject: [PATCH 15/20] Added id_highlighter.js to additional_javscript --- inc/instance-config.php | 1 + 1 file changed, 1 insertion(+) diff --git a/inc/instance-config.php b/inc/instance-config.php index 7ab9dfdc..75145129 100644 --- a/inc/instance-config.php +++ b/inc/instance-config.php @@ -121,6 +121,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'; From e7c1f7d22f351e903fa79893dd5a2cfc920b1146 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Sat, 27 Sep 2014 11:55:39 -0700 Subject: [PATCH 16/20] Forgot .js extension --- js/{id_highlighter => id_highlighter.js} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename js/{id_highlighter => id_highlighter.js} (100%) diff --git a/js/id_highlighter b/js/id_highlighter.js similarity index 100% rename from js/id_highlighter rename to js/id_highlighter.js From 4086749dfe62ad0a1f304ffd04b3f9c8c99bfbb9 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Sat, 27 Sep 2014 11:56:05 -0700 Subject: [PATCH 17/20] Added id_colors.js --- js/id_colors.js | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 js/id_colors.js diff --git a/js/id_colors.js b/js/id_colors.js new file mode 100644 index 00000000..6923dbec --- /dev/null +++ b/js/id_colors.js @@ -0,0 +1,34 @@ +$.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" + }); +}); + From 180a99ee65cdfe26bfbdf40eca9be645024e3155 Mon Sep 17 00:00:00 2001 From: anonfagola Date: Sat, 27 Sep 2014 12:08:59 -0700 Subject: [PATCH 18/20] Added pointer cursor to ids, to show clickability --- stylesheets/style.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/stylesheets/style.css b/stylesheets/style.css index dbc367cf..f7a70780 100644 --- a/stylesheets/style.css +++ b/stylesheets/style.css @@ -905,6 +905,10 @@ div.thread:hover { word-wrap: break-word; } +.poster_id{ + cursor: pointer; +} + code > pre { /* Better code tags */ background:black; From 98209fc80637ba4dce95fcf431ca740f102c8278 Mon Sep 17 00:00:00 2001 From: 8chan Date: Sat, 27 Sep 2014 20:04:27 +0000 Subject: [PATCH 19/20] Remove prototype pollution, call on ready --- js/id_highlighter.js | 76 +++++++++++++++++++++++--------------------- 1 file changed, 40 insertions(+), 36 deletions(-) diff --git a/js/id_highlighter.js b/js/id_highlighter.js index 60052031..82e2c79d 100644 --- a/js/id_highlighter.js +++ b/js/id_highlighter.js @@ -1,40 +1,44 @@ -Array.prototype.remove = function(v) { this.splice(this.indexOf(v) == -1 ? this.length : this.indexOf(v), 1); } +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 = []; + var idshighlighted = []; -function getPostsById(id){ - return $(".poster_id").filter(function(i){ - return $(this).text() == id; + 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"); + }); + } + }); }); } - -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){ - idshighlighted.remove(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"); - }); - } -}); From 4208c16f611d0e18d973704917d2feac5ad36115 Mon Sep 17 00:00:00 2001 From: 8chan Date: Sat, 27 Sep 2014 20:04:57 +0000 Subject: [PATCH 20/20] Call on ready, dont pollute window namespace with vars --- js/id_colors.js | 65 ++++++++++++++++++++++++++----------------------- 1 file changed, 34 insertions(+), 31 deletions(-) diff --git a/js/id_colors.js b/js/id_colors.js index 6923dbec..7d531fde 100644 --- a/js/id_colors.js +++ b/js/id_colors.js @@ -1,34 +1,37 @@ -$.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; -}; +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; -} + 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" + $(".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" + }); + }); }); -}); - +}