2918 lines
59 KiB
CSS
2918 lines
59 KiB
CSS
/* Cleanup */
|
|
#absbot,
|
|
#boardNavDesktop,
|
|
#delPassword,
|
|
#delform > hr:last-of-type,
|
|
#navbotright,
|
|
#postForm,
|
|
#search-label,
|
|
#search-label-bottom,
|
|
#styleSwitcher,
|
|
#togglePostFormLink,
|
|
.boardBanner > div,
|
|
.next form,
|
|
.next span,
|
|
.postingMode,
|
|
.prev form,
|
|
.prev span,
|
|
.riced,
|
|
.sideArrows,
|
|
.stylechanger,
|
|
body > br,
|
|
body > div[style^="text-align"],
|
|
body > hr {
|
|
display: none;
|
|
}
|
|
/* Empties */
|
|
#qr .warning:empty,
|
|
#qr-thread-select:empty {
|
|
display: none;
|
|
}
|
|
/* File Name Trunctuate / /p/ exif */
|
|
.exif,
|
|
.file-info:hover .fntrunc,
|
|
.file-info:not(:hover) .fnfull {
|
|
display: none;
|
|
}
|
|
/* Unnecessary */
|
|
#qp input,
|
|
#qp .rice,
|
|
.inline .rice,
|
|
.mobile {
|
|
display: none !important;
|
|
}
|
|
/* Hidden Content */
|
|
.forwarded,
|
|
.hidden,
|
|
.hidden_thread ~ div,
|
|
.hidden_thread ~ a,
|
|
.replyContainer .stub ~ div,
|
|
.replyContainer .stub ~ a,
|
|
.stub + div,
|
|
.thread > .stub:first-child ~ .postContainer,
|
|
.thread > .stub:first-child ~ .summary,
|
|
[hidden] {
|
|
display: none !important;
|
|
}
|
|
/* Hidden UI */
|
|
#navtopright,
|
|
#svg_filters,
|
|
.cataloglink {
|
|
z-index: 7;
|
|
position: fixed;
|
|
top: 100%;
|
|
left: 100%;
|
|
}
|
|
/* Hide last horizontal rule, keep clear functionality. */
|
|
.board > hr:last-of-type {
|
|
visibility: hidden;
|
|
}
|
|
/* Fappe Tyme */
|
|
.fappeTyme .thread > .noFile,
|
|
.fappeTyme .threadContainer > .noFile {
|
|
display: none;
|
|
}
|
|
/* Werk Tyme */
|
|
.werkTyme .post .file {
|
|
display: none;
|
|
}
|
|
/* Index Features */
|
|
#index-menu {
|
|
display: flex;
|
|
<%= align %>-items: center
|
|
}
|
|
:root.thread #index-menu,
|
|
:root.index-loading .navLinks,
|
|
:root.index-loading .board,
|
|
:root.index-loading .pagelist,
|
|
:root.thread .pagelist {
|
|
display: none;
|
|
}
|
|
:root:not(.catalog-mode) #index-size,
|
|
:root:not(.catalog-mode) #index-size + .selectrice,
|
|
.index:not(.catalog-mode) #returnIcon,
|
|
.index.catalog-mode #catalogIcon {
|
|
display: none;
|
|
}
|
|
#index-menu .selectrice {
|
|
width: 110px;
|
|
display: inline-block;
|
|
}
|
|
#index-search {
|
|
padding-right: 1.5em;
|
|
width: 100px;
|
|
transition: color .25s, border-color .25s, width .25s;
|
|
}
|
|
#index-search:focus,
|
|
#index-search[data-searching] {
|
|
width: 200px;
|
|
}
|
|
#index-search-clear {
|
|
margin-left: -1em;
|
|
}
|
|
<% if (type === 'crx') { %>
|
|
/* ``::-webkit-*'' selectors break selector lists on Firefox. */
|
|
#index-search::-webkit-search-cancel-button,
|
|
<% } %>
|
|
#index-search:not([data-searching]) + #index-search-clear {
|
|
display: none;
|
|
}
|
|
.catalog-mode .board {
|
|
text-align: center;
|
|
}
|
|
.catalog-thread {
|
|
display: inline-flex;
|
|
text-align: left;
|
|
flex-direction: column;
|
|
<%= align %>-items: center;
|
|
margin: 0 2px 5px;
|
|
word-break: break-word;
|
|
vertical-align: top;
|
|
}
|
|
.catalog-small .catalog-thread {
|
|
width: 165px;
|
|
max-height: 320px;
|
|
}
|
|
.catalog-large .catalog-thread {
|
|
width: 270px;
|
|
max-height: 410px;
|
|
}
|
|
.catalog-thread .thumb {
|
|
flex-shrink: 0;
|
|
-webkit-flex-shrink: 0;
|
|
position: relative;
|
|
}
|
|
.catalog-thumb {
|
|
border-radius: 2px;
|
|
box-shadow: 0 0 5px rgba(0, 0, 0, .25);
|
|
}
|
|
.catalog-thumb.spoiler-file {
|
|
width: 100px;
|
|
height: 100px;
|
|
}
|
|
.catalog-thumb.deleted-file {
|
|
width: 127px;
|
|
height: 13px;
|
|
padding: 20px 11px;
|
|
}
|
|
.catalog-thumb.no-file {
|
|
width: 77px;
|
|
height: 13px;
|
|
padding: 20px 36px;
|
|
}
|
|
.catalog-icons > img {
|
|
width: 1em;
|
|
height: 1em;
|
|
margin: 0;
|
|
vertical-align: text-top;
|
|
}
|
|
.thumb:not(:hover):not(:focus) > .menu-button:not(.open):not(:focus) > i {
|
|
display: none;
|
|
}
|
|
.thumb > .menu-button {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
}
|
|
.thumb > .menu-button > i {
|
|
width: 1em;
|
|
height: 1em;
|
|
padding: 1px;
|
|
border-radius: 0 2px 0 2px;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
<% if (type === 'userscript') { %>
|
|
line-height: normal;
|
|
<% } %>
|
|
}
|
|
.catalog-stats {
|
|
flex-shrink: 0;
|
|
cursor: help !important;
|
|
font-size: 10px;
|
|
font-weight: 700;
|
|
margin-top: 2px;
|
|
}
|
|
.catalog-thread > .subject {
|
|
flex-shrink: 0;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
text-align: center;
|
|
}
|
|
.catalog-thread > .comment {
|
|
flex-shrink: 1;
|
|
align-self: stretch;
|
|
overflow: hidden;
|
|
text-align: center;
|
|
}
|
|
.thread-info {
|
|
position: fixed;
|
|
padding: 2px;
|
|
border-radius: 2px;
|
|
box-shadow: 0 0 5px rgba(0, 0, 0, .25);
|
|
}
|
|
.thread-info .post {
|
|
margin: 0;
|
|
}
|
|
/* Defaults */
|
|
a {
|
|
text-decoration: none;
|
|
outline: none;
|
|
}
|
|
.underline-links a {
|
|
text-decoration: underline;
|
|
}
|
|
body,
|
|
html {
|
|
min-height: 100%;
|
|
box-sizing: border-box;
|
|
}
|
|
body {
|
|
outline: none;
|
|
min-height: 100%;
|
|
}
|
|
.editTheme {
|
|
margin-left: 300px;
|
|
}
|
|
.sidebar-hide body {
|
|
margin: 0 2px;
|
|
}
|
|
.sidebar-minimal body {
|
|
margin: 0 20px;
|
|
}
|
|
.sidebar-normal body {
|
|
margin: 0 252px
|
|
}
|
|
.sidebar-large body {
|
|
margin: 0 303px;
|
|
}
|
|
.sidebar-location-right body {
|
|
margin-left: 2px;
|
|
}
|
|
.sidebar-location-left body {
|
|
margin-right: 2px;
|
|
}
|
|
body.unscroll {
|
|
overflow: hidden;
|
|
}
|
|
.fourchan-ss-sidebar body::before {
|
|
content: '';
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
box-sizing: border-box;
|
|
display: block;
|
|
z-index: 0;
|
|
}
|
|
.fourchan-ss-sidebar.sidebar-large body::before {
|
|
width: 306px;
|
|
}
|
|
.fourchan-ss-sidebar.sidebar-normal body::before {
|
|
width: 255px;
|
|
}
|
|
.fourchan-ss-sidebar.sidebar-minimal body::before {
|
|
width: 23px;
|
|
}
|
|
.sidebar-location-right body::before {
|
|
right: 0;
|
|
}
|
|
.sidebar-location-left body::before {
|
|
left: 0;
|
|
}
|
|
.fourchan-ss-sidebar.sidebar-location-right body {
|
|
padding-right: 2px;
|
|
}
|
|
.fourchan-ss-sidebar.sidebar-location-left body {
|
|
padding-left: 2px;
|
|
}
|
|
hr {
|
|
clear: both;
|
|
border: 0;
|
|
padding: 0;
|
|
margin: 0 0 1px;
|
|
}
|
|
.hide-horizontal-rules hr {
|
|
visibility: hidden;
|
|
}
|
|
th {
|
|
text-align: left;
|
|
}
|
|
.center {
|
|
text-align: center;
|
|
}
|
|
.ad-plea {
|
|
text-align: center;
|
|
font-size: .8em;
|
|
}
|
|
.dead-thread,
|
|
.disabled {
|
|
opacity: 0.4;
|
|
}
|
|
nav a,
|
|
.pointer {
|
|
cursor: pointer;
|
|
}
|
|
/* Symbols */
|
|
.menu-button i {
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
margin: 2px 2px 3px;
|
|
}
|
|
.brackets-wrap::before {
|
|
content: " [";
|
|
}
|
|
.brackets-wrap::after {
|
|
content: "] ";
|
|
}
|
|
/* Thread / Reply Nav */
|
|
#navPrev,
|
|
#navNext {
|
|
display: inline-block;
|
|
border-right: 6px solid transparent;
|
|
border-left: 6px solid transparent;
|
|
opacity: 0.5;
|
|
margin: 2px 1px;
|
|
width: 0;
|
|
height: 0;
|
|
}
|
|
#navPrev {
|
|
border-bottom: 11px solid rgb(130,130,130);
|
|
}
|
|
#navNext {
|
|
border-top: 11px solid rgb(130,130,130);
|
|
}
|
|
/* Header */
|
|
#header-bar {
|
|
z-index: 6;
|
|
border-width: 1px;
|
|
padding: 1px 2px;
|
|
border-style: solid;
|
|
}
|
|
.pagination-sticky-top .pagelist,
|
|
.pagination-sticky-bottom .pagelist,
|
|
#header-bar {
|
|
left: 2px;
|
|
right: 2px;
|
|
}
|
|
.navigation-alignment-center #header-bar {
|
|
text-align: center;
|
|
}
|
|
.navigation-alignment-right #header-bar {
|
|
text-align: right;
|
|
}
|
|
.sidebar-location-left.sidebar-large:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-left.sidebar-large #header-bar {
|
|
left: 303px;
|
|
}
|
|
.sidebar-location-left.sidebar-normal:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-left.sidebar-normal #header-bar {
|
|
left: 252px;
|
|
}
|
|
.sidebar-location-left.sidebar-minimal:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-left.sidebar-minimal:not(.fourchan-ss-navigation) #header-bar {
|
|
left: 20px;
|
|
}
|
|
.sidebar-location-right.sidebar-large:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-right.sidebar-large #header-bar {
|
|
right: 303px;
|
|
}
|
|
.sidebar-location-right.sidebar-normal:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-right.sidebar-normal #header-bar {
|
|
right: 252px;
|
|
}
|
|
.sidebar-location-right.sidebar-minimal:not(.pagination-on-side):not(.fourchan-ss-navigation) .pagelist,
|
|
.sidebar-location-right.sidebar-minimal:not(.fourchan-ss-navigation) #header-bar {
|
|
right: 20px;
|
|
}
|
|
.fourchan-ss-navigation .pagelist,
|
|
.fourchan-ss-navigation #header-bar {
|
|
left: 0;
|
|
right: 0;
|
|
border-left: 0;
|
|
border-right: 0;
|
|
border-radius: 0 !important;
|
|
}
|
|
.hide-navigation-decorations #board-list {
|
|
font-size: 0;
|
|
color: transparent;
|
|
}
|
|
.hide-navigation-decorations #board-list a {
|
|
margin: 0 .1em;
|
|
}
|
|
.fixed #header-bar.autohide {
|
|
z-index: 24;
|
|
}
|
|
.fixed #header-bar {
|
|
position: fixed;
|
|
}
|
|
.top-header #header-bar {
|
|
top: 0;
|
|
border-top-width: 0;
|
|
}
|
|
.rounded-edges.top-header #header-bar {
|
|
border-radius: 0 0 3px 3px;
|
|
}
|
|
.fixed.bottom-header #header-bar {
|
|
bottom: 0;
|
|
border-bottom-width: 0;
|
|
}
|
|
.rounded-edges.bottom-header #header-bar {
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
.hide #header-bar {
|
|
position: fixed;
|
|
top: 110%;
|
|
bottom: auto;
|
|
}
|
|
/* Header Autohide */
|
|
.fixed #header-bar.autohide:not(:hover) {
|
|
box-shadow: none;
|
|
transition: all .8s .6s cubic-bezier(.55, .055, .675, .19);
|
|
}
|
|
.fixed.top-header #header-bar.autohide:not(:hover) {
|
|
margin-bottom: -1em;
|
|
<%= transform %>: translateY(-100%);
|
|
}
|
|
.fixed.bottom-header #header-bar.autohide:not(:hover) {
|
|
<%= transform %>: translateY(100%);
|
|
}
|
|
#header-bar #scroll-marker {
|
|
display: none;
|
|
left: 0;
|
|
right: 0;
|
|
height: 10px;
|
|
position: absolute;
|
|
}
|
|
#header-bar:not(.autohide) #scroll-marker {
|
|
pointer-events: none;
|
|
}
|
|
.fixed #header-bar #scroll-marker {
|
|
display: block;
|
|
}
|
|
.fixed.top-header header-bar #scroll-marker {
|
|
top: 100%;
|
|
}
|
|
.fixed.bottom-header #header-bar #scroll-marker {
|
|
bottom: 100%;
|
|
}
|
|
/* Notifications */
|
|
#notifications {
|
|
z-index: 40;
|
|
position: fixed;
|
|
top: 0;
|
|
text-align: center;
|
|
right: 0;
|
|
left: 0;
|
|
height: 0;
|
|
overflow: visible;
|
|
transition: all .8s .6s cubic-bezier(.55, .055, .675, .19);
|
|
}
|
|
.fixed.top-header #header-bar #notifications {
|
|
top: 2em;
|
|
}
|
|
.notification {
|
|
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;
|
|
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,
|
|
.notification a {
|
|
color: #fff !important;
|
|
}
|
|
.notification > .close {
|
|
top: 0;
|
|
padding: 2px;
|
|
right: 4px;
|
|
position: absolute;
|
|
color: #fff;
|
|
}
|
|
.message {
|
|
box-sizing: border-box;
|
|
padding: 6px 20px;
|
|
max-height: 200px;
|
|
width: 100%;
|
|
overflow: auto;
|
|
}
|
|
/* Shortcuts */
|
|
#shortcuts {
|
|
position: fixed;
|
|
display: <%= flex %>;
|
|
top: 0;
|
|
padding: 1px;
|
|
z-index: 16;
|
|
<%= flex %>-direction: row;
|
|
max-height: 1.1em;
|
|
overflow: visible;
|
|
}
|
|
.shortcut {
|
|
margin: 0 1px;
|
|
}
|
|
.icon-orientation-vertical #a-icons .shortcut {
|
|
margin: 0;
|
|
}
|
|
#a-icons,
|
|
#a-stats {
|
|
<%= order %>: 0;
|
|
display: <%= flex %>;
|
|
text-align: center;
|
|
}
|
|
#a-icons {
|
|
<%= order %>: 10;
|
|
}
|
|
#a-stats {
|
|
height: 1.1em;
|
|
}
|
|
.sidebar-location-right #shortcuts {
|
|
right: 0;
|
|
}
|
|
.sidebar-location-left #shortcuts {
|
|
left: 0;
|
|
}
|
|
.sidebar-location-right .shortcut {
|
|
<%= align %>-self: flex-end;
|
|
}
|
|
.icon-orientation-vertical #a-icons {
|
|
<%= flex %>-direction: column;
|
|
height: 200px;
|
|
}
|
|
.icon-orientation-horizontal #a-stats {
|
|
height: 1em;
|
|
}
|
|
.icon-orientation-horizontal #a-stats,
|
|
.icon-orientation-horizontal #a-icons,
|
|
.sidebar-location-left #shortcuts {
|
|
<%= flex %>-direction: row-reverse;
|
|
}
|
|
.icon-orientation-horizontal.sidebar-location-left #a-stats,
|
|
.icon-orientation-horizontal.sidebar-location-left #a-icons {
|
|
<%= flex %>-direction: row;
|
|
}
|
|
#thread-stats {
|
|
<%= order %>: 0;
|
|
}
|
|
#updater {
|
|
<%= order %>: 10;
|
|
}
|
|
#main-menu {
|
|
<%= order %>: 0;
|
|
}
|
|
#qr-shortcut {
|
|
<%= order %>: 10;
|
|
}
|
|
#img-controls {
|
|
<%= order %>: 20;
|
|
}
|
|
#appchan-gal {
|
|
<%= order %>: 25;
|
|
}
|
|
#fappeTyme {
|
|
<%= order %>: 30;
|
|
}
|
|
#werkTyme {
|
|
<%= order %>: 35;
|
|
}
|
|
#so-nav {
|
|
<%= order %>: 40;
|
|
}
|
|
#so-watcher {
|
|
<%= order %>: 50;
|
|
}
|
|
#so-psa {
|
|
<%= order %>: 60;
|
|
}
|
|
#navPrev {
|
|
<%= order %>: 70;
|
|
}
|
|
#navNext {
|
|
<%= order %>: 80;
|
|
}
|
|
#catalogIcon {
|
|
<%= order %>: 90;
|
|
}
|
|
#returnIcon {
|
|
<%= order %>: 100;
|
|
}
|
|
.icon-orientation-horizontal #so-psa #globalMessage,
|
|
.icon-orientation-horizontal #so-watcher #thread-watcher,
|
|
.icon-orientation-horizontal #so-nav #boardNavDesktopFoot {
|
|
top: 15px !important;
|
|
}
|
|
.icon-orientation-vertical #so-psa,
|
|
.icon-orientation-vertical #so-watcher,
|
|
.icon-orientation-vertical #so-nav {
|
|
position: relative;
|
|
}
|
|
.icon-orientation-vertical #so-psa #globalMessage,
|
|
.icon-orientation-vertical #so-watcher #thread-watcher,
|
|
.icon-orientation-vertical #so-nav #boardNavDesktopFoot {
|
|
top: 0 !important;
|
|
position: absolute !important;
|
|
z-index: -1;
|
|
}
|
|
.sidebar-location-right.icon-orientation-vertical #so-psa #globalMessage,
|
|
.sidebar-location-right.icon-orientation-vertical #so-watcher #thread-watcher,
|
|
.sidebar-location-right.icon-orientation-vertical #so-nav #boardNavDesktopFoot {
|
|
padding-right: 17px;
|
|
}
|
|
.sidebar-location-left.icon-orientation-vertical #so-psa #globalMessage,
|
|
.sidebar-location-left.icon-orientation-vertical #so-watcher #thread-watcher,
|
|
.sidebar-location-left.icon-orientation-vertical #so-nav #boardNavDesktopFoot {
|
|
padding-left: 17px;
|
|
}
|
|
.a-icon,
|
|
#shortcuts .fa {
|
|
display: inline-block;
|
|
width: 15px;
|
|
height: 15px;
|
|
content: "";
|
|
opacity: 0.5;
|
|
cursor: pointer;
|
|
}
|
|
.invisible-icons .a-icon,
|
|
.invisible-icons #shortcuts .fa {
|
|
opacity: 0;
|
|
}
|
|
#so-nav,
|
|
#so-watcher,
|
|
#so-psa {
|
|
line-height: 0;
|
|
}
|
|
.shortcut > div {
|
|
line-height: normal;
|
|
}
|
|
#main-menu {
|
|
background-position: 0 0;
|
|
}
|
|
#returnIcon {
|
|
background-position: 0 -15px;
|
|
}
|
|
#so-watcher .a-icon {
|
|
background-position: 0 -30px;
|
|
}
|
|
#so-psa .a-icon {
|
|
background-position: 0 -45px;
|
|
}
|
|
#so-nav .a-icon {
|
|
background-position: 0 -60px;
|
|
}
|
|
#img-controls {
|
|
background-position: 0 -90px;
|
|
}
|
|
#catalogIcon {
|
|
background-position: 0 -120px;
|
|
}
|
|
#fappeTyme {
|
|
background-position: 0 -135px;
|
|
}
|
|
#navPrev:hover,
|
|
#navNext:hover,
|
|
.a-icon:hover,
|
|
#shortcuts .fa:hover {
|
|
opacity: 1 !important;
|
|
}
|
|
/* Updater / Thread Stats */
|
|
.float #thread-stats,
|
|
.float #updater {
|
|
position: fixed;
|
|
z-index: 25;
|
|
}
|
|
#update-status.new::after {
|
|
content: ', ';
|
|
}
|
|
/* Pagination */
|
|
.pagelist {
|
|
border-style: solid;
|
|
border-width: 1px;
|
|
z-index: 6;
|
|
}
|
|
.pagination-alignment-center .pagelist {
|
|
text-align: center;
|
|
}
|
|
.pagination-alignment-right .pagelist {
|
|
text-align: right;
|
|
}
|
|
.pagination-sticky-top .pagelist {
|
|
position: fixed;
|
|
top: 0;
|
|
border-top-width: 0;
|
|
}
|
|
.pagination-sticky-bottom .pagelist {
|
|
position: fixed;
|
|
bottom: 0;
|
|
border-bottom-width: 0;
|
|
}
|
|
.pagination-top .pagelist {
|
|
position: static;
|
|
border-top-width: 0;
|
|
}
|
|
.pagination-bottom .pagelist {
|
|
position: static;
|
|
}
|
|
.pagination-top.rounded-edges .pagelist,
|
|
.pagination-sticky-top.rounded-edges .pagelist {
|
|
border-radius: 0 0 3px 3px;
|
|
}
|
|
.pagination-bottom.rounded-edges .pagelist,
|
|
.pagination-sticky-bottom.rounded-edges .pagelist {
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
.thread .pagelist,
|
|
.pagination-hide .pagelist {
|
|
display: none;
|
|
}
|
|
.pagination-on-side .pagelist {
|
|
position: fixed;
|
|
padding: 0;
|
|
top: auto;
|
|
bottom: 0.5em;
|
|
margin: 0;
|
|
background: none transparent !important;
|
|
border: 0 none !important;
|
|
text-align: right;
|
|
}
|
|
.pagination-on-side.post-form-style-fixed.show-post-form-header .pagelist {
|
|
bottom: 23.1em;
|
|
}
|
|
.pagination-on-side.post-form-style-fixed .pagelist {
|
|
bottom: 21.6em;
|
|
}
|
|
.sidebar-location-left.pagination-on-side .pagelist {
|
|
<%= transform %>: rotate(-90deg);
|
|
<%= transform %>-origin: bottom left;
|
|
}
|
|
|
|
.sidebar-location-right.pagination-on-side .pagelist {
|
|
<%= transform %>: rotate(90deg);
|
|
<%= transform %>-origin: bottom right;
|
|
}
|
|
.sidebar-location-right.sidebar-large.pagination-on-side .pagelist {
|
|
left: auto;
|
|
right: 301px;
|
|
}
|
|
.sidebar-location-left.sidebar-large.pagination-on-side .pagelist {
|
|
right: auto;
|
|
left: 301px;
|
|
}
|
|
.sidebar-location-right.sidebar-normal.pagination-on-side .pagelist {
|
|
left: auto;
|
|
right: 246px;
|
|
}
|
|
.sidebar-location-left.sidebar-normal.pagination-on-side .pagelist {
|
|
right: auto;
|
|
left: 246px;
|
|
}
|
|
.sidebar-location-right.sidebar-minimal.pagination-on-side .pagelist {
|
|
left: auto;
|
|
right: 246px;
|
|
}
|
|
.sidebar-location-left.sidebar-minimal.pagination-on-side .pagelist {
|
|
right: auto;
|
|
left: 18px;
|
|
}
|
|
.hide-navigation-decorations .pagelist {
|
|
font-size: 0;
|
|
color: transparent;
|
|
word-spacing: 0;
|
|
}
|
|
.pagelist input,
|
|
.pagelist div {
|
|
vertical-align: middle;
|
|
}
|
|
.hide-navigation-decorations .pages a {
|
|
margin: 0 1px;
|
|
}
|
|
.next,
|
|
.pages,
|
|
.prev {
|
|
display: inline-block;
|
|
margin: 0 3px;
|
|
}
|
|
/* Icons */
|
|
.icons-4chan-ss .a-icon {
|
|
background-image: url("data:image/png;base64,<%= grunt.file.read("src/General/img/icons/4chanSS.png", {encoding: "base64"}) %>");
|
|
}
|
|
.icons-oneechan .a-icon {
|
|
background-image: url("data:image/png;base64,<%= grunt.file.read("src/General/img/icons/oneechan.png", {encoding: "base64"}) %>");
|
|
}
|
|
/* Banner & Board Title */
|
|
.boardBanner {
|
|
line-height: 0;
|
|
}
|
|
.faded-4chan-banner .boardBanner {
|
|
opacity: 0.5;
|
|
transition: opacity 0.3s ease-in-out .5s;
|
|
}
|
|
.faded-4chan-banner .boardBanner:hover {
|
|
opacity: 1;
|
|
transition: opacity 0.3s ease-in;
|
|
}
|
|
/* From 4chan SS / OneeChan */
|
|
<% if (type === 'userscript') { %>
|
|
.fourchan-banner-reflection .boardBanner::after {
|
|
background-image: -moz-element(#bannerCnt);
|
|
bottom: -100%;
|
|
content: '';
|
|
left: 0;
|
|
mask: url("data:image/svg+xml,<svg version='1.1' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient gradientUnits='objectBoundingBox' id='gradient' x2='0' y2='1'><stop stop-offset='0'/><stop stop-color='white' offset='1'/></linearGradient><mask id='mask' maskUnits='objectBoundingBox' maskContentUnits='objectBoundingBox' x='0' y='0' width='100%' height='100%'> <rect fill='url(%23gradient)' width='1' height='1' /></mask></defs></svg>#mask");
|
|
opacity: 0.3;
|
|
position: absolute;
|
|
right: 0;
|
|
top: 100%;
|
|
-moz-transform: scaleY(-1);
|
|
z-index: -1;
|
|
}
|
|
<% } else { %>
|
|
.fourchan-banner-reflection #bannerCnt {
|
|
-webkit-box-reflect: below 0 -webkit-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0) 10%, rgba(255,255,255,.5));
|
|
}
|
|
<% } %>
|
|
.fourchan-banner-at-sidebar-top .boardBanner,
|
|
.fourchan-banner-at-sidebar-bottom .boardBanner,
|
|
.fourchan-banner-at-sidebar-bottom .boardBanner {
|
|
position: fixed;
|
|
}
|
|
.fourchan-banner-at-sidebar-top .boardBanner {
|
|
top: 18px;
|
|
}
|
|
.fourchan-banner-at-sidebar-bottom .boardBanner {
|
|
bottom: 270px;
|
|
}
|
|
.fourchan-banner-under-post-form .boardBanner {
|
|
bottom: 130px;
|
|
}
|
|
.board-title-at-sidebar-top.sidebar-location-right #boardTitle,
|
|
.board-title-at-sidebar-bottom.sidebar-location-right #boardTitle,
|
|
.board-title-under-post-form.sidebar-location-right #boardTitle,
|
|
.fourchan-banner-at-sidebar-top.sidebar-location-right .boardBanner,
|
|
.fourchan-banner-at-sidebar-bottom.sidebar-location-right .boardBanner,
|
|
.fourchan-banner-under-post-form.sidebar-location-right .boardBanner {
|
|
right: 2px;
|
|
}
|
|
.board-title-at-sidebar-top.sidebar-location-left #boardTitle,
|
|
.board-title-at-sidebar-bottom.sidebar-location-left #boardTitle,
|
|
.board-title-under-post-form.sidebar-location-left #boardTitle,
|
|
.fourchan-banner-at-sidebar-top.sidebar-location-left .boardBanner,
|
|
.fourchan-banner-at-sidebar-bottom.sidebar-location-left .boardBanner,
|
|
.fourchan-banner-under-post-form.sidebar-location-left .boardBanner {
|
|
left: 2px;
|
|
}
|
|
.board-title-at-sidebar-top #boardTitle,
|
|
.board-title-at-sidebar-bottom #boardTitle,
|
|
.board-title-under-post-form #boardTitle,
|
|
.fourchan-banner-at-sidebar-top .boardBanner img,
|
|
.fourchan-banner-at-sidebar-bottom .boardBanner img,
|
|
.fourchan-banner-under-post-form .boardBanner img {
|
|
width: 248px;
|
|
}
|
|
.board-title-at-sidebar-top.sidebar-large #boardTitle,
|
|
.board-title-at-sidebar-bottom.sidebar-large #boardTitle,
|
|
.board-title-under-post-form.sidebar-large #boardTitle,
|
|
.fourchan-banner-at-sidebar-top.sidebar-large .boardBanner img,
|
|
.fourchan-banner-at-sidebar-bottom.sidebar-large .boardBanner img,
|
|
.fourchan-banner-under-post-form.sidebar-large .boardBanner img {
|
|
width: 299px;
|
|
}
|
|
.fourchan-banner-at-top .boardBanner {
|
|
position: relative;
|
|
display: table;
|
|
margin: 12px auto;
|
|
text-align: center;
|
|
}
|
|
:root:not(.board-subtitle) .boardSubtitle,
|
|
.board-title-hide #boardTitle,
|
|
.fourchan-banner-hide .boardBanner {
|
|
display: none;
|
|
}
|
|
#boardTitle {
|
|
text-align: center;
|
|
z-index: 4;
|
|
}
|
|
.board-title-at-sidebar-top #boardTitle,
|
|
.board-title-at-sidebar-bottom #boardTitle,
|
|
.board-title-under-post-form #boardTitle {
|
|
position: fixed;
|
|
}
|
|
.board-title-at-sidebar-top.fourchan-banner-at-sidebar-top.sidebar-large #boardTitle {
|
|
top: 121px;
|
|
}
|
|
.board-title-at-sidebar-top.fourchan-banner-at-sidebar-top #boardTitle {
|
|
top: 104px;
|
|
}
|
|
.board-title-at-sidebar-top #boardTitle {
|
|
top: 40px;
|
|
}
|
|
.board-title-at-sidebar-bottom #boardTitle {
|
|
bottom: 280px;
|
|
}
|
|
.board-title-under-post-form #boardTitle {
|
|
bottom: 140px;
|
|
}
|
|
/* Hover UI */
|
|
.move {
|
|
cursor: pointer;
|
|
}
|
|
#ihover {
|
|
position: fixed;
|
|
max-height: 94vh;
|
|
max-width: 75vw;
|
|
z-index: 22;
|
|
}
|
|
#qp {
|
|
position: fixed;
|
|
z-index: 22;
|
|
}
|
|
#qp .postMessage::after {
|
|
clear: both;
|
|
display: block;
|
|
content: "";
|
|
}
|
|
#qp .full-image {
|
|
max-height: 300px;
|
|
max-width: 500px;
|
|
}
|
|
#menu {
|
|
position: fixed;
|
|
outline: none;
|
|
z-index: 27;
|
|
}
|
|
|
|
/* Embedding */
|
|
#embedding {
|
|
z-index: 11;
|
|
padding: 1px 4px 1px 4px;
|
|
position: fixed;
|
|
}
|
|
#embedding.empty {
|
|
display: none;
|
|
}
|
|
#embedding > div:first-child {
|
|
display: flex;
|
|
}
|
|
#embedding .move {
|
|
flex: 1;
|
|
}
|
|
#embedding .jump {
|
|
margin: -1px 4px;
|
|
text-decoration: none;
|
|
}
|
|
/* Image Expansion */
|
|
.fit-width .full-image {
|
|
max-width: 100%;
|
|
}
|
|
.gecko.fit-width .full-image {
|
|
width: 100%;
|
|
}
|
|
.fit-height .full-image {
|
|
max-height: 95vh;
|
|
}
|
|
.images-overlap-post-form .full-image {
|
|
position: relative;
|
|
z-index: 21;
|
|
}
|
|
/* Delete Buttons */
|
|
.hide-delete-ui .deleteform,
|
|
.hide-delete-ui .post:not(#exlinks-options) .rice {
|
|
display: none;
|
|
}
|
|
.post-form-style-slideup .deleteform::before,
|
|
.post-form-style-tabbed-slideup .deleteform::before,
|
|
.post-form-style-slideup .deleteform:hover,
|
|
.post-form-style-tabbed-slideup .deleteform:hover {
|
|
bottom: 0px !important;
|
|
}
|
|
.post-form-style-slideup .deleteform,
|
|
.post-form-style-tabbed-slideup .deleteform {
|
|
bottom: -50px !important;
|
|
}
|
|
.post-form-style-slideup .deleteform::before,
|
|
.post-form-style-tabbed-slideup .deleteform::before,
|
|
.post-form-style-slideup .deleteform,
|
|
.post-form-style-tabbed-slideup .deleteform {
|
|
right: 255px !important;
|
|
}
|
|
.deleteform {
|
|
position: fixed;
|
|
z-index: 18;
|
|
width: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
border-width: 1px 0 0 1px;
|
|
border-style: solid;
|
|
font-size: 0;
|
|
color: transparent;
|
|
}
|
|
.deleteform:hover {
|
|
width: auto;
|
|
}
|
|
.deleteform::before {
|
|
z-index: 18;
|
|
border-width: 1px 0 0 1px;
|
|
border-style: solid;
|
|
content: '\uf00d';
|
|
font-family: FontAwesome;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
text-decoration: inherit;
|
|
-webkit-font-smoothing: antialiased;
|
|
font-size:14px !important;
|
|
display: block;
|
|
position: fixed;
|
|
bottom: 0;
|
|
right: 0;
|
|
box-sizing: border-box;
|
|
height: 1.6em;
|
|
width: 1.4em;
|
|
text-align: center;
|
|
}
|
|
.deleteform:hover::before {
|
|
display: none;
|
|
}
|
|
.deleteform input {
|
|
margin: 0 1px 0 0;
|
|
}
|
|
/* Slideout Navigation */
|
|
#boardNavDesktopFoot {
|
|
position: fixed;
|
|
text-align: center;
|
|
font-size: 0;
|
|
color: transparent;
|
|
overflow-x: hidden;
|
|
overflow-y: auto;
|
|
box-sizing: border-box;
|
|
width: 248px;
|
|
}
|
|
.sidebar-large #boardNavDesktopFoot {
|
|
width: 299px;
|
|
}
|
|
.sidebar-location-right #boardNavDesktopFoot {
|
|
right: 2px;
|
|
}
|
|
.sidebar-location-left #boardNavDesktopFoot {
|
|
left: 2px;
|
|
}
|
|
#so-nav:hover #boardNavDesktopFoot {
|
|
display: block;
|
|
}
|
|
#boardNavDesktopFoot {
|
|
display: none;
|
|
padding: 2px;
|
|
}
|
|
.slideout-navigation-hide #so-nav {
|
|
display: none;
|
|
}
|
|
.slideout-navigation-compact #boardNavDesktopFoot {
|
|
word-spacing: 1px;
|
|
}
|
|
.slideout-navigation-list #boardNavDesktopFoot a {
|
|
display: block;
|
|
}
|
|
.slideout-navigation-list #boardNavDesktopFoot {
|
|
max-height: 400px;
|
|
}
|
|
.slideout-navigation-list #boardNavDesktopFoot a::after {
|
|
content: ' - ' attr(title);
|
|
}
|
|
.slideout-navigation-list #boardNavDesktopFoot a[href*='//boards.4chan.org/']::after,
|
|
.slideout-navigation-list #boardNavDesktopFoot a[href*='//rs.4chan.org/']::after {
|
|
content: '/ - ' attr(title);
|
|
}
|
|
.slideout-navigation-list #boardNavDesktopFoot a[href*='//boards.4chan.org/']::before,
|
|
.slideout-navigation-list #boardNavDesktopFoot a[href*='//rs.4chan.org/']::before {
|
|
content: '/';
|
|
}
|
|
.slideout-navigation-hide #boardNavDesktopFoot {
|
|
display: none;
|
|
}
|
|
/* Watcher */
|
|
#thread-watcher {
|
|
position: fixed;
|
|
z-index: 14;
|
|
padding: 2px;
|
|
}
|
|
#thread-watcher {
|
|
width: 200px;
|
|
}
|
|
#thread-watcher:not(:hover) {
|
|
max-height: 200px;
|
|
overflow: hidden;
|
|
}
|
|
.rounded-edges #thread-watcher {
|
|
border-radius: 3px;
|
|
}
|
|
#watched-threads > div {
|
|
max-height: 1.3em;
|
|
overflow: hidden;
|
|
}
|
|
.slideout-watcher #thread-watcher {
|
|
box-sizing: border-box;
|
|
width: 248px;
|
|
}
|
|
.slideout-watcher.sidebar-large #boardNavDesktopFoot {
|
|
width: 299px;
|
|
}
|
|
.slideout-watcher.sidebar-location-right #thread-watcher {
|
|
left: auto !important;
|
|
right: 2px !important;
|
|
}
|
|
.slideout-watcher.sidebar-location-left #thread-watcher {
|
|
right: auto !important;
|
|
left: 2px !important;
|
|
}
|
|
.slideout-watcher #thread-watcher .move {
|
|
cursor: default;
|
|
}
|
|
.slideout-watcher.underline-links #thread-watcher .move {
|
|
text-decoration: underline;
|
|
}
|
|
.slideout-watcher #thread-watcher > div {
|
|
overflow: hidden;
|
|
}
|
|
.slideout-watcher #so-watcher:hover #thread-watcher {
|
|
display: block;
|
|
}
|
|
.slideout-watcher #thread-watcher {
|
|
display: none;
|
|
overflow-y: auto;
|
|
text-align: left;
|
|
}
|
|
.watch-thread-link {
|
|
padding-top: 18px;
|
|
width: 18px;
|
|
height: 0px;
|
|
display: inline-block;
|
|
background-repeat: no-repeat;
|
|
opacity: 0.2;
|
|
position: relative;
|
|
top: 1px;
|
|
}
|
|
.watch-thread-link.watched {
|
|
opacity: 1;
|
|
}
|
|
/* Announcements */
|
|
#globalMessage {
|
|
text-align: center;
|
|
}
|
|
.rounded-edges #globalMessage {
|
|
border-radius: 3px;
|
|
}
|
|
.announcements-slideout #globalMessage {
|
|
position: fixed;
|
|
padding: 2px;
|
|
width: 248px;
|
|
}
|
|
.announcements-slideout.sidebar-location-right #globalMessage {
|
|
left: auto;
|
|
right: 2px;
|
|
}
|
|
.announcements-slideout.sidebar-location-left #globalMessage {
|
|
right: auto;
|
|
left: 2px;
|
|
}
|
|
.announcements-slideout.sidebar-large #globalMessage {
|
|
width: 299px;
|
|
}
|
|
.announcements-slideout #globalMessage h3 {
|
|
margin: 0;
|
|
}
|
|
.announcements-slideout #globalMessage {
|
|
box-sizing: border-box;
|
|
display: none;
|
|
}
|
|
.announcements-slideout #so-psa:hover #globalMessage {
|
|
display: block;
|
|
}
|
|
.announcements-hide #globalMessage {
|
|
display: none !important;
|
|
}
|
|
/* Threads */
|
|
#threads,
|
|
.rounded-edges .board > .thread {
|
|
border-radius: 4px;
|
|
}
|
|
/* Thread Clearfix */
|
|
.thread > .threadContainer:last-of-type::after {
|
|
display: block;
|
|
content: ' ';
|
|
clear: both;
|
|
}
|
|
/* Posts */
|
|
.expanding {
|
|
opacity: .5;
|
|
}
|
|
.expanded-image > .post > .file > .fileThumb > img[data-md5],
|
|
.expanded-image > .post > .file > .fileThumb > video[data-md5],
|
|
.post > .file > .fileThumb > .full-image,
|
|
.post > .file > .full-image {
|
|
display: none;
|
|
}
|
|
.expanded-image > .post > .file > .fileThumb > .full-image,
|
|
.expanded-image > .post > .file > .full-image {
|
|
display: block;
|
|
}
|
|
.thread > .replyContainer:last-of-type .post {
|
|
margin-bottom: 0;
|
|
}
|
|
.menu-button {
|
|
position: relative;
|
|
}
|
|
.post .menu-button,
|
|
.hide-post-button,
|
|
.show-post-button span {
|
|
float: right;
|
|
}
|
|
.post .menu-button,
|
|
.hide-post-button {
|
|
margin: 0 3px;
|
|
opacity: 0;
|
|
transition: opacity .3s ease-out 0s;
|
|
}
|
|
.post:hover .hide-post-button,
|
|
.post:hover .menu-button,
|
|
.inline .hide-post-button,
|
|
.inline .menu-button {
|
|
opacity: 1;
|
|
}
|
|
.posteruid .painted {
|
|
padding: .1em .3em;
|
|
border-radius: 1em;
|
|
font-size: 80%;
|
|
}
|
|
.hand {
|
|
cursor: pointer;
|
|
}
|
|
div.post div.postInfo {
|
|
padding: 1px 3px;
|
|
display: block !important;
|
|
}
|
|
.postInfo > span {
|
|
vertical-align: bottom;
|
|
}
|
|
.bolds .subject,
|
|
.bolds .name {
|
|
font-weight: 600;
|
|
}
|
|
.italics .postertrip {
|
|
font-style: italic;
|
|
}
|
|
.underline-links .replylink {
|
|
text-decoration: underline;
|
|
}
|
|
.reply .fileText {
|
|
padding: 0 3px;
|
|
}
|
|
.compact-file-text .fileText {
|
|
font-size: .9em;
|
|
}
|
|
.fileThumb {
|
|
float: left;
|
|
margin: 3px 20px;
|
|
outline: none;
|
|
}
|
|
.reply.post {
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
}
|
|
.replyContainer {
|
|
display: <%= flex %>;
|
|
}
|
|
.fit-width-replies .reply.post {
|
|
<%= flex %>: 1 0;
|
|
}
|
|
.fit-width-replies .expanded-image .reply.post,
|
|
.fit-width-replies .hasInline .reply.post {
|
|
width: 100%;
|
|
}
|
|
.indent-replies #unread-line,
|
|
.indent-replies .thread > .replyContainer,
|
|
.indent-replies .threadContainer > .replyContainer {
|
|
margin-left: 2em;
|
|
}
|
|
.rounded-edges .post {
|
|
border-radius: 3px;
|
|
}
|
|
.spoiler,
|
|
s {
|
|
text-decoration: none;
|
|
}
|
|
/* OP */
|
|
.watch-thread-link {
|
|
vertical-align: bottom;
|
|
}
|
|
.op-background .op.post {
|
|
box-sizing: border-box;
|
|
}
|
|
<% if (type === 'userscript') { %>
|
|
/* Force Reply Break */
|
|
.op-background .op.post .postMessage::after,
|
|
.force-reply-break <% } %>.op.post .postMessage::after {
|
|
display: block;
|
|
content: ' ';
|
|
clear: both;
|
|
}
|
|
/* Summary */
|
|
<% if (type === 'userscript') { %>.force-reply-break <% } %>.summary {
|
|
clear: both;
|
|
}
|
|
/* Inlined */
|
|
.inline {
|
|
margin: 2px 8px 2px 2px;
|
|
}
|
|
.post .inline {
|
|
margin: 2px;
|
|
}
|
|
.inline .replyContainer {
|
|
display: inline-block;
|
|
}
|
|
/* Quotes */
|
|
.inlined {
|
|
opacity: .5;
|
|
}
|
|
.underline-links .quotelink {
|
|
text-decoration: underline;
|
|
}
|
|
.filtered,
|
|
.quotelink.filtered {
|
|
text-decoration: line-through !important;
|
|
}
|
|
.inline + .hashlink {
|
|
display: none;
|
|
}
|
|
.hashlink::before {
|
|
content: '\\00a0';
|
|
}
|
|
/* Quote Threading */
|
|
.threadContainer {
|
|
padding-left: 2em;
|
|
border-left: 1px solid;
|
|
}
|
|
.indent-replies .threadContainer {
|
|
margin-left: 2em;
|
|
padding-left: 0;
|
|
}
|
|
.threadOP {
|
|
clear: both;
|
|
}
|
|
/* Backlinks */
|
|
.underline-links .forwardlink,
|
|
.underline-links .backlink {
|
|
text-decoration: underline;
|
|
}
|
|
.backlink.dead {
|
|
text-decoration: none;
|
|
}
|
|
.backlink-container .filtered {
|
|
display: none;
|
|
}
|
|
.backlinks-position-lower-left .backlink-container,
|
|
.backlinks-position-lower-right .backlink-container {
|
|
max-width: 100%;
|
|
padding: 0 5px;
|
|
}
|
|
.backlinks-position-lower-left .reply.quoted,
|
|
.backlinks-position-lower-right .reply.quoted {
|
|
position: relative;
|
|
padding-bottom: 1.7em;
|
|
}
|
|
.backlinks-position-lower-left .inline .reply.quoted,
|
|
.backlinks-position-lower-right .inline .reply.quoted,
|
|
.backlinks-position-lower-right #qp .reply.quoted,
|
|
.backlinks-position-lower-left #qp .reply.quoted {
|
|
position: static;
|
|
padding-bottom: 0;
|
|
}
|
|
.backlinks-position-lower-right .reply .backlink-container,
|
|
.backlinks-position-lower-left .reply .backlink-container {
|
|
position: absolute;
|
|
bottom: 0;
|
|
padding: 0 5px;
|
|
}
|
|
.backlinks-position-lower-left .reply .backlink-container {
|
|
left: 0;
|
|
}
|
|
.backlinks-position-lower-right .reply .backlink-container {
|
|
right: 0;
|
|
}
|
|
.backlinks-position-lower-right .backlink-container::before,
|
|
.backlinks-position-lower-left .reply .backlink-container::before {
|
|
content: 'REPLIES: ';
|
|
}
|
|
.backlink-container:empty {
|
|
display: none;
|
|
}
|
|
.backlinks-position-lower-left #qp .backlink-container,
|
|
.backlinks-position-lower-left .inline .backlink-container,
|
|
.backlinks-position-lower-right .inline .backlink-container,
|
|
.backlinks-position-lower-right #qp .backlink-container {
|
|
position: static;
|
|
max-width: 100%;
|
|
}
|
|
.backlinks-position-lower-left #qp .backlink-container::before,
|
|
.backlinks-position-lower-left .inline .backlink-container::before,
|
|
.backlinks-position-lower-right #qp .backlink-container::before,
|
|
.backlinks-position-lower-right .inline .backlink-container::before {
|
|
content: '';
|
|
}
|
|
.backlinks-position-lower-right .inline .backlink-container {
|
|
float: none;
|
|
}
|
|
/* Fixes text spoilers */
|
|
.remove-spoilers.reveal-spoilers .spoiler::before,
|
|
.remove-spoilers.reveal-spoilers s::before {
|
|
content: '[spoiler]';
|
|
}
|
|
.remove-spoilers.reveal-spoilers .spoiler::after,
|
|
.remove-spoilers.reveal-spoilers s::after {
|
|
content: '[/spoiler]';
|
|
}
|
|
:root:not(.remove-spoilers).reveal-spoilers .spoilers:not(:hover),
|
|
:root:not(.remove-spoilers).reveal-spoilers s:not(:hover) {
|
|
color: white !important;
|
|
}
|
|
:root:not(.remove-spoilers) .spoiler:not(:hover) *,
|
|
:root:not(.remove-spoilers) s:not(:hover) * {
|
|
color: rgb(0,0,0) !important;
|
|
text-shadow: none !important;
|
|
}
|
|
:root:not(.remove-spoilers) spoiler:not(:hover),
|
|
:root:not(.remove-spoilers) s:not(:hover) {
|
|
background-color: rgb(0,0,0);
|
|
color: rgb(0,0,0) !important;
|
|
text-shadow: none !important;
|
|
}
|
|
/* Code */
|
|
.prettyprint {
|
|
box-sizing: border-box;
|
|
font-family: monospace;
|
|
display: inline-block;
|
|
margin: 0 auto .1em 0;
|
|
vertical-align: middle;
|
|
white-space: pre-wrap;
|
|
border-radius: 2px;
|
|
overflow-x: auto;
|
|
padding: 3px;
|
|
max-width: 100%;
|
|
}
|
|
/* Menu */
|
|
.entry {
|
|
border-bottom: 1px solid rgba(0,0,0,.25);
|
|
cursor: pointer;
|
|
display: block;
|
|
outline: none;
|
|
padding: 3px 1em 3px 7px;
|
|
position: relative;
|
|
text-decoration: none;
|
|
white-space: nowrap;
|
|
}
|
|
.entry:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
.has-submenu::after {
|
|
content: "\uf141";
|
|
display: inline-block;
|
|
margin: .3em;
|
|
position: absolute;
|
|
right: .2em;
|
|
}
|
|
.submenu {
|
|
display: none;
|
|
position: absolute;
|
|
top: -1px;
|
|
}
|
|
.focused > .submenu {
|
|
display: block;
|
|
}
|
|
/* Stubs */
|
|
.fit-width-replies .stub {
|
|
display: block;
|
|
text-align: right;
|
|
clear: both;
|
|
}
|
|
/* Element Replacing: */
|
|
/* Checkboxes */
|
|
.rice {
|
|
cursor: pointer;
|
|
width: .7em;
|
|
height: .7em;
|
|
margin: 2px 3px;
|
|
display: inline-block;
|
|
vertical-align: bottom;
|
|
}
|
|
input[type=checkbox]:checked + .rice {
|
|
position: relative;
|
|
}
|
|
input[type=checkbox]:checked + .rice::after {
|
|
content: "";
|
|
display: block;
|
|
width: 4px;
|
|
height: 10px;
|
|
border-width: 0 3px 3px 0;
|
|
border-style: solid;
|
|
<%= transform %>: rotate(45deg);
|
|
position: absolute;
|
|
left: 2px;
|
|
bottom: -1px;
|
|
}
|
|
.rounded-edges .rice {
|
|
border-radius: 2px;
|
|
}
|
|
.circle-checkboxes .rice {
|
|
border-radius: 6px;
|
|
}
|
|
input:checked + .rice {
|
|
background-attachment: scroll;
|
|
background-repeat: no-repeat;
|
|
background-position: bottom right;
|
|
}
|
|
/* Selects */
|
|
.selectrice {
|
|
position: relative;
|
|
cursor: default;
|
|
overflow: hidden;
|
|
text-align: left;
|
|
}
|
|
#settings .selectrice {
|
|
display: inline-block;
|
|
}
|
|
.selectrice::after {
|
|
content: "";
|
|
border-right: .25em solid transparent;
|
|
border-left: .25em solid transparent;
|
|
position: absolute;
|
|
right: .4em;
|
|
top: .5em;
|
|
}
|
|
.selectrice::before {
|
|
content: "";
|
|
height: 1.6em;
|
|
position: absolute;
|
|
right: 1.3em;
|
|
top: 0;
|
|
}
|
|
/* Select Dropdown */
|
|
#selectrice {
|
|
padding: 0;
|
|
margin: 0;
|
|
position: fixed;
|
|
max-height: 120px;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
z-index: 32;
|
|
}
|
|
#selectrice:empty {
|
|
display: none;
|
|
}
|
|
/* Post Form Shortcut */
|
|
.qr-shortcut.on-page {
|
|
font-size: 250%;
|
|
}
|
|
/* Post Form */
|
|
#qr {
|
|
z-index: 20;
|
|
position: fixed;
|
|
background: none;
|
|
border: none;
|
|
padding: 1px;
|
|
min-width: 248px;
|
|
background: transparent;
|
|
border: 1px solid transparent;
|
|
}
|
|
.sidebar-large #qr {
|
|
min-width: 299px;
|
|
}
|
|
.rounded-edges #qr,
|
|
.rounded-edges #qrtab {
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
.post-form-style-fixed #qr {
|
|
top: auto !important;
|
|
}
|
|
.sidebar-location-left:not(.post-form-style-float) #qr {
|
|
left: 0 !important;
|
|
right: auto !important;
|
|
}
|
|
.sidebar-location-right:not(.post-form-style-float) #qr {
|
|
right: 0 !important;
|
|
left: auto !important;
|
|
}
|
|
:root:not(.post-form-style-float) #qr {
|
|
bottom: 0 !important;
|
|
}
|
|
.fourchan-ss-navigation.fixed.bottom-header:not(.post-form-style-float):not(.post-form-style-slideup):not(.post-form-style-tabbed-slideup) #qr,
|
|
.fourchan-ss-navigation.index.pagination-sticky-bottom:not(.post-form-style-float):not(.post-form-style-slideup):not(.post-form-style-tabbed-slideup) #qr {
|
|
bottom: 1.5em !important;
|
|
}
|
|
.post-form-style-slideup #qr,
|
|
.post-form-style-slideout #qr {
|
|
top: auto !important;
|
|
}
|
|
.post-form-style-slideup #qr {
|
|
<%= transform %>: translateY(93%);
|
|
}
|
|
.post-form-style-slideout.sidebar-location-left #qr {
|
|
<%= transform %>: translateX(-93%);
|
|
}
|
|
.post-form-style-slideout.sidebar-location-right #qr {
|
|
<%= transform %>: translateX(93%);
|
|
}
|
|
.post-form-style-slideup #qr:hover,
|
|
.post-form-style-slideup #qr.focus,
|
|
.post-form-style-slideup #qr.dump {
|
|
<%= transform %>: translateY(0);
|
|
}
|
|
.post-form-style-slideout #qr:hover,
|
|
.post-form-style-slideout #qr.focus,
|
|
.post-form-style-slideout #qr.dump {
|
|
<%= transform %>: translate(0);
|
|
}
|
|
.post-form-style-tabbed-slideup #qr,
|
|
.post-form-style-tabbed-slideout #qr {
|
|
top: auto !important;
|
|
}
|
|
.post-form-style-tabbed-slideup #qr {
|
|
<%= transform %>: translateY(100%);
|
|
}
|
|
.post-form-style-tabbed-slideout.sidebar-location-left #qr {
|
|
<%= transform %>: translateX(-100%);
|
|
}
|
|
.post-form-style-tabbed-slideout.sidebar-location-right #qr {
|
|
<%= transform %>: translateX(100%);
|
|
}
|
|
.post-form-style-tabbed-slideup #qr:hover,
|
|
.post-form-style-tabbed-slideup #qr.focus,
|
|
.post-form-style-tabbed-slideup #qr.dump {
|
|
<%= transform %>: translateY(0);
|
|
}
|
|
.post-form-style-tabbed-slideout #qr:hover,
|
|
.post-form-style-tabbed-slideout #qr.focus,
|
|
.post-form-style-tabbed-slideout #qr.dump {
|
|
<%= transform %>: translateX(0);
|
|
}
|
|
.post-form-style-tabbed-slideup #qrtab,
|
|
.post-form-style-tabbed-slideout #qrtab {
|
|
position: absolute;
|
|
top: 0;
|
|
width: 120px;
|
|
text-align: center;
|
|
border-width: 1px 1px 0 1px;
|
|
cursor: default;
|
|
}
|
|
.post-form-style-tabbed-slideup #qrtab {
|
|
top: auto !important;
|
|
bottom: 100% !important;
|
|
right: 50%;
|
|
<%= transform %>: translateX(50%);
|
|
}
|
|
.post-form-style-tabbed-slideout.sidebar-location-left #qrtab {
|
|
<%= transform %>: rotate(90deg);
|
|
<%= transform %>-origin: bottom right;
|
|
left: 100%;
|
|
}
|
|
.post-form-style-tabbed-slideout.sidebar-location-right #qrtab {
|
|
<%= transform %>: rotate(-90deg);
|
|
<%= transform %>-origin: bottom right;
|
|
right: 100%;
|
|
}
|
|
.post-form-style-tabbed-slideup #qr:hover #qrtab,
|
|
.post-form-style-tabbed-slideup #qr.focus #qrtab,
|
|
.post-form-style-tabbed-slideup #qr.dump #qrtab,
|
|
.post-form-style-tabbed-slideout #qr:hover #qrtab,
|
|
.post-form-style-tabbed-slideout #qr.focus #qrtab,
|
|
.post-form-style-tabbed-slideout #qr.dump #qrtab {
|
|
opacity: 0 !important;
|
|
}
|
|
.post-form-style-slideup #qrtab input,
|
|
.post-form-style-slideup #qrtab .rice,
|
|
.post-form-style-tabbed-slideup #qrtab input,
|
|
.post-form-style-tabbed-slideup #qrtab .close,
|
|
.post-form-style-tabbed-slideup #qrtab .rice,
|
|
.post-form-style-tabbed-slideup #qrtab span,
|
|
.post-form-style-slideout #qrtab input,
|
|
.post-form-style-slideout #qrtab .rice,
|
|
.post-form-style-tabbed-slideout #qrtab input,
|
|
.post-form-style-tabbed-slideout #qrtab .close,
|
|
.post-form-style-tabbed-slideout #qrtab .rice,
|
|
.post-form-style-tabbed-slideout #qrtab span {
|
|
display: none;
|
|
}
|
|
.post-form-style-tabbed-slideup #qrtab .selectrice,
|
|
.post-form-style-tabbed-slideout #qrtab .selectrice {
|
|
text-align: center;
|
|
}
|
|
.transparent-post-form #qr {
|
|
opacity: 0.2;
|
|
transition: opacity .3s ease-in-out 1s;
|
|
}
|
|
.transparent-post-form #qr:hover,
|
|
.transparent-post-form #qr.focus,
|
|
.transparent-post-form #qr.dump {
|
|
opacity: 1;
|
|
transition: opacity .3s linear;
|
|
}
|
|
:root:not(.show-post-form-header):not(.post-form-style-float):not(.post-form-style-tabbed-slideout):not(.post-form-style-tabbed-slideup) #qrtab,
|
|
.post-form-style-float .autohide:not(:hover):not(.focus) form,
|
|
.show-post-form-header.post-form-style-fixed .autohide:not(:hover):not(.focus) form {
|
|
display: none !important;
|
|
}
|
|
:root:not(.post-form-style-tabbed-slideout) #qrtab {
|
|
margin-bottom: 1px;
|
|
}
|
|
#qr.autohide:not(:hover):not(.focus) #qrtab {
|
|
margin-bottom: 0;
|
|
}
|
|
.post-form-slideout-transitions.post-form-style-slideup #qr,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideup #qr,
|
|
.post-form-slideout-transitions.post-form-style-slideout #qr,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideout #qr {
|
|
transition: <%= transform %> .3s ease-in-out 1s;
|
|
}
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideup #qr.dump,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideup #qr:hover,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideup #qr.focus,
|
|
.post-form-slideout-transitions.post-form-style-slideup #qr.dump,
|
|
.post-form-slideout-transitions.post-form-style-slideup #qr:hover,
|
|
.post-form-slideout-transitions.post-form-style-slideup #qr.focus,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideout #qr.dump,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideout #qr:hover,
|
|
.post-form-slideout-transitions.post-form-style-tabbed-slideout #qr.focus,
|
|
.post-form-slideout-transitions.post-form-style-slideout #qr.dump,
|
|
.post-form-slideout-transitions.post-form-style-slideout #qr:hover,
|
|
.post-form-slideout-transitions.post-form-style-slideout #qr.focus {
|
|
transition: <%= transform %> .3s linear;
|
|
}
|
|
.post-form-slideout-transitions #qrtab {
|
|
transition: opacity .3s ease-in-out 1s;
|
|
}
|
|
.post-form-slideout-transitions #qr:hover #qrtab {
|
|
transition: opacity .3s linear;
|
|
}
|
|
.post-form-slideout-transitions #qrtab {
|
|
transition: opacity .3s ease-in-out 1s;
|
|
}
|
|
.post-form-slideout-transitions #qr:hover #qrtab {
|
|
transition: opacity .3s linear;
|
|
}
|
|
#qr .close {
|
|
float: right;
|
|
padding: 0 3px;
|
|
}
|
|
#qr .warning {
|
|
min-height: 1.6em;
|
|
vertical-align: middle;
|
|
padding: 0 1px;
|
|
border-width: 1px;
|
|
border-style: solid;
|
|
}
|
|
.persona {
|
|
display: <%= flex %>;
|
|
<%= flex %>-direction: column;
|
|
<%= align %>-items: stretch;
|
|
}
|
|
.compact-post-form-inputs .persona {
|
|
<%= flex %>-direction: row;
|
|
}
|
|
#qr textarea.field {
|
|
height: 11.6em;
|
|
min-height: 6em;
|
|
}
|
|
#qr.has-captcha textarea.field {
|
|
height: 6em;
|
|
}
|
|
.compact-post-form-inputs .persona input.field {
|
|
<%= flex %>: 1 1;
|
|
margin: 0 0 0 1px;
|
|
}
|
|
.compact-post-form-inputs .persona input:focus {
|
|
<%= flex %>: 3 1;
|
|
}
|
|
.compact-post-form-inputs .persona input.field:first-child {
|
|
margin: 0;
|
|
}
|
|
.compact-post-form-inputs #qr textarea.field {
|
|
height: 14.9em;
|
|
min-height: 9em;
|
|
}
|
|
.compact-post-form-inputs #qr.has-captcha textarea.field {
|
|
height: 9em;
|
|
}
|
|
.tripcode-hider .tripped:not(:hover):not(:focus) {
|
|
color: transparent !important;
|
|
}
|
|
.textarea-resize-horizontal #qr textarea {
|
|
resize: horizontal;
|
|
}
|
|
.textarea-resize-vertical #qr textarea {
|
|
resize: vertical;
|
|
}
|
|
.textarea-resize-both #qr textarea {
|
|
resize: both;
|
|
}
|
|
.textarea-resize-none #qr textarea {
|
|
resize: none;
|
|
}
|
|
/* Noscript Recaptcha */
|
|
.captcha-img {
|
|
margin: 1px 0px 0px;
|
|
text-align: center;
|
|
background-image: #fff;
|
|
font-size: 0px;
|
|
min-height: 59px;
|
|
min-width: 302px;
|
|
}
|
|
.captcha-input{
|
|
width: 100%;
|
|
margin: 1px 0 0;
|
|
}
|
|
.captcha-input.error:focus {
|
|
border-color: rgb(255,0,0) !important;
|
|
}
|
|
#qr-captcha-iframe {
|
|
display: none;
|
|
}
|
|
/* Recaptcha v2 */
|
|
#qr .captcha-root {
|
|
position: relative;
|
|
}
|
|
#qr .captcha-container > div > div {
|
|
margin: auto;
|
|
}
|
|
#qr .captcha-counter {
|
|
display: block;
|
|
width: 100%;
|
|
text-align: center;
|
|
pointer-events: none;
|
|
}
|
|
#qr.captcha-open .captcha-counter {
|
|
position: absolute;
|
|
bottom: 3px;
|
|
}
|
|
#qr .captcha-counter > a {
|
|
pointer-events: auto;
|
|
}
|
|
#qr:not(.captcha-open) .captcha-counter > a {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
.captcha-input {
|
|
width: 100%;
|
|
margin: 1px 0 0;
|
|
}
|
|
.field,
|
|
.selectrice,
|
|
button,
|
|
input:not([type=radio]) {
|
|
box-sizing: border-box;
|
|
height: 1.6em;
|
|
margin: 1px 0 0;
|
|
vertical-align: bottom;
|
|
padding: 0 1px;
|
|
outline: none;
|
|
transition: color .25s, border-color .25s, <%= flex %> .25s;
|
|
}
|
|
.selectrice {
|
|
padding-right: 1.6em;
|
|
}
|
|
#qr textarea {
|
|
min-width: 100%;
|
|
}
|
|
#file-n-submit {
|
|
display: <%= flex %>
|
|
}
|
|
#qr [type='submit'] {
|
|
width: 60px;
|
|
}
|
|
[type='file'] {
|
|
position: absolute;
|
|
opacity: 0;
|
|
z-index: -1;
|
|
}
|
|
/* Fake File Input */
|
|
#qr-filename,
|
|
#qr-filerm,
|
|
.has-file #qr-no-file {
|
|
display: none;
|
|
}
|
|
#qr-no-file,
|
|
.has-file #qr-filename {
|
|
display: block;
|
|
}
|
|
#qr-filename {
|
|
border: medium none;
|
|
vertical-align: top;
|
|
padding: 0;
|
|
margin: 0;
|
|
height: auto;
|
|
background: transparent none;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
width: 88%;
|
|
}
|
|
#qr-filename:not(.edit) {
|
|
pointer-events: none;
|
|
}
|
|
.has-file #qr-filerm {
|
|
display: inline-block;
|
|
}
|
|
#qr-extras-container {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
z-index: 2;
|
|
}
|
|
#qr-extras-container > label,
|
|
#qr-extras-container > a {
|
|
cursor: pointer;
|
|
margin-right: 3px;
|
|
}
|
|
#qr-filename-container {
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
position: relative;
|
|
margin-right: 1px;
|
|
<%= flex %>: 1 1;
|
|
overflow: hidden;
|
|
padding: 2px 1px 0;
|
|
}
|
|
/* Thread Select */
|
|
#qr-thread-select,
|
|
#qr-thread-select .selectrice div {
|
|
display: inline;
|
|
}
|
|
#qr-thread-select .selectrice {
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
width: 120px;
|
|
border: none;
|
|
background: none transparent;
|
|
padding: 0;
|
|
margin: 0;
|
|
height: auto;
|
|
}
|
|
#qr-thread-select .selectrice::before,
|
|
#qr-thread-select .selectrice::after {
|
|
display: none;
|
|
}
|
|
/* Dumping UI */
|
|
.dump #dump-list-container {
|
|
display: block;
|
|
}
|
|
#dump-list-container {
|
|
display: none;
|
|
position: relative;
|
|
overflow-y: hidden;
|
|
margin-top: 1px;
|
|
}
|
|
#dump-list {
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
white-space: nowrap;
|
|
width: 248px;
|
|
max-width: 100%;
|
|
min-width: 100%;
|
|
}
|
|
#dump-list:hover {
|
|
overflow-x: auto;
|
|
}
|
|
.qr-preview {
|
|
box-sizing: border-box;
|
|
counter-increment: thumbnails;
|
|
cursor: move;
|
|
display: inline-block;
|
|
height: 90px;
|
|
width: 90px;
|
|
padding: 2px;
|
|
opacity: .5;
|
|
overflow: hidden;
|
|
position: relative;
|
|
text-shadow: 0 1px 1px #000;
|
|
transition: opacity .25s ease-in-out;
|
|
vertical-align: top;
|
|
}
|
|
.qr-preview:hover,
|
|
.qr-preview:focus {
|
|
opacity: .9;
|
|
}
|
|
.qr-preview::before {
|
|
content: counter(thumbnails);
|
|
color: #fff;
|
|
position: absolute;
|
|
top: 3px;
|
|
right: 3px;
|
|
text-shadow: 0 0 3px #000, 0 0 8px #000;
|
|
}
|
|
.qr-preview#selected {
|
|
opacity: 1;
|
|
}
|
|
.qr-preview.drag {
|
|
box-shadow: 0 0 10px rgba(0,0,0,.5);
|
|
}
|
|
.qr-preview.over {
|
|
border-color: #fff;
|
|
}
|
|
.qr-preview > span {
|
|
color: #fff;
|
|
}
|
|
.remove {
|
|
background: none;
|
|
color: #e00;
|
|
font-weight: 700;
|
|
padding: 3px;
|
|
}
|
|
a:only-of-type > .remove {
|
|
display: none;
|
|
}
|
|
.remove:hover::after {
|
|
content: " Remove";
|
|
}
|
|
.qr-preview > label {
|
|
background: rgba(0,0,0,.5);
|
|
color: #fff;
|
|
right: 0; bottom: 0; left: 0;
|
|
position: absolute;
|
|
text-align: center;
|
|
}
|
|
.qr-preview > label > input {
|
|
margin: 0;
|
|
}
|
|
#add-post {
|
|
cursor: pointer;
|
|
font-size: 2em;
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 10px;
|
|
<%= transform %>: translateY(-50%);
|
|
}
|
|
/* Ads */
|
|
.fade-ads .topad img,
|
|
.fade-ads .middlead img,
|
|
.fade-ads .bottomad img {
|
|
opacity: 0.3;
|
|
transition: opacity .3s linear;
|
|
}
|
|
.fade-ads .topad img:hover,
|
|
.fade-ads .middlead img:hover,
|
|
.fade-ads .bottomad img:hover {
|
|
opacity: 1;
|
|
}
|
|
.hide-ads .bottomad + hr,
|
|
.hide-ads .topad,
|
|
.hide-ads .middlead,
|
|
.hide-ads .bottomad,
|
|
.hide-ads .ad-plea,
|
|
.hide-ads .center {
|
|
display: none !important;
|
|
}
|
|
.shrink-ads .topad a img,
|
|
.shrink-ads .bottomad a img {
|
|
width: 500px;
|
|
height: auto;
|
|
}
|
|
/* Mascot Positions */
|
|
#mascot {
|
|
display: none;
|
|
position: fixed;
|
|
z-index: -1;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
line-height: 0;
|
|
}
|
|
.click-to-toggle #mascot {
|
|
cursor: pointer;
|
|
}
|
|
.mascot-position-above-post-form.post-form-style-fixed:not(.post-form-decorations) #mascot img {
|
|
margin-bottom: -2px;
|
|
}
|
|
.mascots #mascot {
|
|
display: block;
|
|
}
|
|
.sidebar-location-right.mascot-location-sidebar #mascot,
|
|
.sidebar-location-left.mascot-location-opposite #mascot {
|
|
left: auto;
|
|
}
|
|
.sidebar-location-left.mascot-location-sidebar #mascot,
|
|
.sidebar-location-right.mascot-location-opposite #mascot {
|
|
right: auto;
|
|
}
|
|
.sidebar-location-left.mascot-location-sidebar #mascot img,
|
|
.sidebar-location-right.mascot-location-opposite #mascot img {
|
|
<%= transform %>: scaleX(-1);
|
|
}
|
|
.fourchan-ss-navigation.bottom-header.fixed #mascot,
|
|
.fourchan-ss-navigation.index.pagination-sticky-bottom #mascot {
|
|
bottom: 1.5em
|
|
}
|
|
.mascots-overlap-posts #mascot {
|
|
z-index: 3;
|
|
}
|
|
.mascot-position-middle #mascot {
|
|
bottom: 50% !important;
|
|
<%= transform %>: translateY(50%);
|
|
}
|
|
.mascot-position-top #mascot {
|
|
bottom: auto !important;
|
|
top: 17px;
|
|
}
|
|
/* Options */
|
|
#overlay {
|
|
position: fixed;
|
|
z-index: 30;
|
|
top: 0;
|
|
right: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
background: rgba(0,0,0,.5);
|
|
}
|
|
#appchanx-settings {
|
|
width: auto;
|
|
left: 15%;
|
|
right: 15%;
|
|
top: 15%;
|
|
bottom: 15%;
|
|
position: fixed;
|
|
z-index: 31;
|
|
padding: .3em;
|
|
}
|
|
.rounded-edges #appchanx-settings,
|
|
.rounded-edges #appchanx-settings fieldset,
|
|
.rounded-edges .mascots-container,
|
|
.rounded-edges .section-container,
|
|
.rounded-edges .sections-list > a {
|
|
border-radius: 3px;
|
|
}
|
|
.description {
|
|
display: none;
|
|
}
|
|
#appchanx-settings h3,
|
|
.section-keybinds,
|
|
.section-mascots,
|
|
.section-script,
|
|
.style {
|
|
text-align: center;
|
|
}
|
|
.section-keybinds table,
|
|
.section-script fieldset,
|
|
.section-style fieldset {
|
|
text-align: left;
|
|
}
|
|
.section-keybinds table {
|
|
margin: auto;
|
|
}
|
|
#appchanx-settings fieldset {
|
|
padding: 5px 0;
|
|
vertical-align: top;
|
|
border: 0;
|
|
margin: 0 3px 6px;
|
|
display: inline-block;
|
|
}
|
|
.single-column-mode #appchanx-settings fieldset {
|
|
display: block;
|
|
margin: 0 auto 6px;
|
|
}
|
|
#appchanx-settings .section-advanced fieldset {
|
|
display: block;
|
|
margin: 0 auto 6px;
|
|
}
|
|
.section-advanced .archive-cell {
|
|
min-width: 200px;
|
|
}
|
|
.section-advanced .selectrice {
|
|
display: inline-block;
|
|
clear: both;
|
|
}
|
|
.section-container {
|
|
overflow: auto;
|
|
position: absolute;
|
|
top: 1.7em;
|
|
right: 5px;
|
|
bottom: 5px;
|
|
left: 5px;
|
|
padding: 5px;
|
|
}
|
|
.sections-list {
|
|
padding: 0 3px;
|
|
float: left;
|
|
}
|
|
.sections-list > a {
|
|
cursor: pointer;
|
|
position: relative;
|
|
padding: 0 4px;
|
|
z-index: 1;
|
|
height: 1.4em;
|
|
display: inline-block;
|
|
border-width: 1px 1px 0 1px;
|
|
border-color: transparent;
|
|
border-style: solid;
|
|
}
|
|
.sections-list > a.tab-selected {
|
|
border-style: solid;
|
|
}
|
|
.credits {
|
|
float: right;
|
|
}
|
|
#appchanx-settings h3 {
|
|
margin: 0;
|
|
}
|
|
.section-script fieldset > div,
|
|
.section-style fieldset > div,
|
|
.section-advanced fieldset > div {
|
|
overflow: visible;
|
|
padding: 0 5px 0 7px;
|
|
}
|
|
#appchanx-settings tr:nth-of-type(2n+1),
|
|
.section-script fieldset > div:nth-of-type(2n+1),
|
|
.section-advanced fieldset > div:nth-of-type(2n+1),
|
|
.section-style fieldset > div:nth-of-type(2n+1),
|
|
.section-keybinds tr:nth-of-type(2n+1),
|
|
#selectrice li:nth-of-type(2n+1) {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
article li {
|
|
margin: 10px 0 10px 2em;
|
|
}
|
|
#appchanx-settings .option {
|
|
width: 50%;
|
|
display: inline-block;
|
|
vertical-align: bottom;
|
|
}
|
|
.option input {
|
|
width: 100%;
|
|
}
|
|
.optionlabel {
|
|
padding-left: 18px;
|
|
}
|
|
.rice + .optionlabel {
|
|
padding-left: 0;
|
|
}
|
|
.section-script fieldset,
|
|
.styleoption {
|
|
text-align: left;
|
|
}
|
|
.section-style fieldset {
|
|
width: 370px;
|
|
}
|
|
.section-script fieldset {
|
|
width: 200px;
|
|
}
|
|
#mascotcontent,
|
|
#themecontent,
|
|
.suboptions {
|
|
overflow: auto;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 1.7em;
|
|
left: 0;
|
|
}
|
|
#mascotcontent,
|
|
#themecontent {
|
|
padding: 5px;
|
|
}
|
|
#themecontent {
|
|
top: 1.8em;
|
|
}
|
|
.mAlign {
|
|
height: 250px;
|
|
vertical-align: bottom;
|
|
display: table-cell;
|
|
line-height: 0;
|
|
}
|
|
#save,
|
|
.stylesettings {
|
|
position: absolute;
|
|
right: 10px;
|
|
bottom: 0;
|
|
}
|
|
.section-style .suboptions {
|
|
bottom: 0;
|
|
}
|
|
.section-container textarea {
|
|
font-family: monospace;
|
|
min-height: 150px;
|
|
resize: vertical;
|
|
width: 100%;
|
|
}
|
|
|
|
div[data-checked="false"] > .suboption-list {
|
|
display: none;
|
|
}
|
|
.suboption-list {
|
|
position: relative;
|
|
}
|
|
.suboption-list::before {
|
|
content: "";
|
|
display: inline-block;
|
|
position: absolute;
|
|
left: .7em;
|
|
width: 0;
|
|
height: 100%;
|
|
border-left: 1px solid;
|
|
}
|
|
.suboption-list > div {
|
|
position: relative;
|
|
padding-left: 1.4em;
|
|
}
|
|
.suboption-list > div::before {
|
|
content: "";
|
|
display: inline-block;
|
|
position: absolute;
|
|
left: .7em;
|
|
width: .7em;
|
|
height: .6em;
|
|
border-left: 1px solid;
|
|
border-bottom: 1px solid;
|
|
}
|
|
/* Hover Functionality */
|
|
#mouseover {
|
|
z-index: 33;
|
|
position: fixed;
|
|
max-width: 70%;
|
|
}
|
|
#mouseover:empty {
|
|
display: none;
|
|
}
|
|
/* Mascot Tab */
|
|
#mascot_hide {
|
|
padding: 3px;
|
|
position: absolute;
|
|
top: 2px;
|
|
right: 18px;
|
|
}
|
|
#mascot_hide .rice {
|
|
float: left;
|
|
}
|
|
#mascot_hide > div {
|
|
height: 0;
|
|
text-align: right;
|
|
overflow: hidden;
|
|
}
|
|
#mascot_hide:hover > div {
|
|
height: auto;
|
|
}
|
|
#mascot_hide label {
|
|
width: 100%;
|
|
display: block;
|
|
clear: both;
|
|
text-decoration: none;
|
|
}
|
|
.mascots-container {
|
|
padding: 0;
|
|
text-align: center;
|
|
}
|
|
.mascot,
|
|
.mascotcontainer {
|
|
overflow: hidden;
|
|
}
|
|
.mascot {
|
|
position: relative;
|
|
border: none;
|
|
margin: 5px;
|
|
padding: 0;
|
|
width: 200px;
|
|
display: inline-block;
|
|
background-color: transparent;
|
|
}
|
|
.mascotcontainer {
|
|
height: 250px;
|
|
border: 0;
|
|
margin: 0;
|
|
max-height: 250px;
|
|
cursor: pointer;
|
|
bottom: 0;
|
|
border-width: 0 1px 1px;
|
|
border-style: solid;
|
|
border-color: transparent;
|
|
overflow: hidden;
|
|
}
|
|
.mascot img {
|
|
max-width: 200px;
|
|
}
|
|
.export-button,
|
|
.mascotname,
|
|
#mascot-options {
|
|
box-sizing: border-box;
|
|
padding: 0;
|
|
width: 100%;
|
|
}
|
|
#mascot-options {
|
|
opacity: 0;
|
|
transition: opacity .3s linear;
|
|
}
|
|
.mascot:hover #mascot-options {
|
|
opacity: 1;
|
|
}
|
|
#mascot-options {
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 0;
|
|
left: 0;
|
|
}
|
|
.export-button {
|
|
position: absolute;
|
|
bottom: 1.7em;
|
|
right: 0;
|
|
left: 0;
|
|
text-align: center;
|
|
}
|
|
#mascot-options a {
|
|
display: inline-block;
|
|
width: 33%;
|
|
}
|
|
#upload {
|
|
position: absolute;
|
|
width: 100px;
|
|
left: 50%;
|
|
margin-left: -50px;
|
|
text-align: center;
|
|
bottom: 0;
|
|
}
|
|
#mascots_batch {
|
|
position: absolute;
|
|
left: 10px;
|
|
bottom: 0;
|
|
}
|
|
/* Themes Tab */
|
|
#themes h1 {
|
|
position: absolute;
|
|
right: 300px;
|
|
bottom: 10px;
|
|
margin: 0;
|
|
transition: all .2s ease-in-out;
|
|
opacity: 0;
|
|
}
|
|
#themes .selectedtheme h1 {
|
|
right: 11px;
|
|
opacity: 1;
|
|
}
|
|
#addthemes {
|
|
position: absolute;
|
|
left: 10px;
|
|
bottom: 0;
|
|
}
|
|
.theme {
|
|
margin: 1em;
|
|
}
|
|
/* Theme Editor */
|
|
#themeConf {
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
width: 296px;
|
|
z-index: 10;
|
|
}
|
|
.sidebar-location-right #themeConf {
|
|
right: 2px;
|
|
left: auto;
|
|
}
|
|
.sidebar-location-right #themeConf {
|
|
left: 2px;
|
|
right: auto;
|
|
}
|
|
#themebar input {
|
|
width: 30%;
|
|
}
|
|
.option .color {
|
|
width: 10%;
|
|
border-left: none !important;
|
|
color: transparent !important;
|
|
}
|
|
.option .colorfield {
|
|
width: 90%;
|
|
}
|
|
.themevar textarea {
|
|
min-width: 100%;
|
|
max-width: 100%;
|
|
height: 20em;
|
|
resize: vertical;
|
|
}
|
|
/* Mascot Editor */
|
|
#mascotConf {
|
|
position: fixed;
|
|
height: 17em;
|
|
bottom: 0;
|
|
left: 50%;
|
|
width: 500px;
|
|
margin-left: -250px;
|
|
overflow: auto;
|
|
z-index: 10;
|
|
}
|
|
#mascotConf .option,
|
|
#mascotConf .optionlabel {
|
|
box-sizing: border-box;
|
|
width: 50%;
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
#mascotConf .option input {
|
|
width: 100%;
|
|
}
|
|
#close {
|
|
position: absolute;
|
|
left: 10px;
|
|
bottom: 0;
|
|
}
|
|
/* Gallery */
|
|
#a-gallery {
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 26;
|
|
display: <%= flex %>;
|
|
<%= flex %>-direction: row;
|
|
background: rgba(0,0,0,0.7);
|
|
}
|
|
.gal-viewport {
|
|
display: <%= flex %>;
|
|
<%= align %>-items: stretch;
|
|
<%= flex %>-direction: row;
|
|
<%= flex %>: 1 1 auto;
|
|
overflow: hidden;
|
|
}
|
|
.gal-thumbnails {
|
|
<%= flex %>: 0 0 150px;
|
|
overflow-y: auto;
|
|
display: <%= flex %>;
|
|
<%= flex %>-direction: column;
|
|
<%= align %>-items: stretch;
|
|
text-align: center;
|
|
background: rgba(0,0,0,.5);
|
|
border-left: 1px solid #222;
|
|
}
|
|
.gal-hide-thumbnails .gal-thumbnails {
|
|
display: none;
|
|
}
|
|
.gal-thumb img {
|
|
max-width: 125px;
|
|
max-height: 125px;
|
|
height: auto;
|
|
width: auto;
|
|
}
|
|
.gal-thumb {
|
|
<%= flex %>: 0 0 auto;
|
|
padding: 3px;
|
|
line-height: 0;
|
|
transition: background .2s linear;
|
|
}
|
|
.gal-highlight {
|
|
background: rgba(0, 190, 255,.8);
|
|
}
|
|
.gal-prev {
|
|
order: 0;
|
|
border-right: 1px solid #222;
|
|
}
|
|
.gal-next {
|
|
order: 2;
|
|
border-left: 1px solid #222;
|
|
}
|
|
.gal-prev,
|
|
.gal-next {
|
|
<%= flex %>: 0 0 20px;
|
|
position: relative;
|
|
cursor: pointer;
|
|
opacity: 0.7;
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
}
|
|
.gal-prev:hover,
|
|
.gal-next:hover {
|
|
opacity: 1;
|
|
}
|
|
.gal-prev::after,
|
|
.gal-next::after {
|
|
position: absolute;
|
|
top: 48.6%;
|
|
<%= transform %>: translateY(-50%)
|
|
display: inline-block;
|
|
border-top: 11px solid transparent;
|
|
border-bottom: 11px solid transparent;
|
|
content: "";
|
|
}
|
|
.gal-prev::after {
|
|
border-right: 12px solid #fff;
|
|
right: 5px;
|
|
}
|
|
.gal-next::after {
|
|
border-left: 12px solid #fff;
|
|
right: 3px;
|
|
}
|
|
.gal-image {
|
|
order: 1;
|
|
<%= flex %>: 1 0 auto;
|
|
display: <%= flex %>;
|
|
<%= align %>-items: flex-start;
|
|
<%= justify %>: space-around;
|
|
overflow: auto;
|
|
/* Flex > Non-Flex child max-width and overflow fix (Firefox only?) */
|
|
width: 1%;
|
|
}
|
|
.gal-image a {
|
|
margin: auto;
|
|
line-height: 0;
|
|
max-width: 100%;
|
|
}
|
|
.gal-fit-width .gal-image video,
|
|
.gal-fit-width .gal-image img {
|
|
max-width: 100%;
|
|
}
|
|
.gal-fit-height .gal-image video,
|
|
.gal-fit-height .gal-image img {
|
|
max-height: 95vh;
|
|
max-height: calc(100vh - 25px);
|
|
}
|
|
.gal-buttons {
|
|
font-size: 2em;
|
|
margin-right: 10px;
|
|
top: 5px;
|
|
color: #fff;
|
|
text-shadow: 0px 0px 1px #000;
|
|
}
|
|
.gal-buttons,
|
|
.gal-name,
|
|
.gal-count {
|
|
position: fixed;
|
|
right: 178px;
|
|
}
|
|
.hide-thumbnails .gal-buttons,
|
|
.hide-thumbnails .gal-count,
|
|
.hide-thumbnails .gal-name {
|
|
right: 28px;
|
|
}
|
|
.gal-name {
|
|
bottom: 5px;
|
|
background: rgba(0,0,0,0.6) !important;
|
|
border-radius: 3px;
|
|
padding: 1px 5px 2px 5px;
|
|
text-decoration: none !important;
|
|
color: #fff !important;
|
|
}
|
|
.gal-name:hover,
|
|
.gal-close:hover {
|
|
color: rgb(95, 95, 101) !important;
|
|
}
|
|
.gal-count {
|
|
bottom: 26px;
|
|
background: rgba(0,0,0,0.6) !important;
|
|
border-radius: 3px;
|
|
padding: 1px 5px 2px 5px;
|
|
color: #fff !important;
|
|
}
|
|
.gal-buttons.gal-playing > .gal-start,
|
|
.gal-buttons:not(.gal-playing) > .gal-stop {
|
|
display: none;
|
|
}
|
|
/* Catalog */
|
|
#content .navLinks,
|
|
#info .navLinks,
|
|
.btn-wrap {
|
|
display: block;
|
|
}
|
|
.hide-navlinks body > .navLinks {
|
|
display: none;
|
|
}
|
|
.navLinks > .btn-wrap:not(:first-of-type)::before {
|
|
content: ' - ';
|
|
}
|
|
.button {
|
|
cursor: pointer;
|
|
}
|
|
#content .btn-wrap,
|
|
#info .btn-wrap {
|
|
display: inline-block;
|
|
}
|
|
#post-preview,
|
|
#quote-preview {
|
|
position: absolute;
|
|
z-index: 22;
|
|
}
|
|
.rounded-edges #post-preview {
|
|
border-radius: 3px;
|
|
}
|
|
#settings,
|
|
#threads,
|
|
#info .navLinks,
|
|
#content .navLinks {
|
|
text-align: center;
|
|
}
|
|
#threads .thread {
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
word-wrap: break-word;
|
|
overflow: hidden;
|
|
margin: 1px;
|
|
padding: 5px 0 3px;
|
|
text-align: center;
|
|
}
|
|
.extended-small .thread,
|
|
.small .thread {
|
|
width: 165px;
|
|
max-height: 320px;
|
|
}
|
|
.small .teaser,
|
|
.large .teaser {
|
|
display: none;
|
|
}
|
|
.extended-large .thread,
|
|
.large .thread {
|
|
width: 270px;
|
|
max-height: 410px;
|
|
}
|
|
.extended-small .thumb,
|
|
.small .thumb {
|
|
max-width: 150px;
|
|
max-height: 150px;
|
|
}
|
|
.panel {
|
|
position: fixed;
|
|
top: 50% !important;
|
|
left: 50%;
|
|
<%= transform %>: translate(-50%, -50%);
|
|
padding: 5px;
|
|
}
|
|
.icon::after {
|
|
display: inline-block;
|
|
float: right;
|
|
width: 1em;
|
|
cursor: pointer;
|
|
}
|
|
.helpIcon::after {
|
|
content: '?';
|
|
}
|
|
.closeIcon::after {
|
|
content: '\uf00d';
|
|
font-family: FontAwesome;
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
text-decoration: inherit;
|
|
-webkit-font-smoothing: antialiased;
|
|
font-size:14px !important;
|
|
}
|
|
/* Front Page */
|
|
#logo {
|
|
text-align: center;
|
|
}
|
|
#doc {
|
|
box-sizing: border-box;
|
|
margin: 10px auto;
|
|
width: 1006px;
|
|
padding: 2px;
|
|
position: relative;
|
|
}
|
|
.rounded-edges #doc,
|
|
.rounded-edges #doc div {
|
|
border-radius: 3px;
|
|
}
|
|
#boards .boxcontent {
|
|
vertical-align: top;
|
|
text-align: center;
|
|
}
|
|
#filter-container,
|
|
#options-container {
|
|
top: 4px;
|
|
right: 8px;
|
|
position: absolute;
|
|
}
|
|
#filtermenu,
|
|
#optionsmenu {
|
|
top: 100% !important;
|
|
left: auto !important;
|
|
right: 0 !important;
|
|
}
|
|
#boards .column {
|
|
box-sizing: border-box;
|
|
display: inline-block;
|
|
width: 180px;
|
|
text-align: left;
|
|
vertical-align: top;
|
|
}
|
|
.bd ul,
|
|
.boxcontent ul {
|
|
vertical-align: top;
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
.right-box .boxcontent ul {
|
|
padding: 0 10px;
|
|
}
|
|
.yuimenuitem,
|
|
.boxcontent ul > li {
|
|
list-style-type: none;
|
|
}
|
|
.boxbar {
|
|
position: relative;
|
|
}
|
|
#doc h3,
|
|
.boxbar h2 {
|
|
margin: 0;
|
|
}
|
|
#doc h3 {
|
|
text-decoration: none !important;
|
|
}
|
|
.underline-links #doc h3 {
|
|
text-decoration: underline !important;
|
|
}
|
|
#ft,
|
|
.box-outer {
|
|
margin: 2px 0 0;
|
|
overflow: hidden;
|
|
}
|
|
#ft,
|
|
.boxbar,
|
|
.boxcontent {
|
|
padding: 0 8px;
|
|
}
|
|
.yui-module {
|
|
position: absolute;
|
|
}
|
|
.yuimenuitem::before {
|
|
content: " [ ] ";
|
|
font-family: monospace;
|
|
}
|
|
.yuimenuitem-checked::before {
|
|
content: " [x] "
|
|
}
|
|
.yui-g {
|
|
overflow: hidden;
|
|
}
|
|
.yui-u {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
width: 499px;
|
|
float: right;
|
|
}
|
|
.yui-u.first {
|
|
float: left;
|
|
}
|
|
#recent-images .boxcontent {
|
|
text-align: center;
|
|
}
|
|
#ft {
|
|
text-align: center;
|
|
}
|
|
#ft ul {
|
|
padding: 0;
|
|
}
|
|
#ft li {
|
|
list-style-type: none;
|
|
display: inline-block;
|
|
width: 100px;
|
|
}
|
|
#preview-tooltip-nws,
|
|
#preview-tooltip-ws,
|
|
#ft .fill,
|
|
.clear-bug {
|
|
display: none;
|
|
}
|
|
/* ExLinks */
|
|
#exlinks-options-content {
|
|
padding: 5px;
|
|
}
|
|
/* /f/ */
|
|
[action*='/f/'] .fileInfo {
|
|
padding-left: 5px !important;
|
|
}
|
|
[action*='/f/'] .subject, .name-col {
|
|
max-width: 200px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
word-wrap: break-word;
|
|
}
|
|
div.swfSauce {
|
|
margin-top: 5px !important;
|
|
}
|
|
.mobile.center {
|
|
display:none!important;
|
|
}
|
|
table.flashListing {
|
|
border-spacing: 1px !important;
|
|
margin: 5px auto !important;
|
|
}
|
|
.flashListing td {
|
|
padding: 2px !important;
|
|
font-size: 9pt !important;
|
|
text-align: center !important;
|
|
margin: 0px !important;
|
|
}
|
|
#delform[action='https://sys.4chan.org/f/up.php'], #delform[action='https://sys.4chan.org/f/up.php'] .postblock {
|
|
background: none !important;
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
}
|