Get the Appchan kinda-sorta-maybe working.
This commit is contained in:
Zixaphir
parent
d09ab8a19f
commit
421cd15ece
3454
appchan-x.user.js
3454
appchan-x.user.js
File diff suppressed because one or more lines are too long
@ -1,52 +0,0 @@
|
||||
/* General */
|
||||
:root.burichan .dialog {
|
||||
background-color: #D6DAF0;
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
:root.burichan .field:focus {
|
||||
border-color: #98E;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.burichan #header-bar {
|
||||
font-size: 11pt;
|
||||
color: #89A;
|
||||
}
|
||||
:root.burichan #header-bar a {
|
||||
color: #34345C;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.burichan #fourchanx-settings fieldset {
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.burichan .backlink.deadlink {
|
||||
color: #34345C !important;
|
||||
}
|
||||
:root.burichan .inline {
|
||||
border-color: #B7C5D9;
|
||||
background-color: rgba(255, 255, 255, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.burichan #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #D6DAF0;
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
:root.burichan .qr-preview {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.burichan #menu {
|
||||
color: #000000;
|
||||
}
|
||||
:root.burichan .entry {
|
||||
border-bottom: 1px solid #B7C5D9;
|
||||
font-size: 12pt;
|
||||
}
|
||||
:root.burichan .focused.entry {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
@ -1,52 +0,0 @@
|
||||
/* General */
|
||||
:root.futaba .dialog {
|
||||
background-color: #F0E0D6;
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
:root.futaba .field:focus {
|
||||
border-color: #EA8;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.futaba #header-bar {
|
||||
font-size: 11pt;
|
||||
color: #B86;
|
||||
}
|
||||
:root.futaba #header-bar a {
|
||||
color: #800000;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.futaba #fourchanx-settings fieldset {
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.futaba .backlink.deadlink {
|
||||
color: #00E !important;
|
||||
}
|
||||
:root.futaba .inline {
|
||||
border-color: #D9BFB7;
|
||||
background-color: rgba(255, 255, 255, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.futaba #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #F0E0D6;
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
:root.futaba .qr-preview {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.futaba #menu {
|
||||
color: #800000;
|
||||
}
|
||||
:root.futaba .entry {
|
||||
border-bottom: 1px solid #D9BFB7;
|
||||
font-size: 12pt;
|
||||
}
|
||||
:root.futaba .focused.entry {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
95
css/icons.base.css
Normal file
95
css/icons.base.css
Normal file
@ -0,0 +1,95 @@
|
||||
|
||||
#navtopright .exlinksOptionsLink::after,
|
||||
#appchanOptions,
|
||||
body > div.navLinks > a:first-of-type::after,
|
||||
#{if Conf['Slideout Watcher'] then '#watcher::after,' else ''}
|
||||
#{if Conf['Announcements'] is 'slideout' then '#globalMessage::after,' else ''}
|
||||
#boardNavDesktopFoot::after,
|
||||
body > a[style="cursor: pointer; float: right;"]::after,
|
||||
#imgControls label:first-of-type::after,
|
||||
#catalog::after,
|
||||
#fappeTyme {
|
||||
z-index: 18;
|
||||
position: fixed;
|
||||
display: block;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
content: "";
|
||||
overflow: hidden;
|
||||
opacity: #{if Conf['Invisible Icons'] then 0 else 0.5};
|
||||
}
|
||||
#navtopright .exlinksOptionsLink,
|
||||
body > div.navLinks > a:first-of-type,
|
||||
#{if Conf['Slideout Watcher'] then '#watcher,' else ''}
|
||||
#{if Conf['Announcements'] is 'slideout' then '#globalMessage,' else ''}
|
||||
#boardNavDesktopFoot,
|
||||
body > a[style="cursor: pointer; float: right;"],
|
||||
#catalog {
|
||||
z-index: 16;
|
||||
}
|
||||
#navtopright .exlinksOptionsLink:hover,
|
||||
body > div.navLinks > a:first-of-type:hover,
|
||||
#{if Conf['Slideout Watcher'] then '#watcher:hover,' else ''}
|
||||
#{if Conf['Announcements'] is 'slideout' then '#globalMessage:hover,' else ''}
|
||||
#boardNavDesktopFoot:hover,
|
||||
body > a[style="cursor: pointer; float: right;"]:hover,
|
||||
#catalog:hover {
|
||||
z-index: 17;
|
||||
}
|
||||
#imgControls {
|
||||
z-index: 19;
|
||||
}
|
||||
#imgControls {
|
||||
position: fixed;
|
||||
}
|
||||
#appchanOptions {
|
||||
visibility: visible;
|
||||
background-position: 0 0;
|
||||
}
|
||||
body > div.navLinks > a:first-of-type::after {
|
||||
cursor: pointer;
|
||||
background-position: 0 -15px;
|
||||
}
|
||||
#watcher::after {
|
||||
background-position: 0 -30px;
|
||||
}
|
||||
#globalMessage::after {
|
||||
background-position: 0 -45px;
|
||||
}
|
||||
#boardNavDesktopFoot::after {
|
||||
background-position: 0 -60px;
|
||||
}
|
||||
body > a[style="cursor: pointer; float: right;"]::after {
|
||||
visibility: visible;
|
||||
cursor: pointer;
|
||||
background-position: 0 -75px;
|
||||
}
|
||||
#imgControls label:first-of-type::after {
|
||||
position: static;
|
||||
background-position: 0 -90px;
|
||||
}
|
||||
#navtopright .exlinksOptionsLink::after {
|
||||
background-position: 0 -105px;
|
||||
}
|
||||
#catalog::after {
|
||||
visibility: visible;
|
||||
background-position: 0 -120px;
|
||||
}
|
||||
#fappeTyme {
|
||||
background-position: 0 -135px;
|
||||
}
|
||||
#boardNavDesktopFoot:hover::after,
|
||||
#globalMessage:hover::after,
|
||||
#imgControls label:hover:first-of-type::after,
|
||||
#navlinks a:hover,
|
||||
#appchanOptions:hover,
|
||||
#navtopright .exlinksOptionsLink:hover::after,
|
||||
#qr #qrtab,
|
||||
#watcher:hover::after,
|
||||
.thumbnail#selected,
|
||||
body > a[style="cursor: pointer; float: right;"]:hover::after,
|
||||
div.navLinks > a:first-of-type:hover::after,
|
||||
#catalog:hover::after,
|
||||
#fappeTyme:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
81
css/icons.horz.css
Normal file
81
css/icons.horz.css
Normal file
@ -0,0 +1,81 @@
|
||||
|
||||
/* 4chan X Options */
|
||||
#appchanOptions {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Slideout Navigation */
|
||||
#boardNavDesktopFoot::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Global Message */
|
||||
#globalMessage::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Watcher */
|
||||
#watcher::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* ExLinks */
|
||||
#navtopright .exlinksOptionsLink::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* 4sight */
|
||||
body > a[style="cursor: pointer; float: right;"]::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Expand Images */
|
||||
#imgControls {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* 4chan Catalog */
|
||||
#catalog::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Back */
|
||||
div.navLinks > a:first-of-type::after {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Fappe Tyme */
|
||||
#fappeTyme {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
/* Thread Navigation Links */
|
||||
#navlinks a {
|
||||
margin: 2px;
|
||||
top: 2px;
|
||||
}
|
||||
#navlinks a:last-of-type {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
#navlinks a:first-of-type {
|
||||
#{align}: #{position[i++]}px;
|
||||
}
|
||||
#prefetch {
|
||||
width: #{248 + Style.sidebarOffset.W}px;
|
||||
#{align}: 2px;
|
||||
top: 1.6em;
|
||||
text-align: #{Style.sidebarLocation[1]};
|
||||
}
|
||||
#boardNavDesktopFoot::after,
|
||||
#navtopright .exlinksOptionsLink::after,
|
||||
#appchanOptions,
|
||||
#watcher::after,
|
||||
#globalMessage::after,
|
||||
#imgControls,
|
||||
#fappeTyme,
|
||||
div.navLinks > a:first-of-type::after,
|
||||
#catalog::after,
|
||||
body > a[style="cursor: pointer; float: right;"]::after {
|
||||
top: 2px !important;
|
||||
}
|
||||
#{if _conf["Announcements"] is "slideout" then "#globalMessage," else ""}
|
||||
#{if _conf["Slideout Watcher"] then "#watcher," else ""}
|
||||
#boardNavDesktopFoot {
|
||||
top: 17px !important;
|
||||
}
|
||||
#{if _conf['Boards Navigation'] is 'top' or _conf['Boards Navigation'] is 'sticky top' then '#boardNavDesktop' else if _conf['Pagination'] is 'top' or _conf['Pagination'] is 'sticky top' then '.pagelist'} {
|
||||
#{if _conf['4chan SS Navigation']
|
||||
"padding-#{align}: #{iconOffset}px;"
|
||||
else
|
||||
"margin-#{align}: #{iconOffset}px;"}
|
||||
}\n
|
||||
9
css/icons.horz.tu.css
Normal file
9
css/icons.horz.tu.css
Normal file
@ -0,0 +1,9 @@
|
||||
/* Updater + Stats */
|
||||
#updater,
|
||||
#stats {
|
||||
#{align}: 2px !important;
|
||||
#{Style.sidebarLocation[1]}: auto !important;
|
||||
top: auto !important;
|
||||
bottom: auto !important;
|
||||
#{if _conf["Updater Position"] is 'top' then "top: 1.6em !important" else "bottom: 0 !important"};
|
||||
}
|
||||
81
css/icons.vert.css
Normal file
81
css/icons.vert.css
Normal file
@ -0,0 +1,81 @@
|
||||
|
||||
/* Image Expansion */
|
||||
#imgControls {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* 4chan X Options */
|
||||
#appchanOptions {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Slideout Navigation */
|
||||
#boardNavDesktopFoot,
|
||||
#boardNavDesktopFoot::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Global Message */
|
||||
#globalMessage,
|
||||
#globalMessage::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Watcher */
|
||||
#{if _conf["Slideout Watcher"] then "#watcher, #watcher::after" else ""} {
|
||||
top: #{position[i++]}px !important;
|
||||
}
|
||||
/* 4sight */
|
||||
body > a[style="cursor: pointer; float: right;"]::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* ExLinks */
|
||||
#navtopright .exlinksOptionsLink::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* 4chan Catalog */
|
||||
#catalog::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Back */
|
||||
div.navLinks > a:first-of-type::after {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Fappe Tyme */
|
||||
#fappeTyme {
|
||||
top: #{position[i++]}px;
|
||||
}
|
||||
/* Thread Navigation Links */
|
||||
#navlinks a:first-of-type {
|
||||
top: #{position[i++]}px !important;
|
||||
}
|
||||
#navlinks a:last-of-type {
|
||||
top: #{position[i++]}px !important;
|
||||
}
|
||||
#prefetch {
|
||||
width: #{248 + Style.sidebarOffset.W}px;
|
||||
#{align}: 2px;
|
||||
top: 0;
|
||||
text-align: #{Style.sidebarLocation[1]};
|
||||
}
|
||||
#navlinks a,
|
||||
#navtopright .exlinksOptionsLink::after,
|
||||
#appchanOptions,
|
||||
#boardNavDesktopFoot::after,
|
||||
#globalMessage::after,
|
||||
#imgControls,
|
||||
#fappeTyme,
|
||||
#{if _conf["Slideout Watcher"] then "#watcher::after," else ""}
|
||||
body > a[style="cursor: pointer; float: right;"]::after,
|
||||
#catalog::after,
|
||||
div.navLinks > a:first-of-type::after {
|
||||
#{align}: 3px !important;
|
||||
}
|
||||
#boardNavDesktopFoot,
|
||||
#globalMessage,
|
||||
#watcher {
|
||||
width: #{233 + Style.sidebarOffset.W}px !important;
|
||||
#{align}: 18px !important;
|
||||
}
|
||||
#{if _conf['Boards Navigation'] is 'top' or _conf['Boards Navigation'] is 'sticky top' then '#boardNavDesktop' else if _conf['Pagination'] is 'top' or _conf['Pagination'] is 'sticky top' then '.pagelist'} {
|
||||
#{if _conf['4chan SS Navigation']
|
||||
"padding-#{align}: #{iconOffset}px;"
|
||||
else
|
||||
"margin-#{align}: #{iconOffset}px;"}
|
||||
}
|
||||
8
css/icons.vert.tu.css
Normal file
8
css/icons.vert.tu.css
Normal file
@ -0,0 +1,8 @@
|
||||
/* Updater + Stats */
|
||||
#updater,
|
||||
#stats {
|
||||
#{align}: #{if _conf["Updater Position"] is "top" then "24" else "2"}px !important;
|
||||
#{Style.sidebarLocation[1]}: auto !important;
|
||||
top: #{if _conf["Updater Position"] == "top" then "-1px" else "auto"} !important;
|
||||
bottom: #{if _conf["Updater Position"] == "bottom" then "-2px" else "auto"} !important;
|
||||
}
|
||||
77
css/jscolor.css
Normal file
77
css/jscolor.css
Normal file
@ -0,0 +1,77 @@
|
||||
.jscBox {
|
||||
width: 251px;
|
||||
height: 155px;
|
||||
}
|
||||
.jscBoxB,
|
||||
.jscPadB,
|
||||
.jscPadM,
|
||||
.jscSldB,
|
||||
.jscSldM,
|
||||
.jscBtn {
|
||||
position: absolute;
|
||||
clear: both;
|
||||
}
|
||||
.jscBoxB {
|
||||
left: 320px;
|
||||
bottom: 20px;
|
||||
z-index: 30;
|
||||
border: 1px solid;
|
||||
border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
|
||||
background: ThreeDFace;
|
||||
}
|
||||
.jscPad {
|
||||
width: 181px;
|
||||
height: 101px;
|
||||
background-image: #{agent}linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1)), #{agent}linear-gradient(left, #f00, #ff0, #0f0, #0ff, #00f, #f0f, #f00);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
}
|
||||
.jscPadB {
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
border: 1px solid;
|
||||
border-color: ThreeDShadow ThreeDHighlight ThreeDHighlight ThreeDShadow;
|
||||
}
|
||||
.jscPadM {
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 200px;
|
||||
height: 121px;
|
||||
cursor: crosshair;
|
||||
background-image: url('data:image/gif;base64,R0lGODlhDwAPAKEBAAAAAP///////////yH5BAEKAAIALAAAAAAPAA8AAAIklB8Qx53b4otSUWcvyiz4/4AeQJbmKY4p1HHapBlwPL/uVRsFADs=');
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.jscSld {
|
||||
width: 16px;
|
||||
height: 101px;
|
||||
background-image: #{agent}linear-gradient(rgba(0,0,0,0), rgba(0,0,0,1));
|
||||
}
|
||||
.jscSldB {
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
border: 1px solid;
|
||||
border-color: ThreeDShadow ThreeDHighlight ThreeDHighlight ThreeDShadow;
|
||||
}
|
||||
.jscSldM {
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 36px;
|
||||
height: 121px;
|
||||
cursor: pointer;
|
||||
background-image: url('data:image/gif;base64,R0lGODlhBwALAKECAAAAAP///6g8eKg8eCH5BAEKAAIALAAAAAAHAAsAAAITTIQYcLnsgGxvijrxqdQq6DRJAQA7');
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.jscBtn {
|
||||
right: 10px;
|
||||
bottom: 10px;
|
||||
padding: 0 15px;
|
||||
height: 18px;
|
||||
border: 1px solid;
|
||||
border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
|
||||
color: ButtonText;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.jscBtnS {
|
||||
line-height: 10px;
|
||||
}
|
||||
1790
css/layout.css
Normal file
1790
css/layout.css
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,52 +0,0 @@
|
||||
/* General */
|
||||
:root.photon .dialog {
|
||||
background-color: #DDD;
|
||||
border-color: #CCC;
|
||||
}
|
||||
:root.photon .field:focus {
|
||||
border-color: #EA8;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.photon #header-bar {
|
||||
font-size: 9pt;
|
||||
color: #333;
|
||||
}
|
||||
:root.photon #header-bar a {
|
||||
color: #FF6600;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.photon #fourchanx-settings fieldset {
|
||||
border-color: #CCC;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.photon .backlink.deadlink {
|
||||
color: #F60 !important;
|
||||
}
|
||||
:root.photon .inline {
|
||||
border-color: #CCC;
|
||||
background-color: rgba(255, 255, 255, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.photon #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #DDD;
|
||||
border-color: #CCC;
|
||||
}
|
||||
:root.photon .qr-preview {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.photon #menu {
|
||||
color: #333;
|
||||
}
|
||||
:root.photon .entry {
|
||||
border-bottom: 1px solid #CCC;
|
||||
font-size: 10pt;
|
||||
}
|
||||
:root.photon .focused.entry {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
57
css/prettyprint.css
Normal file
57
css/prettyprint.css
Normal file
@ -0,0 +1,57 @@
|
||||
(if Style.lightTheme then """
|
||||
.prettyprint {
|
||||
background-color: #e7e7e7;
|
||||
border: 1px solid #dcdcdc;
|
||||
}
|
||||
.com {
|
||||
color: #dd0000;
|
||||
}
|
||||
.str,
|
||||
.atv {
|
||||
color: #7fa61b;
|
||||
}
|
||||
.pun {
|
||||
color: #61663a;
|
||||
}
|
||||
.tag {
|
||||
color: #117743;
|
||||
}
|
||||
.kwd {
|
||||
color: #5a6F9e;
|
||||
}
|
||||
.typ,
|
||||
.atn {
|
||||
color: #9474bd;
|
||||
}
|
||||
.lit {
|
||||
color: #368c72;
|
||||
}\n
|
||||
""" else """
|
||||
.prettyprint {
|
||||
background-color: rgba(0,0,0,.1);
|
||||
border: 1px solid rgba(0,0,0,0.5);
|
||||
}
|
||||
.tag {
|
||||
color: #96562c;
|
||||
}
|
||||
.pun {
|
||||
color: #5b6f2a;
|
||||
}
|
||||
.com {
|
||||
color: #a34443;
|
||||
}
|
||||
.str,
|
||||
.atv {
|
||||
color: #8ba446;
|
||||
}
|
||||
.kwd {
|
||||
color: #987d3e;
|
||||
}
|
||||
.typ,
|
||||
.atn {
|
||||
color: #897399;
|
||||
}
|
||||
.lit {
|
||||
color: #558773;
|
||||
}\n
|
||||
"""
|
||||
802
css/style.css
802
css/style.css
@ -1,802 +0,0 @@
|
||||
/* General */
|
||||
.dialog {
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
|
||||
border: 1px solid;
|
||||
display: block;
|
||||
padding: 0;
|
||||
}
|
||||
.field {
|
||||
border: 1px solid #CCC;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
color: #333;
|
||||
font: 13px sans-serif;
|
||||
margin: 0;
|
||||
padding: 2px 4px 3px;
|
||||
outline: none;
|
||||
-webkit-transition: color .25s, border-color .25s, -webkit-flex .25s;
|
||||
transition: color .25s, border-color .25s, flex .25s;
|
||||
}
|
||||
.field::-moz-placeholder,
|
||||
.field:hover::-moz-placeholder {
|
||||
color: #AAA !important;
|
||||
}
|
||||
.field:hover {
|
||||
border-color: #999;
|
||||
}
|
||||
.field:hover, .field:focus {
|
||||
color: #000;
|
||||
}
|
||||
.field[disabled] {
|
||||
background-color: #F2F2F2;
|
||||
color: #888;
|
||||
}
|
||||
.move {
|
||||
cursor: move;
|
||||
}
|
||||
label, .favicon {
|
||||
cursor: pointer;
|
||||
}
|
||||
a[href="javascript:;"] {
|
||||
text-decoration: none;
|
||||
}
|
||||
.warning {
|
||||
color: red;
|
||||
}
|
||||
|
||||
/* 4chan style fixes */
|
||||
.opContainer, .op {
|
||||
display: block !important;
|
||||
}
|
||||
.post {
|
||||
overflow: visible !important;
|
||||
}
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* fixed, z-index */
|
||||
#overlay,
|
||||
#qp, #ihover,
|
||||
#updater, #thread-stats,
|
||||
#navlinks, #header,
|
||||
#qr, #watcher {
|
||||
position: fixed;
|
||||
}
|
||||
#overlay {
|
||||
z-index: 999;
|
||||
}
|
||||
#notifications {
|
||||
z-index: 70;
|
||||
}
|
||||
#qp, #ihover {
|
||||
z-index: 60;
|
||||
}
|
||||
#menu {
|
||||
z-index: 50;
|
||||
}
|
||||
#navlinks, #updater, #thread-stats {
|
||||
z-index: 40;
|
||||
}
|
||||
#qr {
|
||||
z-index: 30;
|
||||
}
|
||||
#watcher {
|
||||
z-index: 20;
|
||||
}
|
||||
#header {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
.fourchan-x body {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
#header {
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
}
|
||||
#header-bar {
|
||||
border-width: 0 0 1px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
padding: 3px 4px 4px;
|
||||
position: relative;
|
||||
-webkit-transition: all .1s ease-in-out;
|
||||
transition: all .1s ease-in-out;
|
||||
}
|
||||
#board-list {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
}
|
||||
#header-bar.autohide:not(:hover) {
|
||||
box-shadow: none;
|
||||
margin-bottom: -1em;
|
||||
-webkit-transform: translateY(-100%);
|
||||
transform: translateY(-100%);
|
||||
-webkit-transition: all .8s .6s cubic-bezier(.55, .055, .675, .19);
|
||||
transition: all .8s .6s cubic-bezier(.55, .055, .675, .19);
|
||||
}
|
||||
#toggle-header-bar {
|
||||
cursor: n-resize;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: -8px;
|
||||
height: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
#header-bar.autohide:not(:hover) #toggle-header-bar, #toggle-header-bar:hover {
|
||||
bottom: -16px;
|
||||
height: 18px;
|
||||
}
|
||||
#header-bar.autohide #toggle-header-bar {
|
||||
cursor: s-resize;
|
||||
}
|
||||
#header-bar a:not(.entry) {
|
||||
text-decoration: none;
|
||||
padding: 1px;
|
||||
}
|
||||
#shortcuts:empty {
|
||||
display: none;
|
||||
}
|
||||
.brackets-wrap::before {
|
||||
content: "\\00a0[";
|
||||
}
|
||||
.brackets-wrap::after {
|
||||
content: "]\\00a0";
|
||||
}
|
||||
.disabled,
|
||||
.expand-all-shortcut {
|
||||
opacity: .45;
|
||||
}
|
||||
|
||||
/* Notifications */
|
||||
#notifications {
|
||||
height: 0;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
}
|
||||
.notification {
|
||||
color: #FFF;
|
||||
font-weight: 700;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
|
||||
border-radius: 2px;
|
||||
margin: 1px auto;
|
||||
width: 500px;
|
||||
max-width: 100%;
|
||||
position: relative;
|
||||
-webkit-transition: all .25s ease-in-out;
|
||||
transition: all .25s ease-in-out;
|
||||
}
|
||||
.notification.error {
|
||||
background-color: hsla(0, 100%, 38%, .9);
|
||||
}
|
||||
.notification.warning {
|
||||
background-color: hsla(36, 100%, 38%, .9);
|
||||
}
|
||||
.notification.info {
|
||||
background-color: hsla(200, 100%, 38%, .9);
|
||||
}
|
||||
.notification.success {
|
||||
background-color: hsla(104, 100%, 38%, .9);
|
||||
}
|
||||
.notification a {
|
||||
color: white;
|
||||
}
|
||||
.notification > .close {
|
||||
padding: 6px;
|
||||
top: 0;
|
||||
right: 0;
|
||||
position: absolute;
|
||||
}
|
||||
.message {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
padding: 6px 20px;
|
||||
max-height: 200px;
|
||||
width: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
#overlay {
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
#fourchanx-settings {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 0 15px rgba(0, 0, 0, .15);
|
||||
height: 600px;
|
||||
min-height: 0;
|
||||
max-height: 100%;
|
||||
width: 900px;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
padding: 3px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
#fourchanx-settings > nav {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
padding: 2px 2px 0;
|
||||
}
|
||||
#fourchanx-settings > nav a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
#fourchanx-settings > nav a.close {
|
||||
text-decoration: none;
|
||||
padding: 2px;
|
||||
}
|
||||
.sections-list {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
.section-container {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
.section-container > section {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
.section-sauce ul,
|
||||
.section-rice ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 8px;
|
||||
}
|
||||
.section-sauce li,
|
||||
.section-rice li {
|
||||
padding-left: 4px;
|
||||
}
|
||||
.section-main label {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.section-filter ul {
|
||||
padding: 0;
|
||||
}
|
||||
.section-filter li {
|
||||
margin: 10px 40px;
|
||||
}
|
||||
.section-filter textarea {
|
||||
height: 500px;
|
||||
}
|
||||
.section-sauce textarea {
|
||||
height: 350px;
|
||||
}
|
||||
.section-rice .field[name="boardnav"] {
|
||||
width: 100%;
|
||||
}
|
||||
.section-rice textarea {
|
||||
height: 150px;
|
||||
}
|
||||
#fourchanx-settings fieldset {
|
||||
border: 1px solid;
|
||||
border-radius: 3px;
|
||||
}
|
||||
#fourchanx-settings legend {
|
||||
font-weight: 700;
|
||||
}
|
||||
#fourchanx-settings textarea {
|
||||
font-family: monospace;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
#fourchanx-settings code {
|
||||
color: #000;
|
||||
background-color: #FFF;
|
||||
padding: 0 2px;
|
||||
}
|
||||
.unscroll {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Unread */
|
||||
#unread-line {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Thread Updater */
|
||||
#updater:not(:hover) {
|
||||
background: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
#updater > .move {
|
||||
padding: 0 3px;
|
||||
}
|
||||
#updater > div:last-child {
|
||||
text-align: center;
|
||||
}
|
||||
#updater input[type=number] {
|
||||
width: 4em;
|
||||
}
|
||||
#updater:not(:hover) > div:not(.move) {
|
||||
display: none;
|
||||
}
|
||||
.new {
|
||||
color: limegreen;
|
||||
}
|
||||
|
||||
/* Thread Watcher */
|
||||
#watcher {
|
||||
padding-bottom: 3px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#watcher:not(:hover) {
|
||||
max-height: 220px;
|
||||
}
|
||||
#watcher > .move {
|
||||
padding-top: 3px;
|
||||
}
|
||||
#watcher > div {
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
padding-left: 3px;
|
||||
padding-right: 3px;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
#watcher a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* Thread Stats */
|
||||
#thread-stats {
|
||||
background: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
.deadlink {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
.backlink.deadlink:not(.forwardlink), .quotelink.deadlink:not(.forwardlink) {
|
||||
text-decoration: underline !important;
|
||||
}
|
||||
.inlined {
|
||||
opacity: .5;
|
||||
}
|
||||
#qp input, .forwarded {
|
||||
display: none;
|
||||
}
|
||||
.quotelink.forwardlink,
|
||||
.backlink.forwardlink {
|
||||
text-decoration: none;
|
||||
border-bottom: 1px dashed;
|
||||
}
|
||||
.filtered {
|
||||
text-decoration: underline line-through;
|
||||
}
|
||||
.inline {
|
||||
border: 1px solid;
|
||||
display: table;
|
||||
margin: 2px 0;
|
||||
}
|
||||
.inline .post {
|
||||
border: 0 !important;
|
||||
background-color: transparent !important;
|
||||
display: table !important;
|
||||
margin: 0 !important;
|
||||
padding: 1px 2px !important;
|
||||
}
|
||||
#qp > .opContainer::after {
|
||||
content: '';
|
||||
clear: both;
|
||||
display: table;
|
||||
}
|
||||
#qp .post {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 2px 2px 5px;
|
||||
}
|
||||
#qp img {
|
||||
max-height: 300px;
|
||||
max-width: 500px;
|
||||
}
|
||||
.qphl {
|
||||
outline: 2px solid rgba(216, 94, 49, .7);
|
||||
}
|
||||
|
||||
/* File */
|
||||
.fileText:hover .fntrunc,
|
||||
.fileText:not(:hover) .fnfull,
|
||||
.expanded-image > .post > .file > .fileThumb > img[data-md5],
|
||||
:not(.expanded-image) > .post > .file > .fileThumb > .full-image {
|
||||
display: none;
|
||||
}
|
||||
.expanding {
|
||||
opacity: .5;
|
||||
}
|
||||
.expanded-image > .op > .file::after {
|
||||
content: '';
|
||||
clear: both;
|
||||
display: table;
|
||||
}
|
||||
:root.fit-width .full-image {
|
||||
max-width: 100%;
|
||||
}
|
||||
:root.gecko.fit-width .full-image,
|
||||
:root.presto.fit-width .full-image {
|
||||
width: 100%;
|
||||
}
|
||||
#ihover {
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
max-height: 100%;
|
||||
max-width: 75%;
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
/* Index/Reply Navigation */
|
||||
#navlinks {
|
||||
font-size: 16px;
|
||||
top: 25px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
/* Filter */
|
||||
.opContainer.filter-highlight {
|
||||
box-shadow: inset 5px 0 rgba(255, 0, 0, .5);
|
||||
}
|
||||
.filter-highlight > .reply {
|
||||
box-shadow: -5px 0 rgba(255, 0, 0, .5);
|
||||
}
|
||||
|
||||
/* Thread & Reply Hiding */
|
||||
.hide-thread-button,
|
||||
.hide-reply-button {
|
||||
float: left;
|
||||
margin-right: 2px;
|
||||
}
|
||||
.stub ~ .sideArrows,
|
||||
.stub ~ .hide-reply-button,
|
||||
.stub ~ .post {
|
||||
display: none !important;
|
||||
}
|
||||
.stub input {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.hide-original-post-form #postForm,
|
||||
.hide-original-post-form .postingMode,
|
||||
#qr.autohide:not(:hover) > form {
|
||||
display: none;
|
||||
}
|
||||
#qr select, #dump-button, .remove, .captcha-img {
|
||||
cursor: pointer;
|
||||
}
|
||||
#qr > div {
|
||||
min-width: 300px;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
#qr .move {
|
||||
-webkit-align-self: stretch;
|
||||
align-self: stretch;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
#qr select {
|
||||
margin: 0;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
.presto #qr select {
|
||||
height: 1em;
|
||||
}
|
||||
#qr .close {
|
||||
padding: 0 3px;
|
||||
}
|
||||
#qr > form {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
.persona {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
}
|
||||
.persona .field {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
.persona .field:focus {
|
||||
-webkit-flex: 4;
|
||||
flex: 4;
|
||||
}
|
||||
#dump-button {
|
||||
background: -webkit-linear-gradient(#EEE, #CCC);
|
||||
background: linear-gradient(#EEE, #CCC);
|
||||
border: 1px solid #CCC;
|
||||
margin: 0;
|
||||
padding: 2px 4px 3px;
|
||||
outline: none;
|
||||
width: 30px;
|
||||
}
|
||||
#dump-button:hover, #dump-button:focus {
|
||||
background: -webkit-linear-gradient(#FFF, #DDD);
|
||||
background: linear-gradient(#FFF, #DDD);
|
||||
}
|
||||
#dump-button:active, .dump #dump-button:not(:hover):not(:focus) {
|
||||
background: -webkit-linear-gradient(#CCC, #DDD);
|
||||
background: linear-gradient(#CCC, #DDD);
|
||||
}
|
||||
.gecko #dump-button {
|
||||
padding: 0;
|
||||
}
|
||||
#qr:not(.dump) #dump-list-container {
|
||||
display: none;
|
||||
}
|
||||
#dump-list-container {
|
||||
height: 100px;
|
||||
position: relative;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-o-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
#dump-list {
|
||||
counter-reset: qrpreviews;
|
||||
top: 0; right: 0; bottom: 0; left: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#dump-list:hover {
|
||||
bottom: -12px;
|
||||
overflow-x: auto;
|
||||
z-index: 1;
|
||||
}
|
||||
#dump-list::-webkit-scrollbar {
|
||||
height: 12px;
|
||||
}
|
||||
#dump-list::-webkit-scrollbar-thumb {
|
||||
border: 1px solid;
|
||||
}
|
||||
.qr-preview {
|
||||
background-position: 50% 20%;
|
||||
background-size: cover;
|
||||
border: 1px solid #808080;
|
||||
color: #FFF !important;
|
||||
font-size: 12px;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
cursor: move;
|
||||
display: inline-block;
|
||||
height: 92px; width: 92px;
|
||||
margin: 4px; padding: 2px;
|
||||
opacity: .6;
|
||||
outline: none;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
text-shadow: 0 1px 1px #000;
|
||||
-webkit-transition: opacity .25s ease-in-out;
|
||||
transition: opacity .25s ease-in-out;
|
||||
vertical-align: top;
|
||||
white-space: pre;
|
||||
}
|
||||
.qr-preview:hover, .qr-preview:focus {
|
||||
opacity: .9;
|
||||
color: #FFF !important;
|
||||
}
|
||||
.qr-preview#selected {
|
||||
opacity: 1;
|
||||
}
|
||||
.qr-preview::before {
|
||||
counter-increment: qrpreviews;
|
||||
content: counter(qrpreviews);
|
||||
font-weight: 700;
|
||||
text-shadow: 0 0 3px #000, 0 0 5px #000;
|
||||
position: absolute;
|
||||
top: 3px; right: 3px;
|
||||
}
|
||||
.qr-preview.drag {
|
||||
border-color: red;
|
||||
border-style: dashed;
|
||||
}
|
||||
.qr-preview.over {
|
||||
border-color: #FFF;
|
||||
border-style: dashed;
|
||||
}
|
||||
.remove {
|
||||
color: #E00 !important;
|
||||
font-weight: 700;
|
||||
padding: 3px;
|
||||
}
|
||||
.remove:hover::after {
|
||||
content: ' Remove';
|
||||
}
|
||||
.qr-preview > label {
|
||||
background: rgba(0, 0, 0, .5);
|
||||
right: 0; bottom: 0; left: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
}
|
||||
.qr-preview > label > input {
|
||||
margin: 1px 0;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
#add-post {
|
||||
display: inline-block;
|
||||
font-size: 30px;
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
line-height: 1;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
right: 0; bottom: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
#qr textarea {
|
||||
min-height: 160px;
|
||||
min-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
#qr.has-captcha textarea {
|
||||
min-height: 120px;
|
||||
}
|
||||
.textarea {
|
||||
position: relative;
|
||||
}
|
||||
#char-count {
|
||||
color: #000;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
font-size: 8pt;
|
||||
position: absolute;
|
||||
bottom: 1px;
|
||||
right: 1px;
|
||||
pointer-events: none;
|
||||
}
|
||||
#char-count.warning {
|
||||
color: red;
|
||||
}
|
||||
.captcha-img {
|
||||
background: #FFF;
|
||||
outline: 1px solid #CCC;
|
||||
outline-offset: -1px;
|
||||
}
|
||||
.captcha-img > img {
|
||||
display: block;
|
||||
height: 57px;
|
||||
width: 300px;
|
||||
}
|
||||
#file-n-submit > input {
|
||||
margin: 0;
|
||||
}
|
||||
#file-n-submit.has-file #qr-no-file {
|
||||
visibility: hidden;
|
||||
}
|
||||
#file-n-submit:not(.has-file) #qr-filename,
|
||||
#file-n-submit:not(.has-file) #qr-file-spoiler,
|
||||
#file-n-submit:not(.has-file) #qr-filerm {
|
||||
display: none;
|
||||
}
|
||||
#file-n-submit {
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
#qr-no-file, #qr-filename-container {
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
#qr-filename-container {
|
||||
cursor: default;
|
||||
position: relative;
|
||||
margin-left: 2px;
|
||||
}
|
||||
#qr-filename {
|
||||
position: absolute;
|
||||
top: 0; right: 0; bottom: 0; left: 0;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#qr-filerm {
|
||||
padding: 0 2px;
|
||||
}
|
||||
#file-n-submit > #qr-file-spoiler {
|
||||
margin: 0 2px;
|
||||
}
|
||||
#qr input[type='file'] {
|
||||
position: absolute;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
.menu-button {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
.menu-button i {
|
||||
border-top: 6px solid;
|
||||
border-right: 4px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
display: inline-block;
|
||||
margin: 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#menu {
|
||||
border-bottom: 0;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
margin: 2px 0;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
outline: none;
|
||||
}
|
||||
.entry {
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
padding: 3px 7px;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.entry.has-submenu {
|
||||
padding-right: 20px;
|
||||
}
|
||||
.has-submenu::after {
|
||||
content: '';
|
||||
border-left: 6px solid;
|
||||
border-top: 4px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
display: inline-block;
|
||||
margin: 4px;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
.has-submenu:not(.focused) > .submenu {
|
||||
display: none;
|
||||
}
|
||||
.submenu {
|
||||
border-bottom: 0;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
margin: -1px 0;
|
||||
}
|
||||
.entry input {
|
||||
margin: 0;
|
||||
}
|
||||
30
css/theme.4chanss.css
Normal file
30
css/theme.4chanss.css
Normal file
@ -0,0 +1,30 @@
|
||||
.board {
|
||||
padding: 1px 2px;
|
||||
}
|
||||
.rice {
|
||||
box-shadow:rgba(""" + mainColor.shiftRGB(32) + """,.3) 0 1px;
|
||||
}
|
||||
input[type=password]:hover,
|
||||
input[type=text]:not([disabled]):hover,
|
||||
input#fs_search:hover,
|
||||
input.field:hover,
|
||||
.webkit select:hover,
|
||||
textarea:hover,
|
||||
#options input:not([type=checkbox]):hover {
|
||||
box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;
|
||||
}
|
||||
input[type=password]:focus,
|
||||
input[type=text]:focus,
|
||||
input#fs_search:focus,
|
||||
input.field:focus,
|
||||
.webkit select:focus,
|
||||
textarea:focus,
|
||||
#options input:focus {
|
||||
box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;
|
||||
}
|
||||
button,
|
||||
input,
|
||||
textarea,
|
||||
.rice {
|
||||
transition:background .2s,box-shadow .2s;
|
||||
}
|
||||
396
css/theme.css
Normal file
396
css/theme.css
Normal file
@ -0,0 +1,396 @@
|
||||
|
||||
.hide_thread_button span > span,
|
||||
.hide_reply_button span > span {
|
||||
background-color: #{theme["Links"]};
|
||||
}
|
||||
#mascot_hide label {
|
||||
border-bottom: 1px solid #{theme["Reply Border"]};
|
||||
}
|
||||
#content .thumb {
|
||||
box-shadow: 0 0 5px #{theme["Reply Border"]};
|
||||
}
|
||||
.mascotname,
|
||||
.mascotoptions {
|
||||
background: #{theme["Dialog Background"]};
|
||||
border: 1px solid #{theme["Buttons Border"]};
|
||||
}
|
||||
.opContainer.filter_highlight {
|
||||
box-shadow: inset 5px 0 #{theme["Backlinked Reply Outline"]};
|
||||
}
|
||||
.filter_highlight > .reply {
|
||||
box-shadow: -5px 0 #{theme["Backlinked Reply Outline"]};
|
||||
}
|
||||
::#{agent}selection {
|
||||
background: #{theme["Text"]};
|
||||
color: #{backgroundC};
|
||||
}
|
||||
hr {
|
||||
border-bottom: 1px solid #{theme["Reply Border"]};
|
||||
}
|
||||
a[style="cursor: pointer; float: right;"] + div[style^="width: 100%;"] > table > tbody > tr > td {
|
||||
background: #{backgroundC} !important;
|
||||
border: 1px solid #{theme["Reply Border"]} !important;
|
||||
}
|
||||
#fs_status {
|
||||
background: #{theme["Dialog Background"]} !important;
|
||||
}
|
||||
#fs_data tr[style="background-color: #EA8;"] {
|
||||
background: #{theme["Reply Background"]} !important;
|
||||
}
|
||||
#fs_data,
|
||||
#fs_data * {
|
||||
border-color: #{theme["Reply Border"]} !important;
|
||||
}
|
||||
html {
|
||||
background: #{backgroundC or ''};
|
||||
background-image: #{theme["Background Image"] or ''};
|
||||
background-repeat: #{theme["Background Repeat"] or ''};
|
||||
background-attachment: #{theme["Background Attachment"] or ''};
|
||||
background-position: #{theme["Background Position"] or ''};
|
||||
}
|
||||
#optionsContent,
|
||||
#exlinks-options-content,
|
||||
#mascotcontent,
|
||||
#themecontent {
|
||||
background: #{backgroundC};
|
||||
border: 1px solid #{theme["Reply Border"]};
|
||||
padding: 5px;
|
||||
}
|
||||
#selected_tab {
|
||||
background: #{backgroundC};
|
||||
border-color: #{theme["Reply Border"]};
|
||||
border-style: solid;
|
||||
}
|
||||
.captchaimg img {
|
||||
#{Style.filter theme["Text"], theme["Input Background"]}
|
||||
}
|
||||
#boardTitle,
|
||||
#prefetch,
|
||||
#showQR,
|
||||
#{unless _conf["Post Form Decorations"] then '#spoilerLabel,' else ''}
|
||||
#stats,
|
||||
#updater:not(:hover) .move {
|
||||
text-shadow:
|
||||
1px 1px 0 #{backgroundC},
|
||||
-1px -1px 0 #{backgroundC},
|
||||
1px -1px 0 #{backgroundC},
|
||||
-1px 1px 0 #{backgroundC},
|
||||
0 1px 0 #{backgroundC},
|
||||
0 -1px 0 #{backgroundC},
|
||||
1px 0 0 #{backgroundC},
|
||||
-1px 0 0 #{backgroundC}
|
||||
#{if _conf["Sidebar Glow"] then ", 0 2px 5px #{theme['Text']};" else ";"}
|
||||
}
|
||||
/* Fixes text spoilers */
|
||||
#{if _conf['Remove Spoilers'] and _conf['Indicate Spoilers'] then "
|
||||
.spoiler::before,
|
||||
s::before {
|
||||
content: '[spoiler]';
|
||||
}
|
||||
.spoiler::after,
|
||||
s::after {
|
||||
content: '[/spoiler]';
|
||||
}
|
||||
" else unless _conf['Remove Spoilers'] then "
|
||||
.spoiler:not(:hover) *,
|
||||
s:not(:hover) * {
|
||||
color: rgb(0,0,0) !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
.spoiler:not(:hover),
|
||||
s:not(:hover) {
|
||||
background-color: rgb(0,0,0);
|
||||
color: rgb(0,0,0) !important;
|
||||
text-shadow: none !important;
|
||||
}" else ""}
|
||||
#exlinks-options,
|
||||
#options,
|
||||
#qrtab,
|
||||
#{if _conf["Post Form Decorations"] then "#qr," else ""}
|
||||
#updater:hover,
|
||||
input[type="submit"],
|
||||
input[value="Report"],
|
||||
span[style="left: 5px; position: absolute;"] a {
|
||||
background: #{theme["Buttons Background"]};
|
||||
border: 1px solid #{theme["Buttons Border"]};
|
||||
}
|
||||
.enabled .mascotcontainer {
|
||||
background: #{theme["Buttons Background"]};
|
||||
border-color: #{theme["Buttons Border"]};
|
||||
}
|
||||
#dump,
|
||||
#file,
|
||||
#options input,
|
||||
.captchaimg,
|
||||
.dump #dump:not(:hover):not(:focus),
|
||||
.selectrice,
|
||||
button,
|
||||
input,
|
||||
textarea {
|
||||
background: #{theme["Input Background"]};
|
||||
border: 1px solid #{theme["Input Border"]};
|
||||
color: #{theme["Inputs"]};
|
||||
}
|
||||
#dump:hover,
|
||||
#file:hover,
|
||||
#options .selectrice li:nth-of-type(2n+1):hover,
|
||||
.selectrice:hover,
|
||||
.selectrice li:hover,
|
||||
input:hover,
|
||||
textarea:hover {
|
||||
background: #{theme["Hovered Input Background"]};
|
||||
border-color: #{theme["Hovered Input Border"]};
|
||||
color: #{theme["Inputs"]};
|
||||
}
|
||||
#dump:active,
|
||||
#dump:focus,
|
||||
.selectrice:focus,
|
||||
.selectrice li:focus,
|
||||
input:focus,
|
||||
textarea:focus,
|
||||
textarea.field:focus {
|
||||
background: #{theme["Focused Input Background"]};
|
||||
border-color: #{theme["Focused Input Border"]};
|
||||
color: #{theme["Inputs"]};
|
||||
}
|
||||
#mouseover,
|
||||
#post-preview,
|
||||
#qp .post,
|
||||
#xupdater,
|
||||
.reply.post {
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
border-color: #{theme["Reply Border"]};
|
||||
background: #{theme["Reply Background"]};
|
||||
}
|
||||
.thread > .replyContainer > .reply.post {
|
||||
border-width: #{if _conf['Post Spacing'] is "0" then "1px 1px 0 1px" else '1px'};
|
||||
}
|
||||
.exblock.reply,
|
||||
.reply.post.highlight,
|
||||
.reply.post:target {
|
||||
background: #{theme["Highlighted Reply Background"]};
|
||||
border: 1px solid #{theme["Highlighted Reply Border"]};
|
||||
}
|
||||
#boardNavDesktop,
|
||||
.pagelist {
|
||||
background: #{theme["Navigation Background"]};
|
||||
border-style: solid;
|
||||
border-color: #{theme["Navigation Border"]};
|
||||
}
|
||||
.thread {
|
||||
background: #{theme["Thread Wrapper Background"]};
|
||||
border: 1px solid #{theme["Thread Wrapper Border"]};
|
||||
}
|
||||
#boardNavDesktopFoot,
|
||||
#mascotConf,
|
||||
#mascot_hide,
|
||||
#menu,
|
||||
#selectrice,
|
||||
#themeConf,
|
||||
#watcher,
|
||||
#watcher:hover,
|
||||
.subMenu,
|
||||
a[style="cursor: pointer; float: right;"] ~ div[style^="width: 100%;"] > table {
|
||||
background: #{theme["Dialog Background"]};
|
||||
border: 1px solid #{theme["Dialog Border"]};
|
||||
}
|
||||
.deleteform::before,
|
||||
.deleteform,
|
||||
#qr .warning {
|
||||
background: #{theme["Input Background"]};
|
||||
border-color: #{theme["Input Border"]};
|
||||
}
|
||||
.disabledwarning,
|
||||
.warning {
|
||||
color: #{theme["Warnings"]};
|
||||
}
|
||||
#navlinks a:first-of-type {
|
||||
border-bottom: 11px solid rgb(#{if Style.lightTheme then "130,130,130" else "152,152,152"});
|
||||
}
|
||||
#navlinks a:last-of-type {
|
||||
border-top: 11px solid rgb(#{if Style.lightTheme then "130,130,130" else "152,152,152"});
|
||||
}
|
||||
#charCount {
|
||||
color: #{(if Style.lightTheme then "rgba(0,0,0,0.7)" else "rgba(255,255,255,0.7)")};
|
||||
}
|
||||
.postNum a {
|
||||
color: #{theme["Post Numbers"]};
|
||||
}
|
||||
.subject {
|
||||
color: #{theme["Subjects"]} !important;
|
||||
}
|
||||
.dateTime,
|
||||
.post-ago {
|
||||
color: #{theme["Timestamps"]} !important;
|
||||
}
|
||||
#fs_status a,
|
||||
#imgControls label::after,
|
||||
#updater #count:not(.new)::after,
|
||||
#showQR,
|
||||
#updater,
|
||||
.abbr,
|
||||
.boxbar,
|
||||
.boxcontent,
|
||||
.deleteform::before,
|
||||
.pages strong,
|
||||
.pln,
|
||||
.reply,
|
||||
.reply.highlight,
|
||||
.summary,
|
||||
body,
|
||||
button,
|
||||
span[style="left: 5px; position: absolute;"] a,
|
||||
input,
|
||||
textarea {
|
||||
color: #{theme["Text"]};
|
||||
}
|
||||
#exlinks-options-content > table,
|
||||
#options ul,
|
||||
.selectrice ul {
|
||||
border-bottom: 1px solid #{theme["Reply Border"]};
|
||||
box-shadow: inset #{theme["Shadow Color"]} 0 0 5px;
|
||||
}
|
||||
.quote + .spoiler:hover,
|
||||
.quote {
|
||||
color: #{theme["Greentext"]};
|
||||
}
|
||||
.forwardlink {
|
||||
text-decoration: #{if _conf["Underline Links"] then "underline" else "none"};
|
||||
border-bottom: 1px dashed #{theme["Backlinks"]};
|
||||
}
|
||||
.container::before {
|
||||
color: #{theme["Timestamps"]};
|
||||
}
|
||||
#menu,
|
||||
#post-preview,
|
||||
#qp .opContainer,
|
||||
#qp .replyContainer,
|
||||
.subMenu {
|
||||
box-shadow: #{if _conf['Quote Shadows'] then "5px 5px 5px #{theme['Shadow Color']}" else ""};
|
||||
}
|
||||
.rice {
|
||||
background: #{theme["Checkbox Background"]};
|
||||
border: 1px solid #{theme["Checkbox Border"]};
|
||||
}
|
||||
.selectrice::before {
|
||||
border-left: 1px solid #{theme["Input Border"]};
|
||||
}
|
||||
.selectrice::after {
|
||||
border-top: .45em solid #{theme["Inputs"]};
|
||||
}
|
||||
#updater input,
|
||||
.bd {
|
||||
background: #{theme["Buttons Background"]};
|
||||
border: 1px solid #{theme["Buttons Border"]};
|
||||
}
|
||||
.pages a,
|
||||
#boardNavDesktop a {
|
||||
color: #{theme["Navigation Links"]};
|
||||
}
|
||||
input[type=checkbox]:checked + .rice {
|
||||
background: #{theme["Checkbox Checked Background"]};
|
||||
background-image: url(#{
|
||||
Icons.header.png + (
|
||||
if Style.lightTheme
|
||||
"AkAAAAJCAMAAADXT/YiAAAAWlBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACLSV5RAAAAHXRSTlMAgVHwkF11LdsM9vm9n5x+ye0qMOfk/GzqSMC6EsZzJYoAAABBSURBVHheLcZHEoAwEMRArcHknNP8/5u4MLqo+SszcBMwFyt57cFXamjV0UtyDBotIIVFiiAJ33aijhOA67bnwwuZdAPNxckOUgAAAABJRU5ErkJggg=="
|
||||
else
|
||||
"AkAAAAJCAMAAADXT/YiAAAAWlBMVEX///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9jZLFEAAAAHXRSTlMAgVHwkF11LdsM9vm9n5x+ye0qMOfk/GzqSMC6EsZzJYoAAABBSURBVHheLcZHEoAwEMRArcHknNP8/5u4MLqo+SszcBMwFyt57cFXamjV0UtyDBotIIVFiiAJ33aijhOA67bnwwuZdAPNxckOUgAAAABJRU5ErkJggg=="
|
||||
)
|
||||
});
|
||||
}
|
||||
#addReply,
|
||||
#dump,
|
||||
.button,
|
||||
.entry,
|
||||
.replylink,
|
||||
a {
|
||||
color: #{theme["Links"]};
|
||||
}
|
||||
.backlink {
|
||||
color: #{theme["Backlinks"]};
|
||||
}
|
||||
.qiQuote,
|
||||
.quotelink {
|
||||
color: #{theme["Quotelinks"]};
|
||||
}
|
||||
#addReply:hover,
|
||||
#dump:hover,
|
||||
.entry:hover,
|
||||
.sideArrows a:hover,
|
||||
.replylink:hover,
|
||||
.qiQuote:hover,
|
||||
.quotelink:hover,
|
||||
a .name:hover,
|
||||
a .postertrip:hover,
|
||||
a:hover {
|
||||
color: #{theme["Hovered Links"]};
|
||||
}
|
||||
#boardNavDesktop a:hover,
|
||||
#boardTitle a:hover {
|
||||
color: #{theme["Hovered Navigation Links"]};
|
||||
}
|
||||
#boardTitle {
|
||||
color: #{theme["Board Title"]};
|
||||
}
|
||||
.name,
|
||||
.post-author {
|
||||
color: #{theme["Names"]} !important;
|
||||
}
|
||||
.post-tripcode,
|
||||
.postertrip,
|
||||
.trip {
|
||||
color: #{theme["Tripcodes"]} !important;
|
||||
}
|
||||
a .postertrip,
|
||||
a .name {
|
||||
color: #{theme["Emails"]};
|
||||
}
|
||||
.post.reply.qphl,
|
||||
.post.op.qphl {
|
||||
border-color: #{theme["Backlinked Reply Outline"]};
|
||||
background: #{theme["Highlighted Reply Background"]};
|
||||
}
|
||||
.inline .post {
|
||||
box-shadow: #{if _conf['Quote Shadows'] then "5px 5px 5px #{theme['Shadow Color']}" else ""};
|
||||
}
|
||||
.placeholder,
|
||||
#qr input::#{agent}placeholder,
|
||||
#qr textarea::#{agent}placeholder {
|
||||
color: #{if Style.lightTheme then "rgba(0,0,0,0.3)" else "rgba(255,255,255,0.2)"} !important;
|
||||
}
|
||||
#qr input:#{agent}placeholder,
|
||||
#qr textarea:#{agent}placeholder,
|
||||
.placeholder {
|
||||
color: #{if Style.lightTheme then "rgba(0,0,0,0.3)" else "rgba(255,255,255,0.2)"} !important;
|
||||
}
|
||||
#options ul,
|
||||
.boxcontent dd,
|
||||
.selectrice ul {
|
||||
border-color: #{if Style.lightTheme then "rgba(0,0,0,0.1)" else "rgba(255,255,255,0.1)"};
|
||||
}
|
||||
#options li,
|
||||
.selectrice li:not(:first-of-type) {
|
||||
border-top: 1px solid #{if Style.lightTheme then "rgba(0,0,0,0.05)" else "rgba(255,255,255,0.025)"};
|
||||
}
|
||||
#navtopright .exlinksOptionsLink::after,
|
||||
#appchanOptions,
|
||||
.navLinks > a:first-of-type::after,
|
||||
#watcher::after,
|
||||
#globalMessage::after,
|
||||
#boardNavDesktopFoot::after,
|
||||
a[style="cursor: pointer; float: right;"]::after,
|
||||
#imgControls label:first-of-type::after,
|
||||
#catalog::after,
|
||||
#fappeTyme {
|
||||
background-image: url('#{icons}');
|
||||
#{unless Style.lightTheme then "
|
||||
filter: url(\"
|
||||
data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg'><filter id='filters' color-interpolation-filters='sRGB'><feColorMatrix values='
|
||||
-1 0 0 0 1
|
||||
0 -1 0 0 1
|
||||
0 0 -1 0 1
|
||||
0 0 0 1 0' /></filter></svg>#filters
|
||||
\");" else ""}
|
||||
}
|
||||
#{theme["Custom CSS"]}
|
||||
27
css/theme.oneechan.css
Normal file
27
css/theme.oneechan.css
Normal file
@ -0,0 +1,27 @@
|
||||
.rice {
|
||||
box-shadow:rgba(""" + mainColor.shiftRGB(32) + """,.3) 0 1px;
|
||||
}
|
||||
input[type=password]:hover,
|
||||
input[type=text]:not([disabled]):hover,
|
||||
input#fs_search:hover,
|
||||
input.field:hover,
|
||||
.webkit select:hover,
|
||||
textarea:hover,
|
||||
#options input:not([type=checkbox]):hover {
|
||||
box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;
|
||||
}
|
||||
input[type=password]:focus,
|
||||
input[type=text]:focus,
|
||||
input#fs_search:focus,
|
||||
input.field:focus,
|
||||
.webkit select:focus,
|
||||
textarea:focus,
|
||||
#options input:focus {
|
||||
box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;
|
||||
}
|
||||
button,
|
||||
input,
|
||||
textarea,
|
||||
.rice {
|
||||
transition:background .2s,box-shadow .2s;
|
||||
}
|
||||
@ -1,58 +0,0 @@
|
||||
/* General */
|
||||
:root.tomorrow .dialog {
|
||||
background-color: #282A2E;
|
||||
border-color: #111;
|
||||
}
|
||||
:root.tomorrow .field:focus {
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.tomorrow #header-bar {
|
||||
font-size: 9pt;
|
||||
color: #C5C8C6;
|
||||
}
|
||||
:root.tomorrow #header-bar a {
|
||||
color: #81A2BE;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.tomorrow #fourchanx-settings fieldset {
|
||||
border-color: #111;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.tomorrow .backlink.deadlink {
|
||||
color: #81A2BE !important;
|
||||
}
|
||||
:root.tomorrow .inline {
|
||||
border-color: #111;
|
||||
background-color: rgba(0, 0, 0, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.tomorrow #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #282A2E;
|
||||
border-color: #111;
|
||||
}
|
||||
:root.tomorrow #qr select {
|
||||
color: #C5C8C6;
|
||||
}
|
||||
:root.tomorrow #qr option {
|
||||
color: #000;
|
||||
}
|
||||
:root.tomorrow .qr-preview {
|
||||
background-color: rgba(255, 255, 255, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.tomorrow #menu {
|
||||
color: #C5C8C6;
|
||||
}
|
||||
:root.tomorrow .entry {
|
||||
border-bottom: 1px solid #111;
|
||||
font-size: 10pt;
|
||||
}
|
||||
:root.tomorrow .focused.entry {
|
||||
background: rgba(0, 0, 0, .33);
|
||||
}
|
||||
@ -1,52 +0,0 @@
|
||||
/* General */
|
||||
:root.yotsuba-b .dialog {
|
||||
background-color: #D6DAF0;
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
:root.yotsuba-b .field:focus {
|
||||
border-color: #98E;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.yotsuba-b #header-bar {
|
||||
font-size: 9pt;
|
||||
color: #89A;
|
||||
}
|
||||
:root.yotsuba-b #header-bar a {
|
||||
color: #34345C;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.yotsuba-b #fourchanx-settings fieldset {
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.yotsuba-b .backlink.deadlink {
|
||||
color: #34345C !important;
|
||||
}
|
||||
:root.yotsuba-b .inline {
|
||||
border-color: #B7C5D9;
|
||||
background-color: rgba(255, 255, 255, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.yotsuba-b #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #D6DAF0;
|
||||
border-color: #B7C5D9;
|
||||
}
|
||||
:root.yotsuba-b .qr-preview {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.yotsuba-b #menu {
|
||||
color: #000;
|
||||
}
|
||||
:root.yotsuba-b .entry {
|
||||
border-bottom: 1px solid #B7C5D9;
|
||||
font-size: 10pt;
|
||||
}
|
||||
:root.yotsuba-b .focused.entry {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
@ -1,52 +0,0 @@
|
||||
/* General */
|
||||
:root.yotsuba .dialog {
|
||||
background-color: #F0E0D6;
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
:root.yotsuba .field:focus {
|
||||
border-color: #EA8;
|
||||
}
|
||||
|
||||
/* Header */
|
||||
:root.yotsuba #header-bar {
|
||||
font-size: 9pt;
|
||||
color: #B86;
|
||||
}
|
||||
:root.yotsuba #header-bar a {
|
||||
color: #800000;
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
:root.yotsuba #fourchanx-settings fieldset {
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
|
||||
/* Quote */
|
||||
:root.yotsuba .backlink.deadlink {
|
||||
color: #00E !important;
|
||||
}
|
||||
:root.yotsuba .inline {
|
||||
border-color: #D9BFB7;
|
||||
background-color: rgba(255, 255, 255, .14);
|
||||
}
|
||||
|
||||
/* QR */
|
||||
.yotsuba #dump-list::-webkit-scrollbar-thumb {
|
||||
background-color: #F0E0D6;
|
||||
border-color: #D9BFB7;
|
||||
}
|
||||
:root.yotsuba .qr-preview {
|
||||
background-color: rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
/* Menu */
|
||||
:root.yotsuba #menu {
|
||||
color: #800000;
|
||||
}
|
||||
:root.yotsuba .entry {
|
||||
border-bottom: 1px solid #D9BFB7;
|
||||
font-size: 10pt;
|
||||
}
|
||||
:root.yotsuba .focused.entry {
|
||||
background: rgba(255, 255, 255, .33);
|
||||
}
|
||||
@ -121,8 +121,9 @@ $.extend $,
|
||||
cb()
|
||||
else
|
||||
setTimeout $.asap, 25, test, cb
|
||||
addStyle: (css) ->
|
||||
addStyle: (css, id) ->
|
||||
style = $.el 'style',
|
||||
id: id
|
||||
textContent: css
|
||||
$.asap (-> d.head), ->
|
||||
$.add d.head, style
|
||||
|
||||
1530
src/appchan.coffee
1530
src/appchan.coffee
File diff suppressed because it is too large
Load Diff
@ -282,6 +282,356 @@ Config =
|
||||
'Expand all images only from current position to thread end.'
|
||||
]
|
||||
|
||||
style:
|
||||
|
||||
# Style Options are either booleans, select options, or text, depending on the value of optionName[2].
|
||||
# If it doesn't exist, it is a boolean, if it does, it's either an array of the select options or "text".
|
||||
|
||||
Interface:
|
||||
'Single Column Mode': [
|
||||
true
|
||||
'Presents options in a single column, rather than in blocks.'
|
||||
]
|
||||
'Sidebar': [
|
||||
'normal'
|
||||
'Alter the sidebar size. Completely hiding it can cause content to overlap, but with the correct option combinations can create a minimal 4chan layout that has more efficient screen real-estate than vanilla 4chan.'
|
||||
['large', 'normal', 'minimal', 'hide']
|
||||
]
|
||||
'Sidebar Location': [
|
||||
'right'
|
||||
'The side of the page the sidebar content is on. It is highly recommended that you do not hide the sidebar if you change this option.'
|
||||
['left', 'right']
|
||||
]
|
||||
'Top Thread Padding': [
|
||||
'0'
|
||||
'Add some spacing between the top edge of document and the threads.'
|
||||
'text'
|
||||
]
|
||||
'Bottom Thread Padding': [
|
||||
'0'
|
||||
'Add some spacing between the bottom edge of document and the threads.'
|
||||
'text'
|
||||
]
|
||||
'Left Thread Padding': [
|
||||
'0'
|
||||
'Add some spacing between the left edge of document and the threads.'
|
||||
'text'
|
||||
]
|
||||
'Right Thread Padding': [
|
||||
'0'
|
||||
'Add some spacing between the right edge of document and the threads.'
|
||||
'text'
|
||||
]
|
||||
'Announcements': [
|
||||
'slideout'
|
||||
'The style of announcements and the ability to hide them.'
|
||||
['4chan default', 'slideout', 'hide']
|
||||
]
|
||||
'Board Title': [
|
||||
'at sidebar top'
|
||||
'The positioning of the board\'s logo and subtitle.'
|
||||
['at sidebar top', 'at sidebar bottom', 'at top', 'under post form', 'hide']
|
||||
]
|
||||
'Custom Board Titles': [
|
||||
false
|
||||
'Customize Board Titles by shift-clicking the board title or subtitle.'
|
||||
]
|
||||
'Board Subtitle': [
|
||||
true
|
||||
'Show the board subtitle.'
|
||||
]
|
||||
'4chan Banner': [
|
||||
'at sidebar top'
|
||||
'The positioning of 4chan\'s image banner.'
|
||||
['at sidebar top', 'at sidebar bottom', 'under post form', 'at top', 'hide']
|
||||
]
|
||||
'4chan Banner Reflection': [
|
||||
false
|
||||
'Adds reflection effects to 4chan\'s image banner.'
|
||||
]
|
||||
'Faded 4chan Banner': [
|
||||
true
|
||||
'Make 4chan\'s image banner translucent.'
|
||||
]
|
||||
'Icon Orientation': [
|
||||
'horizontal'
|
||||
'Change the orientation of the appchan x icons.'
|
||||
['horizontal', 'vertical']
|
||||
]
|
||||
'Slideout Watcher': [
|
||||
true
|
||||
'Adds an icon you can hover over to show the watcher, as opposed to having the watcher always visible.'
|
||||
]
|
||||
'Updater Position': [
|
||||
'top'
|
||||
'The position of 4chan thread updater and stats'
|
||||
['top', 'bottom', 'moveable']
|
||||
]
|
||||
|
||||
Posts:
|
||||
'Alternate Post Colors': [
|
||||
false
|
||||
'Make post background colors alternate every other post.'
|
||||
]
|
||||
'Color Reply Headings': [
|
||||
false
|
||||
'Give the post info a background.'
|
||||
]
|
||||
'Color File Info': [
|
||||
false
|
||||
'Give the file info a background.'
|
||||
]
|
||||
'OP Background': [
|
||||
false
|
||||
'Adds a border and background color to the OP Post, as if it were a reply.'
|
||||
]
|
||||
'Backlinks Position': [
|
||||
'default'
|
||||
'The position of backlinks in relation to the post.'
|
||||
['default', 'lower left', 'lower right']
|
||||
]
|
||||
'Sage Highlighting': [
|
||||
'image'
|
||||
'Icons or text to highlight saged posts.'
|
||||
['text', 'image', 'none']
|
||||
]
|
||||
'Sage Highlight Position': [
|
||||
'after'
|
||||
'Position of Sage Highlighting'
|
||||
['before', 'after']
|
||||
]
|
||||
'Filtered Backlinks': [
|
||||
true
|
||||
'Mark backlinks to filtered posts.'
|
||||
]
|
||||
'Force Reply Break': [
|
||||
false
|
||||
'Force replies to occupy their own line and not be adjacent to the OP image.'
|
||||
]
|
||||
'Fit Width Replies': [
|
||||
true
|
||||
'Replies fit the entire width of the page.'
|
||||
]
|
||||
'Hide Delete UI': [
|
||||
false
|
||||
'Hides vanilla report and delete functionality and UI. This does not affect Appchan\'s Menu functionality.'
|
||||
]
|
||||
'Post Spacing': [
|
||||
'2'
|
||||
'The amount of space between replies.'
|
||||
'text'
|
||||
]
|
||||
'Vertical Post Padding': [
|
||||
'5'
|
||||
'The vertical padding around post content of replies.'
|
||||
'text'
|
||||
]
|
||||
'Horizontal Post Padding': [
|
||||
'20'
|
||||
'The horizontal padding around post content of replies.'
|
||||
'text'
|
||||
]
|
||||
'Hide Horizontal Rules': [
|
||||
false
|
||||
'Hides lines between threads.'
|
||||
]
|
||||
'Images Overlap Post Form': [
|
||||
true
|
||||
'Images expand over the post form and sidebar content, usually used with "Expand images" set to "full".'
|
||||
]
|
||||
|
||||
Aesthetics:
|
||||
'4chan SS Navigation': [
|
||||
false
|
||||
'Try to emulate the appearance of 4chan SS\'s Navigation.'
|
||||
]
|
||||
'4chan SS Sidebar': [
|
||||
false
|
||||
'Try to emulate the appearance of 4chan SS\'s Sidebar.'
|
||||
]
|
||||
'Block Ads': [
|
||||
false
|
||||
'Block advertisements. It\'s probably better to use AdBlock for this.'
|
||||
]
|
||||
'Shrink Ads': [
|
||||
false
|
||||
'Make 4chan advertisements smaller.'
|
||||
]
|
||||
'Bolds': [
|
||||
true
|
||||
'Bold text for names and such.'
|
||||
]
|
||||
'Italics': [
|
||||
false
|
||||
'Give tripcodes italics.'
|
||||
]
|
||||
'Sidebar Glow': [
|
||||
false
|
||||
'Adds a glow to the sidebar\'s text.'
|
||||
]
|
||||
'Circle Checkboxes': [
|
||||
false
|
||||
'Make checkboxes circular.'
|
||||
]
|
||||
'Custom CSS': [
|
||||
false
|
||||
'Add (more) custom CSS to Appchan X'
|
||||
]
|
||||
'Emoji': [
|
||||
'enabled'
|
||||
'Enable emoji'
|
||||
['enabled', 'disable ponies', 'only ponies', 'disable']
|
||||
]
|
||||
'Emoji Position': [
|
||||
'before'
|
||||
'Position of emoji icons, like sega and neko.'
|
||||
['before', 'after']
|
||||
]
|
||||
'Emoji Spacing': [
|
||||
'5'
|
||||
'Add some spacing between emoji and text.'
|
||||
'text'
|
||||
]
|
||||
'Font': [
|
||||
'sans-serif'
|
||||
'The font used by all elements of 4chan.'
|
||||
'text'
|
||||
]
|
||||
'Font Size': [
|
||||
'12'
|
||||
'The font size of posts and various UI. This changes most, but not all, font sizes.'
|
||||
'text'
|
||||
]
|
||||
'Icons': [
|
||||
'oneechan'
|
||||
'Icon theme which Appchan will use.'
|
||||
['oneechan', '4chan SS']
|
||||
]
|
||||
'Invisible Icons': [
|
||||
false
|
||||
'Makes icons invisible unless hovered. Invisible really is "invisible", so don\'t use it if you don\'t have your icons memorized or don\'t use keybinds.'
|
||||
]
|
||||
'Quote Shadows': [
|
||||
true
|
||||
'Add shadows to the quote previews and inline quotes.'
|
||||
]
|
||||
'Rounded Edges': [
|
||||
false
|
||||
'Round the edges of various 4chan elements.'
|
||||
]
|
||||
'Underline Links': [
|
||||
false
|
||||
'Put lines under hyperlinks.'
|
||||
]
|
||||
'NSFW/SFW Themes': [
|
||||
false
|
||||
'Choose your theme based on the SFW status of the board you are viewing.'
|
||||
]
|
||||
|
||||
Mascots:
|
||||
'Mascots': [
|
||||
true
|
||||
'Add a pretty picture of your waifu to Appchan.'
|
||||
]
|
||||
'Mascot Location': [
|
||||
'sidebar'
|
||||
'Change where your mascot is located.'
|
||||
['sidebar', 'opposite']
|
||||
]
|
||||
'Mascot Position': [
|
||||
'default'
|
||||
'Change where your mascot is placed in relation to the post form.'
|
||||
['above post form', 'default', 'bottom']
|
||||
]
|
||||
'Mascots Overlap Posts': [
|
||||
true
|
||||
'Mascots overlap threads and posts.'
|
||||
]
|
||||
'NSFW/SFW Mascots': [
|
||||
false
|
||||
'Enable or disable mascots based on the SFW status of the board you are viewing.'
|
||||
]
|
||||
'Grayscale Mascots': [
|
||||
false
|
||||
'Force mascots to be monochrome.'
|
||||
]
|
||||
'Mascot Opacity': [
|
||||
'1.00'
|
||||
'Make Mascots transparent.'
|
||||
'text'
|
||||
]
|
||||
'Hide Mascots on Catalog': [
|
||||
false
|
||||
'Do not show mascots on the official catalog pages.'
|
||||
]
|
||||
|
||||
Navigation:
|
||||
'Boards Navigation': [
|
||||
'sticky top'
|
||||
'The position of 4chan board navigation'
|
||||
['sticky top', 'sticky bottom', 'top', 'hide']
|
||||
]
|
||||
'Navigation Alignment': [
|
||||
'center'
|
||||
'Change the text alignment of the navigation.'
|
||||
['left', 'center', 'right']
|
||||
]
|
||||
'Slideout Navigation': [
|
||||
'compact'
|
||||
'How the slideout navigation will be displayed.'
|
||||
['compact', 'list', 'hide']
|
||||
]
|
||||
'Pagination': [
|
||||
'sticky bottom'
|
||||
'The position of 4chan page navigation'
|
||||
['sticky top', 'sticky bottom', 'top', 'bottom', 'on side', 'hide']
|
||||
]
|
||||
'Pagination Alignment': [
|
||||
'center'
|
||||
'Change the text alignment of the pagination.'
|
||||
['left', 'center', 'right']
|
||||
]
|
||||
'Hide Navigation Decorations': [
|
||||
false
|
||||
'Hide non-link text in the board navigation and pagination. This also disables the delimiter in <code>Custom Navigation</code>'
|
||||
]
|
||||
|
||||
'Post Form':
|
||||
'Compact Post Form Inputs': [
|
||||
true
|
||||
'Use compact inputs on the post form.'
|
||||
]
|
||||
'Hide Show Post Form': [
|
||||
false
|
||||
'Hides the "Show Post Form" button when Persistent QR is disabled.'
|
||||
]
|
||||
'Show Post Form Header': [
|
||||
false
|
||||
'Force the Post Form to have a header.'
|
||||
]
|
||||
'Post Form Style': [
|
||||
'tabbed slideout'
|
||||
'How the post form will sit on the page.'
|
||||
['fixed', 'slideout', 'tabbed slideout', 'transparent fade', 'float']
|
||||
]
|
||||
'Post Form Slideout Transitions' : [
|
||||
true
|
||||
'Animate slideouts for the post form.'
|
||||
]
|
||||
'Post Form Decorations': [
|
||||
false
|
||||
'Add a border and background to the post form (does not apply to the "float" post form style.'
|
||||
]
|
||||
'Textarea Resize': [
|
||||
'vertical'
|
||||
'Options to resize the post form\'s comment box.'
|
||||
['both', 'horizontal', 'vertical', 'none']
|
||||
]
|
||||
'Tripcode Hider': [
|
||||
true
|
||||
'Intelligent name field hiding.'
|
||||
]
|
||||
|
||||
filter:
|
||||
name: """
|
||||
# Filter any namefags:
|
||||
@ -500,3 +850,8 @@ http://www.google.com/searchbyimage?image_url=%turl
|
||||
'Increase the intervals between updates on threads without new posts.'
|
||||
]
|
||||
'Interval': 30
|
||||
|
||||
embedWidth: 640
|
||||
embedHeight: 390
|
||||
theme : 'Yotsuba B'
|
||||
mascot : ''
|
||||
|
||||
@ -166,7 +166,7 @@ CatalogLinks =
|
||||
|
||||
ready: ->
|
||||
if catalogLink = ($('.pages.cataloglink a', d.body) or $ '[href=".././catalog"]', d.body)
|
||||
if !g.VIEW is thread
|
||||
if !g.VIEW is 'thread'
|
||||
$.add d.body, catalogLink
|
||||
catalogLink.id = 'catalog'
|
||||
|
||||
|
||||
2756
src/globals.coffee
2756
src/globals.coffee
File diff suppressed because it is too large
Load Diff
@ -342,6 +342,11 @@ Main =
|
||||
# c.time 'All initializations'
|
||||
initFeatures
|
||||
'Polyfill': Polyfill
|
||||
'Emoji': Emoji
|
||||
'Style': Style
|
||||
'Rice': Rice
|
||||
'Banner': Banner
|
||||
'Announcements': GlobalMessage
|
||||
'Header': Header
|
||||
'Catalog Links': CatalogLinks
|
||||
'Settings': Settings
|
||||
@ -403,10 +408,6 @@ Main =
|
||||
location.href = href or "/#{g.BOARD}/"
|
||||
return
|
||||
|
||||
unless $.hasClass doc, 'fourchan-x'
|
||||
# Something might have gone wrong!
|
||||
Main.initStyle()
|
||||
|
||||
if board = $ '.board'
|
||||
threads = []
|
||||
posts = []
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user