From a47ba6daf213fb9aac985209375075be5261cd34 Mon Sep 17 00:00:00 2001 From: Tomochin Date: Sun, 3 Oct 2021 17:44:00 +0700 Subject: [PATCH] Adding noir, noir2 and nostaglia --- static/styles/noir/style.css | 1379 ++++++++++++++++++++++++++++++++++ static/styles/noir2/style.css | 1404 +++++++++++++++++++++++++++++++++++ static/styles/nostalgia/style.css | 1463 +++++++++++++++++++++++++++++++++++++ 3 files changed, 4246 insertions(+) create mode 100644 static/styles/noir/style.css create mode 100644 static/styles/noir2/style.css create mode 100644 static/styles/nostalgia/style.css diff --git a/static/styles/noir/style.css b/static/styles/noir/style.css new file mode 100644 index 0000000..91f1cef --- /dev/null +++ b/static/styles/noir/style.css @@ -0,0 +1,1379 @@ +/*Sugoi NOIR*/ +:root { + /*header*/ + --color36: #1C1C1C; /*header*/ + --color5: #000000; /*menu bar*/ + --color7: #1C1C1C; /*menu bar hover*/ + --color9: #e6e6e6; /*text menu bar*/ + --color37: #2E2E2E; /*search background*/ + --color38: #e6e6e6; /*search text*/ + --color41: #e6e6e6; /*user info*/ + /*general*/ + --color0: #424242; /*background*/ + --color10: #2E2E2E; /*posts background*/ + --color1: #151515; /*top posts*/ + --color2: #151515; /*top posts 2*/ + --color42: #FFFFFF; /*header text,*/ + --color4: #AAAAAA; /*text*/ + --color77: #E6E6E6; /*text a*/ + --color60: #525252; /*input textarea background*/ + --color61: #FFFFFF; /*input textarea*/ + /*interface elements*/ + --color64: #151515; /*button*/ + --color65: #424242;/*button hover*/ + --color66: #151515; /*cat-selector*/ + --color67: #E6E6E6; /*cat-selector text*/ + --color74: #222222; /*bbcode_bar background*/ + --color75: #AAAAAA; /*bbcode_bar text*/ + --color76: #E6E6E6; /*brackets*/ + --color40: #AAAAAA; /*tags*/ + + --color6: #565656; /*menu & filter menu active*/ + --color14: #2E2E2E; /*torrent table background*/ + --color15: #3b3b3b; /*torrents list*/ + --color17: #212121; /*torrents list 2*/ + --color18: #3b3b3b; /*requests list */ + --color3: #2E2E2E; /*requests list 2*/ + --color79: #AAAAAA; /*collage_image:hover*/ + --color19: #AAAAAA; /*border request*/ + --color20: #AAAAAA; /*tooltipster-content*/ + /*forum*/ + --color50: #3b3b3b; /*forum lists*/ + --color25: #000ff; /*quote username color*/ + --color27: #5c5c5c; /*quote border*/ + --color48: #3b3b3b; /*quote background*/ + --color43: #E6E6E6; /*text coldhead*/ + --color44: #E6E6E6; /*link*/ + --color70: #E6E6E6; /*link hover*/ + --color16: #008572; /*staff forum post*/ + --color78: #AAAAAA; /*colhead_dark .last_read & arrow*/ + --color80: #ffffff; /*unread forum message*/ + /*notifications*/ + --color8: #151515; /*alarm bar*/ + --color39: #e6e6e6; /*alarm bar text*/ + --color29: #151515; /*noty bottomRight top*/ + --color30: #e6e6e6; /*noty_bottomRigh top text*/ + /*misc*/ + --color68: #000000; /*unreadpm, ratio bracket*/ + --color28: #BDBDBD; /*poll*/ + --color45: #000000; /*footer*/ + --color31: #424242; /*site debug border*/ + --color32: red; /*reported*/ + --color33: #C35C1C; /*snatched*/ + --color34: #BD0D0D; /*leeching*/ + --color35: #068206; /*seeding*/ + --color72: green; /*vote_tag_up*/ + --color73: red; /*vote_tag_down*/ + --color11: #AF2525; /*error_message background*/ + --color71: white; /*error_message text*/ + --color12: #F4E649; /*save_message background*/ + --color13: #B00D0D; /*elem_error*/ +/*--color21: #666666; /*border - unused*/ +} + +/*personal additions*/ +.colhead_dark a { + color: var(--color43); +} + +.autocomplete-suggestions strong { + font-weight: normal; + color: #0B2593; +} + +/* Layout (Torrents page) */ + +#site_debug td{ + border: 1px solid var(--color31); +} + +/* Global */ +* { + padding: 0em; + margin: 0em; +} + +html { + width: 100%; +} + +body { + width: 100%; + background-color: var(--color0); + font-family: tahoma, helvetica, sans-serif; + font-size: 8pt; + color: var(--color4); + min-width: 850px; +} + +/* Common elements */ + +.header a, h2{ + color: var(--color42); +} + +a { + text-decoration: none; + border: none; + color: var(--color77); +} + +a:hover { + text-decoration: underline; +} + +button, input[type=button], input[type=submit] { + background: var(--color64); + box-shadow: 0 1px 1px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12); + color: var(--color9); +} +button:hover, input[type=button]:hover, input[type=submit]:hover { + background: var(--color65); +} +button:focus, input[type=button]:focus, input[type=submit]:focus { + background: var(--color65); +} + +.spoilerButton { + max-width: 540px; +} + +.forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a { + text-decoration: none; + border: none; + color: var(--color44); +} + +.forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover { + text-decoration: underline; + border: none; + color: var(--color70); +} + +h1,h2,h3,h4 { + margin: 5px 0px; + font-weight: bold; + color: var(--color42); +} + +h2 { + text-align: center; + font-size: 12pt; +} + +h4 { + font-size: 8pt; +} + +p { + margin: 10px 5px; +} + +li { + margin: 5px 15px; +} + +img { + border: none; +} + +/* Styles generated by the BBCode parser */ + +span.size1 { font-size:0.75em; } +span.size2 { font-size:1em; } +span.size3 { font-size:1.25em; } +span.size4 { font-size:1.5em; } +span.size5 { font-size:1.75em; } +span.size6 { font-size:2em; } +span.size7 { font-size:2.25em; } +span.size8 { font-size:2.5em; } +span.size9 { font-size:2.75em; } +span.size10 { font-size:3em; } + +ul.thin { margin:0px 0px 0px 25px; padding:0px; } +ul.thin li { margin:0px 0px; padding:0px; } + +/* Layout (Every page) */ + +#header { + width: 100%; + padding: 0px 0 0 0; + background: var(--color36); + margin-bottom: 10px; +} + +#content { + margin: auto; + margin-top: 10px; +/* margin-top: 100px; */ + width: 90%; + min-width: 872px; + overflow: hidden; +} + +#footer { +/* margin-top: 40px; */ + margin-top: 10px; + width: 100%; + text-align: center; + padding: 1em 0; + opacity: 0; + transition: ease-in-out 0.3s; + transition-delay: 0.7s; + /* color: var(--color4); */ +} +#footer:hover { + opacity: 1; +} +#footer a { + color: var(--color45); +} +#footer a:hover { + text-decoration: underline; +} + +#logo { + width: 300px; + height: 197px; + margin: 0 auto; +} + +#logo a { + border: none; + width: 100%; + height: 197px; + display: block; +} + +#logo a:hover { + border: none; +} + +#menu { + width: 100%; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#menu > ul { + display: flex; + width: 70%; + margin: 0 auto; +} + +#menu > ul > li { + position: relative; + height: 32px; + display: flex; + margin: 0; + flex: 1 1 auto; +} + +#menu ul > li > a { + padding: 0.6em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.2s; +} + +#nav_links { + max-width: 40px; +} + +#menu ul li a.active { + background-color: var(--color6); +} + +#menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#menu .nav_dropdown { + background: var(--color5); + margin-top: 0; +} + +.nav_dropdown > div { + position: absolute; + background-color: var(--color5); + width: 100%; + z-index: 99999; + margin-top: 32px; + left: 0; +} + +#nav_links > #links_menu { + width: 120px; + margin-left: -80px; +} + +.nav_dropdown > div > a { + display: none; + color: var(--color9); + height: 32px; + line-height: 32px; +} + +.nav_dropdown:hover > div > a { + display: block; +} + +#filter_menu { + width: 100%; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#filter_menu > ul { + display: flex; + width: 80%; + margin: 0 auto; +} + +#filter_menu > ul > li { + position: relative; + height: 26px; + display: flex; + margin: 0; + flex: 1 1 auto; +} + +#filter_menu ul > li > a { + padding: 0.4em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.1s; +} + +#filter_menu ul li a.active { + background-color: var(--color6); +} + +#filter_menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#userinfo { +/* position: absolute; + top: 258px; */ + color: var(--color41); + padding: 4px 0px; + width: 100%; + text-align: center; + font-size: 8pt; + /* border-bottom: 1px solid #999; */ +} + +#userinfo img { + margin-top: -5px; +} + +#userinfo ul { + display: inline; + margin: 0px 0.8%; +} + +#userinfo ul li { + display: inline; + margin: 0 0.1em; + line-height: 20px; + vertical-align: middle; + padding: 0px; +} + +#userinfo a { + color: var(--color9); +} +#userinfo a:hover { + text-decoration: underline; +} + +#userinfo b a { + font-weight: normal; + font-size: 0.9em; + font-weight: bold; +} + +#searchbars { + text-align: center; + box-sizing: border-box; + display: flex; + width: 60%; + margin: 4px auto; + min-width: 850px; +} + +#searchbars > .search_form { + flex: 1 1 auto; + text-align: center; + margin: 0 3px; +} + +#searchbars input { + position: relative; + border: 1px solid transparent; + box-sizing: border-box; + padding: 2px 2px 2px 4px; + font-size: 0.9em; + background-color: var(--color37); + width: 100%; + color: var(--color38); +} + +#searchbars ul { + margin: 0 auto; + display: block; + text-align: center; +} + +#searchbars ul li { + display: inline; + margin: 0px 1px; + list-style: none; + position: relative; +} + +#searchbars ul li ul { + display: block; + position: absolute; + top: 1em; + left: 0; + z-index: 1000; + background-color: var(--color10); + width: 12em; + margin-top: 12px; +} + +#searchbars ul li ul li { + margin: 0 0 0 0; + padding: 0; + display: block; + width: 100%; +} + +#searchbars ul li ul li.highlight { + background: var(--color10); +} + +#searchbars ul li form { + display: inline; +} + +#alerts { +/* margin-top: 85px; + margin-bottom: -85px; */ +/* padding: 10px 0px; */ + margin: 10px 0px; +} + +#cat-selector ul { + width: 100%; +} + +#cat-selector ul li { + display: inline; + width: 12em; + height: 1em; + float: left; +} + +.alertbar { + /* border: 1px solid #999; */ + background-color: var(--color8); + text-align: center; + color: var(--color4); + font-weight: bold; + font-size: 0.95em; + width: 350px; + margin: 0 auto 0px auto; + padding: 10px; +} +.alertbar a { + color: var(--color39); + text-decoration: none; +} +.alertbar a:hover { + text-decoration: underline; +} + +/* IE doesn't appear to like a simple display:none in our header. Random things start fucking up pretty badly. */ +.hidden { + position: absolute; + left: -10000px; +} + +input.hidden { + position: absolute; + display: none; +} + +/* Layout (Any page) */ + + +.thin { + width: 850px; + margin: 0px auto; +} + +#userinfo_major .brackets:before { + font-weight: bold; +} + +#userinfo_major .brackets:after { + font-weight: bold; +} + +#userinfo #userinfo_minor { + position: absolute; + text-align: left; +} + +#userinfo_minor > li > ul { + display: none; + position: absolute; + padding: 5px; + left: -5px; + background-color: var(--color8); + z-index: 100; +} + +#userinfo_minor li { + display: block; +} + +div.linkbox { + text-align:center; + padding: 5px; +} + +.center { + text-align: center; +} + +.right { + text-align: right; +} + +.min_padding { + padding: 0px; + margin: 0px 0px; +} + +p.min_padding { + margin: 2px 0px; +} + +.pad { + padding: 1em; +} + +.slight_margin { + margin: 4px; +} + +.vertical_space { + margin-bottom: 10px; +} + +.box { + font-size: 8pt; + background-color: var(--color10); + /* border: 1px solid var(--color21); */ + border: none; + margin-bottom: 10px; +} + +.torrents_nomatch { + margin-top: 10px; +} + +.box2 { + margin-bottom: 10px; + font-size: 8pt; + background-color: var(--color10); + /* border: 1px solid var(--color21); */ + border: none; +} + +.pad h3, .pad h4, .padbox h3, .padbox h4 { + margin-top: 0px; + padding-top: 0px; + color: var(--color42); +} + +.sidebar { + float: right; + width: 245px; +} + +.head { + padding: 4px; + /* border-bottom: 1px solid var(--color22); */ + /* background: #E1E1E1; */ + background: var(--color1); + color: var(--color9); +} + +.head a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.head a:hover { +text-decoration: underline; +color: var(--color9); +} + +.body { + padding: 3px 10px 10px 10px; +} + +.main_column { + width: 592px; +} + +.main_column table { + margin-bottom: 10px; +} + +/* +These 3 #artist styles extend the width to ensure .sidebar does not steal width from .main_column +and result in it only being 592px, which despite looking ok for the news items on the main page +and other areas, it is just too thin for any torrent table. +*/ +#artist .main_column { + width: 845px; +} + +#artist .thin { + width: 1100px; +} + +body#artist { + min-width: 1225px; +} + +.tags { + padding: 0px 0px 0px 20px; + font-style: italic; +} + +.tags a { + color: var(--color40); +} + +.tags a:hover { + text-decoration: underline; +} + +.noborder { + border: none; +} + +ul.nobullet, ul.nobullet li { + list-style-type: none; +} + +table { + width: 100%; + border-collapse: collapse; + /* border: 1px solid var(--color21); */ +} + +tr { + background-color: var(--color10); +} + +td, th { + /* border: 1px solid var(--color21); */ + padding: 5px; + text-align: left; +} + +.colhead { + background: var(--color2); + font-weight: bold; + color: var(--color9); +} + +td.colhead, .colhead td, .colhead th { + padding-left: 10px; + padding-right: 10px; +} + +.colhead a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.colhead a:hover { +text-decoration: underline; +color: var(--color9); +} +.colhead .sign, .colhead_dark .sign { + padding: 0px 8px 0px 8px; + vertical-align: middle; + text-align: center; + font-size: 12pt; + font-weight: bold; +} + + +.colhead .sign { + padding: 0px 8px 0px 8px; + font-size: 12pt; + font-weight: bold; +} + +.colhead_dark { + background: var(--color2); + color: var(--color9); +} +.staff_post .colhead_dark { + background: var(--color16); +} + +td.label { + font-weight: bold; + text-align: right; + width: 180px; +} + +.label_annotate { + font-weight: normal; + text-align: right; + margin: 0px; +} + +table.slice { + margin-top: -1px; +} + +.error_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color11); + text-align: center; + color: var(--color71); + font-weight: bold; +} + +.save_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color12); + text-align: center; + color: var(--color24); + font-weight: bold; +} + +.elem_error { + border: 3px solid var(--color13); +} + +.hidden { + display: none; +} + +ul.nobullet { + display: inline-block; +} + + +/* Layout (home page) */ + +ul.stats li { + padding: 0px 0px 1px 0px; +} + +ul.poll li { + padding: 0px 0px 0px 10px; + margin: 0px; + clear: left; +} + +ul.poll li.graph { + margin-bottom: 3px; + padding-left: 20px; +} + +/* Layout (Torrents page) */ + +.show_torrents { + width: 21px; + height: 28px; + background: url('images/show2.png') no-repeat center center; +} + +.hide_torrents { + width: 21px; + height: 28px; + background: url('images/hide2.png') no-repeat center center; +} + +.show_torrents_link { + border: none; + width: 28px; + height: 28px; + display: block; + cursor: pointer; +} + +.filter_torrents { + width: 750px; + margin: auto; + background: var(--color10); +} + +.filter_torrents .submit { + text-align: right; + padding-top: 5px; +} + +.filter_torrents .ft_cat_list { + border-top: 1px solid var(--color10); + border-bottom: 1px solid var(--color10); +} + +#content form.search_form + .torrent_table { + margin-top: 20px; +} + +#content form.search_form .submit { + text-align: center; +} + +.cat_list tr td { + border: none; +} + +.torrent_table tr { + /* vertical-align: top; */ + vertical-align: middle; +} + +h3 a { + color: white; +} + +.torrent_table .number_column { + text-align: center; +} + +.torrent_table, .torrent_table td { + border: none; +} + +.torrent_table tr.torrent, .torrent_table tr.group { + font-weight: bold; +} + +.torrent_table tr.group { + background-color: var(--color17); +} +.torrent_table tr.group_torrent { + background-color: var(--color10); +} +.torrent_table tr.torrent { + background-color: var(--color10); +} + +.torrent_table tr.group td.center:first-child { + padding: 3px; + width: 21px; +} +.torrent_table tr.torrent:nth-child(2n) { + background-color: var(--color14); +} +.torrent_table tr.torrent:nth-child(2n-1) { + background-color: var(--color15); +} +/* +It is not possible to .addClass() nth-child so a new style must be created with +the same css attributes as the nth-child lines above. +Also defining an extra style class with nth-child also does not work so an extra +css block is needed for .rowlight and .rowdark*/ +.torrent_table tr.torrent.rowlight { + background-color: var(--color14); +} +.torrent_table tr.torrent.rowdark { + background-color: var(--color15); +} + +.torrent_table div.tags { + font-weight: normal; + max-width: 500px; +} + +.torrent_table tr .center, #collage_table td { + vertical-align: middle; + text-align: center; +} + +.group_torrent span { + float: right; +} + +.torrent span { + font-weight: normal; + float: right; +} + +.nobr { + white-space: nowrap; +} + +/* Layout (Forums) */ + +.last_read {margin-left: 5px; fill: var(--color78);} +.colhead_dark .last_read {fill: var(--color78);} + +.unread_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_unread.png) no-repeat center center;} +.read_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_read.png) no-repeat center center;} +.read_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_read.png) no-repeat center center;} +.unread_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_unread.png) no-repeat center center;} +.unread_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_unread.png) no-repeat center center;} +.read_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_read.png) no-repeat center center;} +.unread{background: url(https://sugoimusic.me/static/styles/sugoi/images/unread.png) no-repeat center center;} +.read{background: url(https://sugoimusic.me/static/styles/sugoi/images/read.png) no-repeat center center;} +strong.quoteheader {color: var(--color25);} + +tr.row:nth-of-type(odd) { + background-color: var(--color50); +} + +table.forum_post { + margin: 10px 0px; +} + +table.forum_post td { + /* border: 1px solid var(--color22); */ + border: none; +} + +table.forum_unread { + border: 2px solid var(--color80); +} + +td.avatar { + width: 150px; + padding: 0px; +} + +.box_description > div:not(.head) { + max-height: 400px; + overflow-y: scroll; +} +.box_description, table.forum_post td.body { + word-break: break-word; + word-wrap: break-word; + display: inline-block; +} +.box_description { + width: 100%; +} +.thin > table.forum_post td.body { + width: 690px; +} +#torrent_comments table.forum_post td.body { + width: 422px; +} + +blockquote { + margin: 10px; + padding: 10px; + /* border: 1px dashed var(--color22); */ + border: 1px solid var(--color27); + background: var(--color48); +} + + +/* Layout (Inbox) */ + + +tr.unreadpm { + background-color: var(--color68); +} + +/* Layout (Permission Page) */ + +.permission_head { + width: 400px; + margin-left: auto; + margin-right: auto; +} + +.permissions { + width: 930px; + margin-left: auto; + margin-right: auto; +} + +.permission_container { + float: left; + width: 300px; + padding: 5px; +} +.permission_container input { + margin: 0px 3px 5px 0px; + vertical-align: top; +} + +.submit_container { + clear: both; + text-align: right; +} + +/* Layout (Invite tree) */ + +ul .invitetree { + margin: 0px 0px 0px 25px; +} + +.invitetree li { + list-style: none; + margin: 10px 2px; +} + +/* Layout (User options) */ + +.user_options .options_list li { + margin: 0; +} + +/* Layout (MISC) */ + +.left_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.center_poll { + height: 9px; + background: var(--color28); + border-radius: 4px; + float: left; + margin: 0px; + padding: 0px; +} + +.right_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.curtain { + position: fixed; + top: 0%; + left: 0%; + width: 100%; + height: 100%; + background-color: black; + z-index: 1001; + -moz-opacity: 0.8; + opacity: .80; + filter: alpha(opacity=80); +} + +.lightbox { + position: fixed; + text-align: center; + top: 5%; + left: 5%; + width: 90%; + height: 90%; + padding: 0px; + z-index: 1002; + overflow: auto; +} + +.center { + text-align: center; +} + +.spellcheck { + margin: 25px 0; + font-size: 1.25em; + font-weight: bold; +} + +tr.torrent .bookmark > a:before { + color: black; +} +tr.torrent .bookmark > a:after { + color: black; +} + +.field_div { + margin-bottom: 10px; +} + +.edit_changelog textarea { + width: 600px; +} + +.brackets { + font-weight: normal; + color: var(--color76); +} + +div[class~=tooltipster-content] > a { + color: var(--color20); +} + +.post_id { + font-weight: normal; + margin-bottom: 5px; /* Hack to allow forum thread head column to look OK even if user has no displayed badges */ +} + +.vote_tag_up, .vote_artist_up, .vote_album_up, .small_upvote, .small_upvoted { + color: var(--color72); +} + +.vote_tag_down, .vote_artist_down, .vote_album_down, .small_downvote, .small_downvoted { + color: var(--color73); +} + +/* get rid of extraneous padding in the Top Contributors box */ +#request_top_contrib { + border: none; +} +#request_top_contrib tr:first-child th { + border-top: 0; +} +#request_top_contrib tr:last-child td { + border-bottom: 0; +} +#request_top_contrib tr td:first-child, +#request_top_contrib tr th:first-child, +#request_top_contrib tr td:nth-child(2), +#request_top_contrib tr th:nth-child(2) { + border-left: 0; + border-top: 0; +} +#request_top_contrib tr td:last-child, +#request_top_contrib tr th:last-child { + border-right: 0; +} + +#requests table.layout.cat_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#requests tr#media_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#request_table { + margin-bottom: 5px; +} +#request_table .request:nth-of-type(odd){ + background: var(--color3); +} +#request_table .request:nth-of-type(even){ + background: var(--color18); +} + +/* workaround for calendar display issue */ +div.sidebar #event_div { + margin-left: -232px; +} + +ol { + margin-left: 1em; +} + +#forum_search_cat_list { + border: none; +} + +#coverCont { + background-color: var(--color18); + padding: 5px; + box-shadow: 0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2); +} +#coverCont img { + background-color: var(--color18); +} +.torrent_info { + font-size: 100%; + font-weight: 100; +} +.group_info > a:last-of-type { + text-decoration: underline; +} +.group_image { + padding-right: 1em; +} + +.recent_snatches_images, .recent_uploads_images { + position: relative; +} + +.edit_tags_votes { + padding-left: 5px; +} + +.row_hl { + background-color: var(--color68); +} + +input.inputtext { + border: none; + border-bottom: 1px solid var(--color19); + background-color: rgba(0, 0, 0, 0); + font-size: 13px; + outline: none; + transition: ease-in-out 0.12s; +} +input.inputtext:focus { + border-bottom: 1px solid var(--color2); +} + +input, textarea { + background-color: var(--color60); + padding: 5px 5px; + color: var(--color61); + outline: none; + border: none; +} + +select { + padding: 5px 5px; + background-color: var(--color66); + color: var(--color67); + border-radius: 0px; + outline: 0; + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; +} + +.bbcode_bar { + background: var(--color74); + border-bottom: none; + color: var(--color75); +} +.collage_images .collage_image { + margin: 1px; + width: 121px; + display: inline-block; +} + +.box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table { + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); +} +#userinfo { + box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -2px rgba(0, 0, 0, 0.2), 0 0px 5px 0 rgba(0, 0, 0, 0.12); +} + +.last_edited { + font-size: 10px; + opacity: 0.7; +} + +#comm_badge_tr .badge_icon, #user_badge_edit_tr .badge_icon { + margin-right: 1em; + margin-left: 2px; +} + +.store_table .badge_icon { + display: inline-block; +} + +.store_table .badge_icon img { + display: block; + margin-left: auto; + margin-right: auto; +} + +.hnr-yes { + color: red; +} +.hnr-no { + color: green; +} + +.webm { + max-width: 100%; +} + +.point_gift_box p { + margin: 7px 2px 0px; +} +.point_gift_box input[type="text"], .point_gift_box textarea { + width: 100%; + box-sizing: border-box; +} +.dead { + opacity: 0.6; +} +.search_warning { + fill: var(--color2); +} +.tl_reported { + color: var(--color32); +} + +.tl_snatched { + color: var(--color33); +} +.tl_leeching { + color: var(--color34); +} +.tl_seeding { + color: var(--color35); +} +caption { + border-bottom: 1px solid var(--color27); + font-weight: bold; +} + +#noty_bottomRight_layout_container li { + background-color:var(--color29) !important; + color: var(--color30) !important; + border: none !important; +} + +.noty_buttons { + background-color: var(--color10) !important; + border-top: none !important; +} + + +.tag_parody { + color: #e08e00 !important; +} +.tag_character { + color: #099809 !important; +} +.tag_female { + color: #d51b8a !important; +} +.tag_male { + color: #0000ff !important; +} + +.collage_image:hover { + box-shadow: 0px 0px 0px 3px var(--color79); + position: relative; +} diff --git a/static/styles/noir2/style.css b/static/styles/noir2/style.css new file mode 100644 index 0000000..d875d3d --- /dev/null +++ b/static/styles/noir2/style.css @@ -0,0 +1,1404 @@ +/*Sugoi Noir II*/ +:root { + /*header*/ + --color36: #222; /*header*/ + --color5: #444; /*menu bar*/ + --color7: #333; /*menu bar hover*/ + --color9: #FFF; /*text menu bar*/ + --color38: #CCC; /*search text*/ + --color37: #1c1c1c; /*search background*/ + --color41: #999; /*userinfo text*/ + --color83: #1c1c1c; /*userinfo background*/ + /*general*/ + --color14: #222; /*torrent table background, torrents list 1&2, requests list 1&2, forum list*/ + --color0: #222; /*background*/ + --color82: #333; /*content background*/ + --color1: #121212; /*top posts*/ + --color42: #CCC; /*header text*/ + --color4: #999; /*text*/ + --color77: #CCC; /*text a*/ + --color44: #CCC; /*link*/ + --color70: #999; /*link hover*/ + --color60: #DDD; /*input textarea background*/ + --color61: #222; /*input textarea text*/ + /*interface elements*/ + --color64: #333; /*button, cat-selector*/ + --color65: #555;/*button hover*/ + --color67: #CCC; /*cat-selector text*/ + --color74: #333; /*bbcode_bar background*/ + --color75: #999; /*bbcode_bar text*/ + --color76: #BBB; /*brackets*/ + --color40: #999; /*tags*/ + + --color6: #565656; /*menu & filter menu active*/ + --color79: #444; /*collage_image:hover*/ + --color19: #444; /*border request*/ + --color20: #444; /*tooltipster-content*/ + /*forum*/ + --color25: #AAA; /*quote username color*/ + --color27: #222; /*quote border*/ + --color48: #333; /*quote background*/ + --color43: #CCC; /*text coldhead*/ + --color16: #008572; /*staff forum post*/ + --color78: #FFF; /*colhead_dark .last_read & arrow*/ + --color80: #BBB; /*unread forum message*/ + /*notifications*/ + --color8: #333; /*alarm bar*/ + --color39: #DDD; /*alarm bar text*/ + --color29: #DDD; /*noty bottomRight top*/ + --color30: #444; /*noty_bottomRigh top text*/ + /*misc*/ + --color68: #000; /*unreadpm, ratio bracket*/ + --color28: #EEE; /*poll*/ + --color45: #000000; /*footer*/ + /*****************************/ + --color32: red; /*reported*/ + --color33: #C35C1C; /*snatched*/ + --color34: #BD0D0D; /*leeching*/ + --color35: #068206; /*seeding*/ + --color72: green; /*vote_tag_up*/ + --color73: red; /*vote_tag_down*/ + --color11: #AF2525; /*error_message background*/ + --color71: white; /*error_message text*/ + --color12: #F4E649; /*save_message background*/ + --color13: #B00D0D; /*elem_error*/ + /*border*/ + --color21: #333; /*general*/ + --color81: #222; /*searchbar*/ + --color31: #333; /*site debug border*/ +} + +/*personal additions*/ +.colhead_dark a { + color: var(--color43); +} + +.autocomplete-suggestions strong { + font-weight: normal; + color: #0B2593; +} + +table.center.group_displayname { +border: none; +} + +#forums td { + border: 1px solid var(--color21); +} +#forums td.body.valign_top { + border: none; +} + +#torrents td { + border: none; +} +#torrents td.number_column { + border: 1px solid var(--color21) +} + +/* Layout (Torrents page) */ + +#site_debug td{ + border: 1px solid var(--color31); +} + +/* Global */ +* { + padding: 0em; + margin: 0em; +} + +html { + width: 100%; +} + +body { + width: 100%; + background-color: var(--color0); + font-family: tahoma, helvetica, sans-serif; + font-size: 8pt; + color: var(--color4); + min-width: 850px; +} + +/* Common elements */ + +.header a, h2{ + color: var(--color42); +} + +a { + text-decoration: none; + border: none; + color: var(--color77); +} + +a:hover { + text-decoration: underline; +} + +button, input[type=button], input[type=submit] { + background: var(--color64); + box-shadow: none; + color: var(--color9); + border: 1px solid var(--color21); +} +button:hover, input[type=button]:hover, input[type=submit]:hover { + background: var(--color65); +} +button:focus, input[type=button]:focus, input[type=submit]:focus { + background: var(--color65); +} + +.spoilerButton { + max-width: 540px; +} + +.forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a { + text-decoration: none; + border: 1px white; + color: var(--color44); +} + +.forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover { + text-decoration: underline; + border: 1px white; + color: var(--color70); +} + +h1,h2,h3,h4 { + margin: 5px 0px; + font-weight: bold; + color: var(--color42); +} + +h2 { + text-align: center; + font-size: 12pt; +} + +h4 { + font-size: 8pt; +} + +p { + margin: 10px 5px; +} + +li { + margin: 5px 15px; +} + +img { + border: none; +} + +/* Styles generated by the BBCode parser */ + +span.size1 { font-size:0.75em; } +span.size2 { font-size:1em; } +span.size3 { font-size:1.25em; } +span.size4 { font-size:1.5em; } +span.size5 { font-size:1.75em; } +span.size6 { font-size:2em; } +span.size7 { font-size:2.25em; } +span.size8 { font-size:2.5em; } +span.size9 { font-size:2.75em; } +span.size10 { font-size:3em; } + +ul.thin { margin:0px 0px 0px 25px; padding:0px; } +ul.thin li { margin:0px 0px; padding:0px; } + +/* Layout (Every page) */ + +#header { + width: 100%; + padding: 0px 0 0 0; + background: var(--color36); + margin-bottom: 10px; +} + +#content { + margin: auto; + margin-top: 10px; + width: 90%; + min-width: 872px; + overflow: hidden; + background: var(--color82); +} + +#footer { + margin-top: 10px; + width: 100%; + text-align: center; + padding: 1em 0; + opacity: 0; + transition: ease-in-out 0.3s; + transition-delay: 0.7s; + /* color: var(--color4); */ +} +#footer:hover { + opacity: 1; +} +#footer a { + color: var(--color45); +} +#footer a:hover { + text-decoration: underline; +} + +#logo { + width: 300px; + height: 197px; + margin: 0 auto; +} + +#logo a { + border: none; + width: 100%; + height: 197px; + display: block; +} + +#logo a:hover { + border: none; +} + +#menu { + width: 70%; + margin-left: auto; + margin-right: auto; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#menu > ul { + display: flex; + width: 100%; + margin: 0 auto; +} + +#menu > ul > li { + position: relative; + height: 32px; + display: flex; + margin: 0; + flex: 1 1 auto; +} + +#menu ul > li > a { + padding: 0.6em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.2s; +} + +#nav_links { + max-width: 40px; +} + +#menu ul li a.active { + background-color: var(--color6); +} + +#menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#menu .nav_dropdown { + background: var(--color5); + margin-top: 0; +} + +.nav_dropdown > div { + position: absolute; + background-color: var(--color5); + width: 100%; + z-index: 99999; + margin-top: 32px; + left: 0; +} + +#nav_links > #links_menu { + width: 120px; + margin-left: -80px; +} + +.nav_dropdown > div > a { + display: none; + color: var(--color9); + height: 32px; + line-height: 32px; +} + +.nav_dropdown:hover > div > a { + display: block; +} + +#filter_menu { + width: 100%; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#filter_menu > ul { + display: flex; + width: 80%; + margin: 0 auto; +} + +#filter_menu > ul > li { + position: relative; + height: 26px; + display: flex; + margin: 0; + flex: 1 1 auto; +} + +#filter_menu ul > li > a { + padding: 0.4em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.1s; +} + +#filter_menu ul li a.active { + background-color: var(--color6); +} + +#filter_menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#userinfo { +/* position: absolute; + top: 258px; */ + color: var(--color41); + padding: 4px 0px; + width: 90%; + margin-left: auto; + margin-right: auto; + text-align: center; + font-size: 8pt; + background-color: var(--color83); + /* border-bottom: 1px solid #999; */ +} + +#userinfo img { + margin-top: -5px; +} + +#userinfo ul { + display: inline; + margin: 0px 0.8%; +} + +#userinfo ul li { + display: inline; + margin: 0 0.1em; + line-height: 20px; + vertical-align: middle; + padding: 0px; +} + +#userinfo a { + color: var(--color9); +} +#userinfo a:hover { + text-decoration: underline; +} + +#userinfo b a { + font-weight: normal; + font-size: 0.9em; + font-weight: bold; +} + +#searchbars { + text-align: center; + box-sizing: border-box; + display: flex; + width: 60%; + margin: 4px auto; + min-width: 850px; +} + +#searchbars > .search_form { + flex: 1 1 auto; + text-align: center; + margin: 0 3px; + border: 1px solid var(--color81); +} + +#searchbars input { + position: relative; + border: none; + box-sizing: border-box; + padding: 2px 2px 2px 4px; + font-size: 0.9em; + background-color: var(--color37); + width: 100%; + color: var(--color38); +} + +#searchbars ul { + margin: 0 auto; + display: block; + text-align: center; +} + +#searchbars ul li { + display: inline; + margin: 0px 1px; + list-style: none; + position: relative; +} + +#searchbars ul li ul { + display: block; + position: absolute; + top: 1em; + left: 0; + z-index: 1000; + background-color: var(--color14); + width: 12em; + margin-top: 12px; +} + +#searchbars ul li ul li { + margin: 0 0 0 0; + padding: 0; + display: block; + width: 100%; +} + +#searchbars ul li ul li.highlight { + background: var(--color14); +} + +#searchbars ul li form { + display: inline; +} + +#alerts { +/* margin-top: 85px; + margin-bottom: -85px; */ +/* padding: 10px 0px; */ + margin: 10px 0px; +} + +#cat-selector ul { + width: 100%; +} + +#cat-selector ul li { + display: inline; + width: 12em; + height: 1em; + float: left; +} + +.alertbar { + border: 1px solid var(--color21); + background-color: var(--color8); + text-align: center; + color: var(--color4); + font-weight: bold; + font-size: 0.95em; + width: 350px; + margin: 0 auto 0px auto; + padding: 10px; +} +.alertbar a { + color: var(--color39); + text-decoration: none; +} +.alertbar a:hover { + text-decoration: underline; +} + +/* IE doesn't appear to like a simple display:none in our header. Random things start fucking up pretty badly. */ +.hidden { + position: absolute; + left: -10000px; +} + +input.hidden { + position: absolute; + display: none; +} + +/* Layout (Any page) */ + + +.thin { + width: 850px; + margin: 0px auto; +} + +#userinfo_major .brackets:before { + font-weight: bold; +} + +#userinfo_major .brackets:after { + font-weight: bold; +} + +#userinfo #userinfo_minor { + position: absolute; + text-align: left; +} + +#userinfo_minor > li > ul { + display: none; + position: absolute; + padding: 5px; + left: -5px; + background-color: var(--color8); + z-index: 100; +} + +#userinfo_minor li { + display: block; +} + +div.linkbox { + text-align:center; + padding: 5px; +} + +.center { + text-align: center; +} + +.right { + text-align: right; +} + +.min_padding { + padding: 0px; + margin: 0px 0px; +} + +p.min_padding { + margin: 2px 0px; +} + +.pad { + padding: 1em; +} + +.slight_margin { + margin: 4px; +} + +.vertical_space { + margin-bottom: 10px; +} + +.box { + font-size: 8pt; + background-color: var(--color14); + border: 1px solid var(--color21); + margin-bottom: 10px; +} + +.torrents_nomatch { + margin-top: 10px; +} + +.box2 { + margin-bottom: 10px; + font-size: 8pt; + background-color: var(--color14); + border: 1px solid var(--color21); +} + +.pad h3, .pad h4, .padbox h3, .padbox h4 { + margin-top: 0px; + padding-top: 0px; + color: var(--color42); +} + +.sidebar { + float: right; + width: 245px; +} + +.head { + padding: 4px; + border-bottom: 1px solid var(--color21); + /* background: #E1E1E1; */ + background: var(--color1); + color: var(--color9); +} + +.head a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.head a:hover { +text-decoration: underline; +color: var(--color9); +} + +.body { + padding: 3px 10px 10px 10px; +} + +.main_column { + width: 592px; +} + +#index .main_column { + margin-top: 4px; +} + +#user .main_column table { + margin-bottom: 10px; +} + +/* +These 3 #artist styles extend the width to ensure .sidebar does not steal width from .main_column +and result in it only being 592px, which despite looking ok for the news items on the main page +and other areas, it is just too thin for any torrent table. +*/ +#artist .main_column { + width: 845px; +} + +#artist .thin { + width: 1100px; +} + +body#artist { + min-width: 1225px; +} + +.tags { + padding: 0px 0px 0px 20px; + font-style: italic; +} + +.tags a { + color: var(--color40); +} + +.tags a:hover { + text-decoration: underline; +} + +.noborder { + border: none; +} + +ul.nobullet, ul.nobullet li { + list-style-type: none; +} + +table { + width: 100%; + border-collapse: collapse; + border: 1px solid var(--color21); +} + +tr { + background-color: var(--color14); +} + +td, th { + /* border: 1px solid var(--color21); */ + padding: 5px; + text-align: left; + border: 1px solid var(--color21); +} + +.colhead { + background: var(--color1); + font-weight: bold; + color: var(--color9); +} + +td.colhead, .colhead td, .colhead th { + padding-left: 10px; + padding-right: 10px; +} + +.colhead a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.colhead a:hover { +text-decoration: underline; +color: var(--color9); +} +.colhead .sign, .colhead_dark .sign { + padding: 0px 8px 0px 8px; + vertical-align: middle; + text-align: center; + font-size: 12pt; + font-weight: bold; +} + + +.colhead .sign { + padding: 0px 8px 0px 8px; + font-size: 12pt; + font-weight: bold; +} + +.colhead_dark { + background: var(--color1); + color: var(--color9); +} +.staff_post .colhead_dark { + background: var(--color16); +} + +td.label { + font-weight: bold; + text-align: right; + width: 180px; +} + +.label_annotate { + font-weight: normal; + text-align: right; + margin: 0px; +} + +table.slice { + margin-top: -1px; +} + +.error_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color11); + text-align: center; + color: var(--color71); + font-weight: bold; +} + +.save_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color12); + text-align: center; + color: var(--color24); + font-weight: bold; +} + +.elem_error { + border: 3px solid var(--color13); +} + +.hidden { + display: none; +} + +ul.nobullet { + display: inline-block; +} + + +/* Layout (home page) */ + +ul.stats li { + padding: 0px 0px 1px 0px; +} + +ul.poll li { + padding: 0px 0px 0px 10px; + margin: 0px; + clear: left; +} + +ul.poll li.graph { + margin-bottom: 3px; + padding-left: 20px; +} + +/* Layout (Torrents page) */ + +.show_torrents { + width: 21px; + height: 28px; + background: url('images/show2.png') no-repeat center center; +} + +.hide_torrents { + width: 21px; + height: 28px; + background: url('images/hide2.png') no-repeat center center; +} + +.show_torrents_link { + border: none; + width: 28px; + height: 28px; + display: block; + cursor: pointer; +} + +.filter_torrents { + width: 750px; + margin: auto; + background: var(--color14); +} + +.filter_torrents .submit { + text-align: right; + padding-top: 5px; +} + +.filter_torrents .ft_cat_list { + border-top: 1px solid var(--color14); + border-bottom: 1px solid var(--color14); +} + +#content form.search_form + .torrent_table { + margin-top: 20px; +} + +#content form.search_form .submit { + text-align: center; +} + +.cat_list tr td { + border: none; +} + +.torrent_table tr { + /* vertical-align: top; */ + vertical-align: middle; + border: 1px solid var(--color21); +} + +h3 a { + color: white; +} + +.torrent_table .number_column { + text-align: center; +} + +.torrent_table, .torrent_table td { + border: 1px solid var(--color21); +} + +.torrent_table tr.torrent, .torrent_table tr.group { + font-weight: bold; +} + +.torrent_table tr.group { + background-color: var(--color14); +} +.torrent_table tr.group_torrent { + background-color: var(--color14); +} +.torrent_table tr.torrent { + background-color: var(--color14); +} + +.torrent_table tr.group td.center:first-child { + padding: 3px; + width: 21px; +} +.torrent_table tr.torrent:nth-child(2n) { + background-color: var(--color14); +} +.torrent_table tr.torrent:nth-child(2n-1) { + background-color: var(--color14); +} +/* +It is not possible to .addClass() nth-child so a new style must be created with +the same css attributes as the nth-child lines above. +Also defining an extra style class with nth-child also does not work so an extra +css block is needed for .rowlight and .rowdark*/ +.torrent_table tr.torrent.rowlight { + background-color: var(--color14); +} +.torrent_table tr.torrent.rowdark { + background-color: var(--color14); +} + +.torrent_table div.tags { + font-weight: normal; + max-width: 500px; +} + +.torrent_table tr .center, #collage_table td { + vertical-align: middle; + text-align: center; +} + +.group_torrent span { + float: right; +} + +.torrent span { + font-weight: normal; + float: right; +} + +.nobr { + white-space: nowrap; +} + +/* Layout (Forums) */ + +.last_read {margin-left: 5px; fill: var(--color78);} +.colhead_dark .last_read {fill: var(--color78);} + +.unread_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_unread.png) no-repeat center center;} +.read_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_read.png) no-repeat center center;} +.read_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_read.png) no-repeat center center;} +.unread_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_unread.png) no-repeat center center;} +.unread_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_unread.png) no-repeat center center;} +.read_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_read.png) no-repeat center center;} +.unread{background: url(https://sugoimusic.me/static/styles/sugoi/images/unread.png) no-repeat center center;} +.read{background: url(https://sugoimusic.me/static/styles/sugoi/images/read.png) no-repeat center center;} +strong.quoteheader {color: var(--color25);} + +tr.row:nth-of-type(odd) { + background-color: var(--color14); +} + +table.forum_post { + margin: 10px 0px; +} + +table.forum_post td { + border: none; +} + +table.forum_unread { + border: 2px solid var(--color80); +} + +td.avatar { + width: 150px; + padding: 0px; +} + +.box_description > div:not(.head) { + max-height: 400px; + overflow-y: scroll; +} +.box_description, table.forum_post td.body { + word-break: break-word; + word-wrap: break-word; + display: inline-block; +} +.box_description { + width: 100%; +} +.thin > table.forum_post td.body { + width: 690px; +} +#torrent_comments table.forum_post td.body { + width: 422px; +} + +blockquote { + margin: 10px; + padding: 10px; + /* border: 1px dashed var(--color22); */ + border: 1px dashed var(--color27); + background: var(--color48); +} + + +/* Layout (Inbox) */ + + +tr.unreadpm { + background-color: var(--color68); +} + +/* Layout (Permission Page) */ + +.permission_head { + width: 400px; + margin-left: auto; + margin-right: auto; +} + +.permissions { + width: 930px; + margin-left: auto; + margin-right: auto; +} + +.permission_container { + float: left; + width: 300px; + padding: 5px; +} +.permission_container input { + margin: 0px 3px 5px 0px; + vertical-align: top; +} + +.submit_container { + clear: both; + text-align: right; +} + +/* Layout (Invite tree) */ + +ul .invitetree { + margin: 0px 0px 0px 25px; +} + +.invitetree li { + list-style: none; + margin: 10px 2px; +} + +/* Layout (User options) */ + +.user_options .options_list li { + margin: 0; +} + +/* Layout (MISC) */ + +.left_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.center_poll { + height: 9px; + background: var(--color28); + border-radius: 4px; + float: left; + margin: 0px; + padding: 0px; +} + +.right_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.curtain { + position: fixed; + top: 0%; + left: 0%; + width: 100%; + height: 100%; + background-color: black; + z-index: 1001; + -moz-opacity: 0.8; + opacity: .80; + filter: alpha(opacity=80); +} + +.lightbox { + position: fixed; + text-align: center; + top: 5%; + left: 5%; + width: 90%; + height: 90%; + padding: 0px; + z-index: 1002; + overflow: auto; +} + +.center { + text-align: center; +} + +.spellcheck { + margin: 25px 0; + font-size: 1.25em; + font-weight: bold; +} + +tr.torrent .bookmark > a:before { + color: black; +} +tr.torrent .bookmark > a:after { + color: black; +} + +.field_div { + margin-bottom: 10px; +} + +.edit_changelog textarea { + width: 600px; +} + +.brackets { + font-weight: normal; + color: var(--color76); +} + +div[class~=tooltipster-content] > a { + color: var(--color20); +} + +.post_id { + font-weight: normal; + margin-bottom: 5px; /* Hack to allow forum thread head column to look OK even if user has no displayed badges */ +} + +.vote_tag_up, .vote_artist_up, .vote_album_up, .small_upvote, .small_upvoted { + color: var(--color72); +} + +.vote_tag_down, .vote_artist_down, .vote_album_down, .small_downvote, .small_downvoted { + color: var(--color73); +} + +/* get rid of extraneous padding in the Top Contributors box */ +#request_top_contrib { + border: none; +} +#request_top_contrib tr:first-child th { + border-top: 0; +} +#request_top_contrib tr:last-child td { + border-bottom: 0; +} +#request_top_contrib tr td:first-child, +#request_top_contrib tr th:first-child, +#request_top_contrib tr td:nth-child(2), +#request_top_contrib tr th:nth-child(2) { + border-left: 0; + border-top: 0; +} +#request_top_contrib tr td:last-child, +#request_top_contrib tr th:last-child { + border-right: 0; +} + +#requests table.layout.cat_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#requests tr#media_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#request_table { + margin-bottom: 5px; + border: 1px solid var(--color21); +} +#request_table .request:nth-of-type(odd){ + background: var(--color14); +} +#request_table .request:nth-of-type(even){ + background: var(--color14); +} + +/* workaround for calendar display issue */ +div.sidebar #event_div { + margin-left: -232px; +} + +ol { + margin-left: 1em; +} + +#forum_search_cat_list { + border: none; +} + +#coverCont { + background-color: var(--color14); + padding: 5px; + box-shadow: none; +} +#coverCont img { + background-color: var(--color14); +} +.torrent_info { + font-size: 100%; + font-weight: 100; +} +.group_info > a:last-of-type { + text-decoration: underline; +} +.group_image { + padding-right: 1em; +} + +.recent_snatches_images, .recent_uploads_images { + position: relative; +} + +.edit_tags_votes { + padding-left: 5px; +} + +.row_hl { + background-color: var(--color68); +} + +input.inputtext { + border: none; + border-bottom: 1px solid var(--color21); + background-color: var(--color60); + font-size: 13px; + outline: none; + transition: ease-in-out 0.12s; +} +input.inputtext:focus { + border-bottom: 1px solid var(--color1); +} + +input, textarea { + background-color: var(--color60); + padding: 5px 5px; + color: var(--color61); + outline: none; + border: 1px solid var(--color21); +} + +select { + padding: 5px 5px; + background-color: var(--color64); + color: var(--color67); + border-radius: 0px; + outline: 1px solid var(--color21); + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; +} + +.bbcode_bar { + background: var(--color74); + border-bottom: none; + color: var(--color75); +} +.collage_images .collage_image { + margin: 1px; + width: 121px; + display: inline-block; +} + +.box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table { + box-shadow: none; +} +#userinfo { + box-shadow: none; +} + +.last_edited { + font-size: 10px; + opacity: 0.7; +} + +#comm_badge_tr .badge_icon, #user_badge_edit_tr .badge_icon { + margin-right: 1em; + margin-left: 2px; +} + +.store_table .badge_icon { + display: inline-block; +} + +.store_table .badge_icon img { + display: block; + margin-left: auto; + margin-right: auto; +} + +.hnr-yes { + color: red; +} +.hnr-no { + color: green; +} + +.webm { + max-width: 100%; +} + +.point_gift_box p { + margin: 7px 2px 0px; +} +.point_gift_box input[type="text"], .point_gift_box textarea { + width: 100%; + box-sizing: border-box; +} +.dead { + opacity: 0.6; +} +.search_warning { + fill: var(--color1); +} +.tl_reported { + color: var(--color32); +} + +.tl_snatched { + color: var(--color33); +} +.tl_leeching { + color: var(--color34); +} +.tl_seeding { + color: var(--color35); +} +caption { + border-bottom: 1px solid var(--color27); + font-weight: bold; +} + +#noty_bottomRight_layout_container li { + background-color:var(--color29) !important; + color: var(--color30) !important; + border: 1px solid var(--color21) !important; +} + +.noty_buttons { + background-color: var(--color14) !important; + border: 1px solid var(--color21) !important; +} + + +.tag_parody { + color: #e08e00 !important; +} +.tag_character { + color: #099809 !important; +} +.tag_female { + color: #d51b8a !important; +} +.tag_male { + color: #0000ff !important; +} + +.collage_image:hover { + box-shadow: none; + position: relative; +} diff --git a/static/styles/nostalgia/style.css b/static/styles/nostalgia/style.css new file mode 100644 index 0000000..b016279 --- /dev/null +++ b/static/styles/nostalgia/style.css @@ -0,0 +1,1463 @@ +/*Sugoi JPS Nostalgia*/ +:root { + /*header*/ + --color36: #D3EEFD; /*header*/ + --color5: #D3EEFD; /*menu bar*/ + --color7: #98D9FF; /*menu bar hover*/ + --color9: #222; /*text menu bar*/ + --color37: #E2F4FE; /*search background*/ + --color38: #444; /*search text*/ + --color41: #444; /*user info*/ + /*general*/ + --color0: #F6FAFD; /*background*/ + --color10: #ffffff; /*posts background*/ + --color1: #D3EEFD; /*top posts*/ + --color2: #D3EEFD; /*top posts 2*/ + --color42: #000000; /*header text*/ + --color4: #000000; /*text*/ + --color77: #003399; /*text a*/ + --color60: #ffffff; /*input textarea background*/ + --color61: #000000; /*input textarea*/ + /*interface elements*/ + --color64: #F4F4F4; /*button*/ + --color65: #F6FAFD;/*button hover*/ + --color66: #F4F4F4; /*cat-selector*/ + --color67: #000000; /*cat-selector text*/ + --color74: #ffffff; /*bbcode_bar background*/ + --color75: #222; /*bbcode_bar text*/ + --color76: #000000; /*brackets*/ + --color40: #222; /*tags*/ + + --color6: #565656; /*menu & filter menu active*/ + --color14: #F4F4F4; /*torrent table background*/ + --color15: #F4F4F4; /*torrents list*/ + --color17: #F4F4F4; /*torrents list 2*/ + --color18: #F4F4F4; /*requests list */ + --color3: #F4F4F4; /*requests list 2*/ + --color79: #AAAAAA; /*collage_image:hover*/ + --color19: #AAAAAA; /*border request*/ + --color20: #AAAAAA; /*tooltipster-content*/ + --color81: #000000; /*torrent group hide/unhide*/ + /*forum*/ + --color50: #F4F4F4; /*forum lists*/ + --color25: #000ff; /*quote username color*/ + --color27: #666; /*quote border*/ + --color48: #ffffff; /*quote background*/ + --color43: #222; /*text coldhead*/ + --color44: #003399; /*link*/ + --color70: red; /*link hover*/ + --color16: #D3EEFD; /*staff forum post*/ + --color78: #AAAAAA; /*colhead_dark .last_read & arrow*/ + --color80: #F0BBD6; /*unread forum message*/ + /*notifications*/ + --color8: #9DDBFE; /*alarm bar*/ + --color39: #555; /*alarm bar text*/ + --color29: #D3EEFD; /*noty bottomRight top*/ + --color30: #000000; /*noty_bottomRigh top text*/ + /*misc*/ + --color68: #ECC; /*unreadpm, ratio bracket*/ + --color28: #d9e0ff; /*poll*/ + --color45: #000000; /*footer*/ + --color31: #F6FAFD; /*site debug border*/ + --color32: red; /*reported*/ + --color33: #C35C1C; /*snatched*/ + --color34: #BD0D0D; /*leeching*/ + --color35: #068206; /*seeding*/ + --color72: green; /*vote_tag_up*/ + --color73: red; /*vote_tag_down*/ + --color11: #AF2525; /*error_message background*/ + --color71: white; /*error_message text*/ + --color12: #F4E649; /*save_message background*/ + --color13: #B00D0D; /*elem_error*/ + --color21: #999; /*border*/ +} + +/*personal additions*/ +.colhead_dark a { + color: var(--color43); +} + +.autocomplete-suggestions strong { + font-weight: normal; + color: #0B2593; +} + +/* Layout (Torrents page) */ + +#site_debug td{ + border: 1px solid var(--color31); +} + +/* Global */ +* { + padding: 0em; + margin: 0em; +} + +html { + width: 100%; +} + +body { + width: 100%; + background-color: var(--color0); + font-family: tahoma, helvetica, sans-serif; + font-size: 8pt; + color: var(--color4); + min-width: 850px; +} + +/* Common elements */ + +.header a, h2{ + color: var(--color42); +} + +a { + text-decoration: none; + border: none; + color: var(--color77); +} + +a:hover { + text-decoration: underline; +} + +button, input[type=button], input[type=submit] { + background: var(--color64); + box-shadow: none; + color: var(--color9); + border: 1px solid var(--color21); +} +button:hover, input[type=button]:hover, input[type=submit]:hover { + background: var(--color65); +} +button:focus, input[type=button]:focus, input[type=submit]:focus { + background: var(--color65); +} + +.spoilerButton { + max-width: 540px; +} + +.forum_list .forum_index td:nth-of-type(2) { + width: 20%; +} + +.forum_post .body a:not([href="#"]), .rule_summary a, .wiki_article a, #actual_rules a, .news_post .pad a, .store_table a { + text-decoration: none; + border: 1px white; + color: var(--color44); +} + +.forum_post .body a:hover:not([href="#"]), .rule_summary a:hover, .wiki_article a:hover, #actual_rules a:hover, .news_post .pad a:hover, .store_table a:hover { + text-decoration: underline; + border: 1px white; + color: var(--color70); +} + +h1,h2,h3,h4 { + margin: 5px 0px; + font-weight: bold; + color: var(--color42); +} + +h2 { + text-align: center; + font-size: 12pt; +} + +h4 { + font-size: 8pt; +} + +p { + margin: 10px 5px; +} + +li { + margin: 5px 15px; +} + +img { + border: none; +} + +/* Styles generated by the BBCode parser */ + +span.size1 { font-size:0.75em; } +span.size2 { font-size:1em; } +span.size3 { font-size:1.25em; } +span.size4 { font-size:1.5em; } +span.size5 { font-size:1.75em; } +span.size6 { font-size:2em; } +span.size7 { font-size:2.25em; } +span.size8 { font-size:2.5em; } +span.size9 { font-size:2.75em; } +span.size10 { font-size:3em; } + +ul.thin { margin:0px 0px 0px 25px; padding:0px; } +ul.thin li { margin:0px 0px; padding:0px; } + +/* Layout (Every page) */ + +#header { + width: 100%; + padding: 0px 0 0 0; + background: var(--color36); + margin-bottom: 10px; +} + +#content { + margin: auto; + margin-top: 10px; +/* margin-top: 100px; */ + width: 90%; + min-width: 872px; + overflow: hidden; +} + +#footer { +/* margin-top: 40px; */ + margin-top: 10px; + width: 100%; + text-align: center; + padding: 1em 0; + opacity: 0; + transition: ease-in-out 0.3s; + transition-delay: 0.7s; + /* color: var(--color4); */ +} +#footer:hover { + opacity: 1; +} +#footer a { + color: var(--color45); +} +#footer a:hover { + text-decoration: underline; +} + +#logo { + width: 300px; + height: 197px; + margin: 0 auto; +} + +#logo a { + border: none; + width: 100%; + height: 197px; + display: block; +} + +#logo a:hover { + border: none; +} + +#menu { + width: 100%; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#menu > ul { + display: flex; + width: 70%; + margin: 0 auto; +} + +#menu > ul > li { + position: relative; + height: 32px; + display: flex; + margin: 0; + flex: 1 1 auto; + font-weight: bold; +} + +#menu ul > li > a { + padding: 0.6em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.2s; +} + +#nav_links { + max-width: 40px; +} + +#menu ul li a.active { + background-color: var(--color6); +} + +#menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#menu .nav_dropdown { + background: var(--color5); + margin-top: 0; +} + +.nav_dropdown > div { + position: absolute; + background-color: var(--color5); + width: 100%; + z-index: 99999; + margin-top: 32px; + left: 0; +} + +#nav_links > #links_menu { + width: 120px; + margin-left: -80px; +} + +.nav_dropdown > div > a { + display: none; + color: var(--color9); + height: 32px; + line-height: 32px; +} + +.nav_dropdown:hover > div > a { + display: block; +} + +#filter_menu { + width: 100%; + text-align: center; + background-color: var(--color5); + font-size: 10pt; +} + +#filter_menu > ul { + display: flex; + width: 80%; + margin: 0 auto; +} + +#filter_menu > ul > li { + position: relative; + height: 26px; + display: flex; + margin: 0; + flex: 1 1 auto; +} + +#filter_menu ul > li > a { + padding: 0.4em 0; + display: inline-block; + width: 100%; + color: var(--color9); + transition: ease-in-out 0.1s; +} + +#filter_menu ul li a.active { + background-color: var(--color6); +} + +#filter_menu ul li a:hover { + background-color: var(--color7); + text-decoration: none; +} + +#userinfo { +/* position: absolute; + top: 258px; */ + color: var(--color41); + padding: 4px 0px; + width: 100%; + text-align: center; + font-size: 8pt; + /* border-bottom: 1px solid #999; */ +} + +#userinfo img { + margin-top: -5px; +} + +#userinfo ul { + display: inline; + margin: 0px 0.8%; +} + +#userinfo ul li { + display: inline; + margin: 0 0.1em; + line-height: 20px; + vertical-align: middle; + padding: 0px; +} + +#userinfo a { + color: var(--color9); +} +#userinfo a:hover { + text-decoration: underline; +} + +#userinfo b a { + font-weight: normal; + font-size: 0.9em; + font-weight: bold; +} + +#searchbars { + text-align: center; + box-sizing: border-box; + display: flex; + width: 60%; + margin: 4px auto; + min-width: 850px; +} + +#searchbars > .search_form { + flex: 1 1 auto; + text-align: center; + margin: 0 3px; + border: 1px solid #CCC; +} + +#searchbars input { + position: relative; + border: none; + box-sizing: border-box; + padding: 2px 2px 2px 4px; + font-size: 0.9em; + background-color: var(--color37); + width: 100%; + color: var(--color38); +} + +#searchbars ul { + margin: 0 auto; + display: block; + text-align: center; +} + +#searchbars ul li { + display: inline; + margin: 0px 1px; + list-style: none; + position: relative; +} + +#searchbars ul li ul { + display: block; + position: absolute; + top: 1em; + left: 0; + z-index: 1000; + background-color: var(--color10); + width: 12em; + margin-top: 12px; +} + +#searchbars ul li ul li { + margin: 0 0 0 0; + padding: 0; + display: block; + width: 100%; +} + +#searchbars ul li ul li.highlight { + background: var(--color10); +} + +#searchbars ul li form { + display: inline; +} + +#alerts { +/* margin-top: 85px; + margin-bottom: -85px; */ +/* padding: 10px 0px; */ + margin: 10px 0px; +} + +#cat-selector ul { + width: 100%; +} + +#cat-selector ul li { + display: inline; + width: 12em; + height: 1em; + float: left; +} + +.alertbar { + border: 1px solid var(--color21); + background-color: var(--color8); + text-align: center; + color: var(--color4); + font-weight: bold; + font-size: 0.95em; + width: 350px; + margin: 0 auto 0px auto; + padding: 10px; +} +.alertbar a { + color: var(--color39); + text-decoration: none; +} +.alertbar a:hover { + text-decoration: underline; +} + +/* IE doesn't appear to like a simple display:none in our header. Random things start fucking up pretty badly. */ +.hidden { + position: absolute; + left: -10000px; +} + +input.hidden { + position: absolute; + display: none; +} + +/* Layout (Any page) */ + + +.thin { + width: 850px; + margin: 0px auto; +} + +#userinfo_major .brackets:before { + font-weight: bold; +} + +#userinfo_major .brackets:after { + font-weight: bold; +} + +#userinfo #userinfo_minor { + position: absolute; + text-align: left; +} + +#userinfo_minor > li > ul { + display: none; + position: absolute; + padding: 5px; + left: -5px; + background-color: var(--color8); + z-index: 100; +} + +#userinfo_minor li { + display: block; +} + +div.linkbox { + text-align:center; + padding: 5px; +} + +.center { + text-align: center; +} + +.right { + text-align: right; +} + +.min_padding { + padding: 0px; + margin: 0px 0px; +} + +p.min_padding { + margin: 2px 0px; +} + +.pad { + padding: 1em; +} + +.slight_margin { + margin: 4px; +} + +.vertical_space { + margin-bottom: 10px; +} + +.box { + font-size: 8pt; + background-color: var(--color10); + border: 1px solid var(--color21); + margin-bottom: 10px; +} + +.torrents_nomatch { + margin-top: 10px; +} + +.box2 { + margin-bottom: 10px; + font-size: 8pt; + background-color: var(--color10); + border: 1px solid var(--color21); +} + +.pad h3, .pad h4, .padbox h3, .padbox h4 { + margin-top: 0px; + padding-top: 0px; + color: var(--color42); +} + +.sidebar { + float: right; + width: 245px; +} + +.head { + padding: 4px; + border-bottom: 1px solid var(--color21); + /* background: #E1E1E1; */ + background: var(--color1); + color: var(--color9); +} + +.head a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.head a:hover { +text-decoration: underline; +color: var(--color9); +} + +.body { + padding: 3px 10px 10px 10px; +} + +.main_column { + width: 592px; +} + +#user .main_column table { + margin-bottom: 10px; +} + +/* +These 3 #artist styles extend the width to ensure .sidebar does not steal width from .main_column +and result in it only being 592px, which despite looking ok for the news items on the main page +and other areas, it is just too thin for any torrent table. +*/ +#artist .main_column { + width: 845px; +} + +#artist .thin { + width: 1100px; +} + +body#artist { + min-width: 1225px; +} + +.tags { + padding: 0px 0px 0px 20px; + font-style: italic; +} + +.tags a { + color: var(--color40); +} + +.tags a:hover { + text-decoration: underline; +} + +.noborder { + border: none; +} + +ul.nobullet, ul.nobullet li { + list-style-type: none; +} + +table { + width: 100%; + border-collapse: collapse; + border: 1px solid var(--color21); +} + +tr { + background-color: var(--color10); +} + +td, th { + /* border: 1px solid var(--color21); */ + padding: 5px; + text-align: left; + border: 1px solid var(--color21); +} + +.colhead { + background: var(--color2); + font-weight: bold; + color: var(--color9); +} + +td.colhead, .colhead td, .colhead th { + padding-left: 10px; + padding-right: 10px; +} + +.colhead a { + +text-decoration: none; +border: none; +color: var(--color9); +} + +.colhead a:hover { +text-decoration: underline; +color: var(--color9); +} +.colhead .sign, .colhead_dark .sign { + padding: 0px 8px 0px 8px; + vertical-align: middle; + text-align: center; + font-size: 12pt; + font-weight: bold; +} + + +.colhead .sign { + padding: 0px 8px 0px 8px; + font-size: 12pt; + font-weight: bold; +} + +.colhead_dark { + background: var(--color2); + color: var(--color9); +} +.staff_post .colhead_dark { + background: var(--color16); +} + +td.label { + font-weight: bold; + text-align: right; + width: 180px; +} + +.label_annotate { + font-weight: normal; + text-align: right; + margin: 0px; +} + +table.slice { + margin-top: -1px; +} + +.error_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color11); + text-align: center; + color: var(--color71); + font-weight: bold; +} + +.save_message { + border: 1px solid var(--color22); + padding: 3px 0px 3px 0px; + background-color: var(--color12); + text-align: center; + color: var(--color24); + font-weight: bold; +} + +.elem_error { + border: 3px solid var(--color13); +} + +.hidden { + display: none; +} + +ul.nobullet { + display: inline-block; +} + + +/* Layout (home page) */ + +ul.stats li { + padding: 0px 0px 1px 0px; +} + +ul.poll li { + padding: 0px 0px 0px 10px; + margin: 0px; + clear: left; +} + +ul.poll li.graph { + margin-bottom: 3px; + padding-left: 20px; +} + +/* Layout (Torrents page) */ + +.show_torrents { + width: 21px; + height: 28px; + background: url('images/show2.png') no-repeat center center; +} + +.hide_torrents { + width: 21px; + height: 28px; + background: url('images/hide2.png') no-repeat center center; +} + +.show_torrents_link { + border: none; + width: 28px; + height: 28px; + display: block; + cursor: pointer; +} + +.filter_torrents { + width: 750px; + margin: auto; + background: var(--color10); +} + +.filter_torrents .submit { + text-align: right; + padding-top: 5px; +} + +.filter_torrents .ft_cat_list { + border-top: 1px solid var(--color10); + border-bottom: 1px solid var(--color10); +} + +#content form.search_form + .torrent_table { + margin-top: 20px; +} + +#content form.search_form .submit { + text-align: center; +} + +.cat_list tr td { + border: none; +} + +.torrent_table tr { + /* vertical-align: top; */ + vertical-align: middle; + border: 1px solid var(--color21); +} + +h3 a { + color: white; +} + +.torrent_table .number_column { + text-align: center; +} + +.torrent_table, .torrent_table td { + border: 1px solid var(--color21); +} + +.torrent_table tr.torrent, .torrent_table tr.group { + font-weight: bold; +} + +.torrent_table tr.group { + background-color: var(--color17); +} +.torrent_table tr.group_torrent { + background-color: var(--color10); +} +.torrent_table tr.torrent { + background-color: var(--color10); +} + +.torrent_table tr.group td.center:first-child { + padding: 3px; + width: 21px; +} +.torrent_table tr.torrent:nth-child(2n) { + background-color: var(--color14); +} +.torrent_table tr.torrent:nth-child(2n-1) { + background-color: var(--color15); +} +/* +It is not possible to .addClass() nth-child so a new style must be created with +the same css attributes as the nth-child lines above. +Also defining an extra style class with nth-child also does not work so an extra +css block is needed for .rowlight and .rowdark*/ +.torrent_table tr.torrent.rowlight { + background-color: var(--color14); +} +.torrent_table tr.torrent.rowdark { + background-color: var(--color15); +} + +.torrent_table div.tags { + font-weight: normal; + max-width: 500px; +} + +.torrent_table tr .center, #collage_table td { + vertical-align: middle; + text-align: center; +} + +.group_torrent span { + float: right; +} + +.torrent span { + font-weight: normal; + float: right; +} + +.nobr { + white-space: nowrap; +} + +/* Layout (Forums) */ + +.last_read {margin-left: 5px; fill: var(--color78);} +.colhead_dark .last_read {fill: var(--color78);} + +.unread_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_unread.png) no-repeat center center;} +.read_locked_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_sticky_read.png) no-repeat center center;} +.read_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_read.png) no-repeat center center;} +.unread_sticky{background: url(https://sugoimusic.me/static/styles/sugoi/images/sticky_unread.png) no-repeat center center;} +.unread_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_unread.png) no-repeat center center;} +.read_locked{background: url(https://sugoimusic.me/static/styles/sugoi/images/locked_read.png) no-repeat center center;} +.unread{background: url(https://sugoimusic.me/static/styles/sugoi/images/unread.png) no-repeat center center;} +.read{background: url(https://sugoimusic.me/static/styles/sugoi/images/read.png) no-repeat center center;} +strong.quoteheader {color: var(--color25);} + +tr.row:nth-of-type(odd) { + background-color: var(--color50); +} + +table.forum_post { + margin: 10px 0px; +} + +table.forum_post td { + /* border: 1px solid var(--color22); */ + border: none; +} + +table.forum_unread { + border: 2px solid var(--color80); +} + +td.avatar { + width: 150px; + padding: 0px; +} + +.box_description > div:not(.head) { + max-height: 400px; + overflow-y: scroll; +} +.box_description, table.forum_post td.body { + word-break: break-word; + word-wrap: break-word; + display: inline-block; +} +.box_description { + width: 100%; +} +.thin > table.forum_post td.body { + width: 690px; +} +#torrent_comments table.forum_post td.body { + width: 422px; +} + +blockquote { + margin: 10px; + padding: 10px; + /* border: 1px dashed var(--color22); */ + border: 1px dashed var(--color27); + background: var(--color48); +} + + +/* Layout (Inbox) */ + + +tr.unreadpm { + background-color: var(--color68); +} + +/* Layout (Permission Page) */ + +.permission_head { + width: 400px; + margin-left: auto; + margin-right: auto; +} + +.permissions { + width: 930px; + margin-left: auto; + margin-right: auto; +} + +.permission_container { + float: left; + width: 300px; + padding: 5px; +} +.permission_container input { + margin: 0px 3px 5px 0px; + vertical-align: top; +} + +.submit_container { + clear: both; + text-align: right; +} + +/* Layout (Invite tree) */ + +ul .invitetree { + margin: 0px 0px 0px 25px; +} + +.invitetree li { + list-style: none; + margin: 10px 2px; +} + +/* Layout (User options) */ + +.user_options .options_list li { + margin: 0; +} + +/* Layout (MISC) */ + +.left_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.center_poll { + height: 9px; + background: var(--color28); + border-radius: 4px; + float: left; + margin: 0px; + padding: 0px; +} + +.right_poll { + display: none; + width: 2px; + height: 9px; + float: left; + margin: 0px; + padding: 0px; +} + +.curtain { + position: fixed; + top: 0%; + left: 0%; + width: 100%; + height: 100%; + background-color: black; + z-index: 1001; + -moz-opacity: 0.8; + opacity: .80; + filter: alpha(opacity=80); +} + +.lightbox { + position: fixed; + text-align: center; + top: 5%; + left: 5%; + width: 90%; + height: 90%; + padding: 0px; + z-index: 1002; + overflow: auto; +} + +.center { + text-align: center; +} + +.spellcheck { + margin: 25px 0; + font-size: 1.25em; + font-weight: bold; +} + +tr.torrent .bookmark > a:before { + color: black; +} +tr.torrent .bookmark > a:after { + color: black; +} + +.field_div { + margin-bottom: 10px; +} + +.edit_changelog textarea { + width: 600px; +} + +.brackets { + font-weight: normal; + color: var(--color76); +} + +div[class~=tooltipster-content] > a { + color: var(--color20); +} + +.post_id { + font-weight: normal; + margin-bottom: 5px; /* Hack to allow forum thread head column to look OK even if user has no displayed badges */ +} + +.vote_tag_up, .vote_artist_up, .vote_album_up, .small_upvote, .small_upvoted { + color: var(--color72); +} + +.vote_tag_down, .vote_artist_down, .vote_album_down, .small_downvote, .small_downvoted { + color: var(--color73); +} + +/* get rid of extraneous padding in the Top Contributors box */ +#request_top_contrib { + border: none; +} +#request_top_contrib tr:first-child th { + border-top: 0; +} +#request_top_contrib tr:last-child td { + border-bottom: 0; +} +#request_top_contrib tr td:first-child, +#request_top_contrib tr th:first-child, +#request_top_contrib tr td:nth-child(2), +#request_top_contrib tr th:nth-child(2) { + border-left: 0; + border-top: 0; +} +#request_top_contrib tr td:last-child, +#request_top_contrib tr th:last-child { + border-right: 0; +} + +#requests table.layout.cat_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#requests tr#media_list { + border-bottom: 1px solid var(--color19); + border-top: 1px solid var(--color19); +} +#request_table { + margin-bottom: 5px; + border: 1px solid var(--color21); +} +#request_table .request:nth-of-type(odd){ + background: var(--color3); +} +#request_table .request:nth-of-type(even){ + background: var(--color18); +} + +/* workaround for calendar display issue */ +div.sidebar #event_div { + margin-left: -232px; +} + +ol { + margin-left: 1em; +} + +#forum_search_cat_list { + border: none; +} + +#coverCont { + background-color: var(--color18); + padding: 5px; + box-shadow: none; +} +#coverCont img { + background-color: var(--color18); +} +.torrent_info { + font-size: 100%; + font-weight: 100; +} +.group_info > a:last-of-type { + text-decoration: underline; +} +.group_image { + padding-right: 1em; +} + +.recent_snatches_images, .recent_uploads_images { + position: relative; +} + +.edit_tags_votes { + padding-left: 5px; +} + +.row_hl { + background-color: var(--color68); +} + +input.inputtext { + border: none; + border-bottom: 1px solid var(--color21); + background-color: rgba(0, 0, 0, 0); + font-size: 13px; + outline: none; + transition: ease-in-out 0.12s; +} +input.inputtext:focus { + border-bottom: 1px solid var(--color2); +} + +input, textarea { + background-color: var(--color60); + padding: 5px 5px; + color: var(--color61); + outline: none; + border: 1px solid var(--color21); +} + +select { + padding: 5px 5px; + background-color: var(--color66); + color: var(--color67); + border-radius: 0px; + outline: 1px solid var(--color21); + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + border: none; +} + +.bbcode_bar { + background: var(--color74); + border-bottom: none; + color: var(--color75); +} +.collage_images .collage_image { + margin: 1px; + width: 121px; + display: inline-block; +} + +.box, .border, .alertbar, .artist_table, .request_table, .forum_index, #userinfo_minor > li > ul, .permissions table { + box-shadow: none; +} +#userinfo { + box-shadow: none; +} + +.last_edited { + font-size: 10px; + opacity: 0.7; +} + +#comm_badge_tr .badge_icon, #user_badge_edit_tr .badge_icon { + margin-right: 1em; + margin-left: 2px; +} + +.store_table .badge_icon { + display: inline-block; +} + +.store_table .badge_icon img { + display: block; + margin-left: auto; + margin-right: auto; +} + +.hnr-yes { + color: red; +} +.hnr-no { + color: green; +} + +.webm { + max-width: 100%; +} + +.point_gift_box p { + margin: 7px 2px 0px; +} +.point_gift_box input[type="text"], .point_gift_box textarea { + width: 100%; + box-sizing: border-box; +} +.dead { + opacity: 0.6; +} +.search_warning { + fill: var(--color2); +} +.tl_reported { + color: var(--color32); +} + +.tl_snatched { + color: var(--color33); +} +.tl_leeching { + color: var(--color34); +} +.tl_seeding { + color: var(--color35); +} +caption { + border-bottom: 1px solid var(--color27); + font-weight: bold; +} + +#noty_bottomRight_layout_container li { + background-color:var(--color29) !important; + color: var(--color30) !important; + border: 1px solid var(--color21) !important; +} + +.noty_buttons { + background-color: var(--color10) !important; + border: 1px solid var(--color21) !important; +} + + +.tag_parody { + color: #e08e00 !important; +} +.tag_character { + color: #099809 !important; +} +.tag_female { + color: #d51b8a !important; +} +.tag_male { + color: #0000ff !important; +} + +.collage_image:hover { + box-shadow: none; + position: relative; +} + + +/* table border fix */ + +.group_displayname, +.group_displayname td{ +/* Removes Border around torrent name and category on details page*/ + border:none; +} + +.box .torrent_table, +.box .torrent_table tr{ + border:none; +} + +.box .torrent_table tr.colhead>td, +.box .torrent_table tr.colhead_dark>td{ + border-top:none; +} + +#artist .box .torrent_table tr.colhead>td, +#artist .box .torrent_table tr.colhead_dark>td{ + border: 1px solid var(--color21); +} + +.box .torrent_table tr:last-of-type>td{ + border-bottom:none !important; + } + + +.box .torrent_table tr:nth-last-of-type(2)>td{ + /* + remove bottom border of second last row; + needed for table on torrent details, since the last row there can be hidden + */ + border-bottom:none !important; + } + + .box .torrent_table td:first-of-type{ + border-left:none !important; + } + + .box .torrent_table td:last-of-type{ + border-right:none !important; + } + + /* table border fix end */ + +/* Hide/Unhide torrent group icon */ +.hide_torrents, .show_torrents { + position: relative; + cursor: pointer; +} + +.hide_torrents>.show_torrents_link:after, .show_torrents>.show_torrents_link:after { + content: ""; + position: absolute; + width: 19px; + height: 3px; + top: 13px; + left: 1px; + border-radius: 2px; + background-color: var(--color81); +} + +.show_torrents>.show_torrents_link:before { + content: ""; + position: absolute; + width: 3px; + height: 19px; + top: 5px; + left: 9px; + border-radius: 2px; + background-color: var(--color81); +} \ No newline at end of file