Skip to content

Reactor and Joyreactor .cc Anime Style (with Dark theme) by delmor_s

Mirrored from https://github.com/DelmorS/Reactor-Anime-Style-with-Dark-theme/raw/master/Reactor_Dark_Theme.user.css

Screenshot of Reactor and Joyreactor .cc Anime Style (with Dark theme)

Details

Authordelmor_s

LicenseCC-BY-NC-SA-4.0

Categoryjoyreactor.cc, reactor.cc

Created

Updated

Size13 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Аниме-стиль для reactor.cc и joyreactor.cc, а также всех его разделов и подразделов - anime.reactor.cc итд. Возможность выбрать темную/прозрачную тему (Также работает с reactor.com, joyreactor.com)

Anime-style for reactor.com, joyreactor.com, and all its subreddits, like anime.reactor.com etc. Dark theme available.

Notes

Аниме-стиль для reactor.cc и joyreactor.cc, а также всех его разделов - anime.reactor.cc итд.

История изменений
28.09.2020 - 1.2.2 - Какой-то новый вид рекламы, также пытаюсь его спрятать.
29.12.2018 - 1.2.1 - Продолжаю делать мелкие правки, постоянно нахожу новую рекламу, пробую прятать ее так, чтобы не задевать основной контент.
24.07.2018 - 1.2 - Добавил возможность убрать боковую панель. Совместимость с мобильными браузерами - теперь при установке стиля на мобильный браузер Firefox страница должна динамически подгонять размер элементов.
21.07.2018 - 1.1.5 - Поправил цвета кнопок переключения страницы.
25.03.2018 - 1.1.4 - Добавил возможность центрирования изображений, гифок, видео.
25.07.2017 - 1.1.3 - Небольшие исправления цветов.
15.06.2017 - 1.1.2 - Фикс социальных иконок, небольшие исправления.
05.06.2017 - 1.1.1 - Небольшие исправления и дополнения, теперь работает и с joyreactor.com, reactor.com
03.06.2017 - 1.1 - Добавил темную прозрачную тему.
21.04.2017 - 1.0.3 - Исправлен баг с частичным отображением стандартного фона, переделано еще пара кнопок.
18.03.2017 - 1.0.2 - Подправлен цвет некоторых кнопок, изменен цвет логотипа.
10.02.2017 - 1.0.1 - Немного подправлен цвет кнопок.
08.02.2017 - 1.0 - Первая версия.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name			Reactor and Joyreactor.cc Anime Style (with Dark theme)
@namespace		github.com/openstyles/stylus
@version		1.0.1
@description	Аниме-стиль для reactor.cc и joyreactor.cc, а также всех его разделов и подразделов - anime.reactor.cc итд. Возможность выбрать темную/прозрачную тему (Также работает с reactor.com, joyreactor.com)
@author			Delmor_S
]
@preprocessor   stylus
==/UserStyle== */

@-moz-document domain("reactor.cc"), domain("joyreactor.cc"), domain("reactor.com"), domain("fapreactor.com") {
	
	:root {
		--backgroundImage: url(https://s1.1zoom.ru/b5050/280/355582-sepik_2048x1152.jpg);
		--buttonColor: #20d2e6;
		--buttonTextColor: #0F1928;
		--inactiveButtonColor: #D9D9D9;
		
		--searchBarColor: #47B3FF; /* 47B3FF */
		--topBarColor: #1C2C43;
		
		--backgroundColor: #0546A4; /* A9EDF5 */
		
		--pageScale: 100%;
	}
	
	/*========== DARK THEME START ==========*/
	:root {
		--buttonColor: #0065B6;
		--buttonTextColor: white;
		--inactiveButtonColor: rgba(0, 0, 0, 0.6);
		
		--searchBarColor: #0546A4;
		--topBarColor: rgba(0, 0, 0, 0.6);
	}
	
	div.post_poll_holder {
		background-color: transparent !important; 
	}
	
	div#pageinner {
		background-color: rgba(0, 0, 0, 0.6) !important;
	}
	
	.article .ufoot span.link_wr a,
	.article .ufoot span.hidden_link a,
	.taglist a {
		color: #aaa !important;
	}
	
	div.user.week_top, 
	.user.week_top a, 
	div.user.week_top .userposition,
	.user .weekrating {
		background-color: transparent !important;
		background-image: none !important;
	}
	
	.comment {
		background-color: rgba(0, 0, 0, 0.6) !important;
	}
	
	.sidebarContent p.login_link a,
	div.pagination_toggler {
		background-color: grey !important;
	}
	
	.article .post_content_expand span, 
	#tagArticle .post_content_expand span,
	#sidebar .tabs_titles ul li.active a, 
	#contentinner .tabs_titles ul li.active a, 
	#sidebar .tabs_titles ul li.active a:hover, 
	#contentinner .tabs_titles ul li.active a:hover,
	#blogHeader .add_to_fav a,
	input[type="submit"],
	input[type="button"], 
	button, 
	.big_button,
	.article .uhead a,
	div#pageinner div,
	#navcontainer ul li.current_page_item a, 
	#navcontainer ul li.current_page_ancestor a, 
	#navcontainer ul li#konkurs.current_page_ancestor a,
	div.tagname,
	#submenu div.submenuitem a,
	.pagination a {
		color: var(--buttonTextColor) !important;
	}
	
	.pagination .prev:before, 
	.pagination .next:after,
	.article .ufoot span.comments a:before {
		-webkit-filter: invert(1) brightness(2) !important;
		-moz-filter: invert(1) brightness(2) !important;
		filter: invert(1) brightness(2) !important;
	}
	
	.article .post_content_expand, 
	#tagArticle .post_content_expand {
		background-color: rgba(0, 0, 0, 0.3) !important; 
	}
	
	.fandomPromo {
		background-color: rgba(0, 0, 0, 0.7) !important;   
	}
	
	div.additional_info .sideheader, 
	.sidebar_block h2, 
	#sidebar ul li div.sideheader, 
	#sidebar .sideheader {
		border-bottom-color: white !important;   
	}
	
	.manage_post_wr {
		background-color: var(--searchBarColor);   
	}
	
	textarea, 
	input[type="text"],
	input[type="password"] {
		background-color: var(--topBarColor);
		color: var(--buttonTextColor);
	}
	
	.subscriptions a {
		background: url(http://www.macdrifter.com/theme/images/rss-snow.svg) no-repeat;
		background-size: 18px 18px;
	}
	
	.fav_posts_lnk a {
		background: url(http://pngimage.net/wp-content/uploads/2018/06/white-hearts-png.png) no-repeat;
		background-size: 17px 17px;
	}
	
	.mysettings_lnk a {
		background: url(https://vignette.wikia.nocookie.net/nobellion/images/3/32/Ic_settings_white_48dp.png/revision/latest?cb=20180423120420) no-repeat;
		background-size: 17px 17px;
	}
	
	.poll_res_bg_active {
		background: var(--backgroundColor);
	}
	
	.post_content h3 {
		color: white;
	}
	/*========== DARK THEME END ==========*/
	
	/*========== CENTER IMAGES ==========*/
	.comment .image,
	.post_content .image {
		text-align: center;   
	}
	/*========== CENTER IMAGES END ==========*/
	
	embed {
		zoom: calc(200% - var(--pageScale)) !important;
	}
	
	/* PAGE SCALE */
	div#page { 
		zoom: var(--pageScale) !important; 
	}
	
	.comment_list {
		box-shadow: -2px 0 0 var(--buttonColor);
	}
	.comment_list:hover {
		box-shadow: -2px 0 0 var(--buttonColor);
	}
	
	.ui-widget-header {
		border-color: var(--buttonColor) !important;
		background: var(--buttonColor) !important;
	}
	
	.ui-dialog-title {
		color: white !important;
	}
	
	#sidebar .tabs_titles ul li a:hover, #contentinner .tabs_titles ul li a:hover {
		color: white !important;
		background-color: var(--buttonColor) !important;  
	}
	
	div.progress_bar div {
		background-color: var(--backgroundColor) !important;   
	}
	
	.article.active {
		border-color: var(--buttonColor) !important;   
	}
	
	
	/* GIF LOADING ANIMATION */
	div.video_gif_loading {
		display: none !important;
	}
	
	
	/* MAIN BACKGROUND */
	#background,
	body,
	html {
		background-color: var(--backgroundColor) !important;   
	}
	
	body[style*="/error/bk.jpg"] {
		background-image: var(--backgroundImage) !important;
		background-size: 100% !important;
		background-attachment: fixed !important;
	}
	
	body div[style*="/error/orientalBk.jpg"] {
		background-image: none !important;   
	}
	
	#container {
		background-image: var(--backgroundImage) !important;
		background-size: cover !important;
		background-attachment: fixed !important;
		background-color: var(--backgroundColor) !important; 
	}
	
	#searchBar {
		background-color: var(--searchBarColor) !important;   
	}
	
	
	/* ADVERTISEMENT */
	div#sidebar li div.sidebarContent {
		display: none !important;   
	}
	
	div[id*='ads_holder'] {
		display: none !important;  
	}
	
	div[id*='yandex_rtb'] {
		display: none !important;  
	}
	
	div#content {
		background-color: transparent !important;
	}
	
	td.teaser {
		display: none !important;  
	}
	
	div#content > div#contentinner > script + div {
		display: none !important;
	}
	
	div#post_list > :not(div[id*="postContainer"]):not(div[id*="comment"]) { 
		display: none !important;
	}
	
	div#contentinner > div[style*="margin-bottom: 20px"] {
		display: none !important;
	}
	
	
	/* BUTTONS AND OTHER STUFF COLORS */
	.commentnum, 
	#blogHeader .add_to_fav a {
		background-color: var(--buttonColor) !important;
		border-color: var(--buttonColor) !important;
	}
	
	#submenu div.submenuitem.active a {
		background-color: var(--buttonColor) !important;
	}
	
	input[type="button"], button, .big_button {
		background-color: var(--buttonColor) !important;
	}
	
	#contentinner form input[type="submit"] {
		color: var(--buttonTextColor) !important;
		background-color: var(--buttonColor) !important;
	}
	
	#navcontainer ul li.current_page_item a, 
	#navcontainer ul li.current_page_ancestor a, 
	#navcontainer ul li#konkurs.current_page_ancestor a,
	#navcontainer ul li.current_page_item a:after, 
	#navcontainer ul li.current_page_ancestor a:after, 
	#navcontainer ul li#konkurs.current_page_ancestor a:after,
	.pagination .current, 
	.pagination .next, 
	.pagination .prev,
	form#sf_guard_signin input[type="submit"],
	form#payment input[type="submit"],
	input[type="button"], 
	button, 
	.big_button,
	#sidebar .tabs_titles ul li.active a, 
	#contentinner .tabs_titles ul li.active a, 
	#sidebar .tabs_titles ul li.active a:hover, 
	#contentinner .tabs_titles ul li.active a:hover {
		background-color: var(--buttonColor);
	}
	
	input:focus, 
	button:focus, 
	textarea:focus {
		outline-color: var(--buttonColor) !important;
	}
	
	#topbar {
		background-color: var(--topBarColor) !important;
	}
	
	.topbar_wr, .topbar_wr a {
		color: white !important;   
	}
	
	.sswither {
		border: 2px solid white !important;
	}
	
	.sswither span {
		background-color: white !important;
	}
	
	.post_random a {
		color: #20d2e6 !important;
		background-color: #0F1928 !important;
	}
	
	.post_random a:after {
		background-image: none !important;   
	}
	
	#header .logo a, #header .logo a:hover {
		background-image: url(http://joyreactor.cc/images/joyreactor_logo.png) !important;
	}
	
	#header .description {
		color: white !important;   
	}
	
	
	/* BOTTOM PAGE BUTTONS */
	.pagination a:hover {
		background-color: var(--searchBarColor);
	}
	
	.pagination span {
		color: var(--buttonTextColor); 
	}
	
	.pagination_expanded a, .pagination_expanded span {
		background-color: var(--inactiveButtonColor); 
	}
	
	
	/* SHARE BUTTONS */
	.article .uhead .uhead_share span.favorite_link,
	.article .uhead .uhead_share span.favorite_link.favorite,
	.article .uhead .uhead_share span a.share_vk,
	.article .uhead .uhead_share span a.share_fb,
	.article .uhead .uhead_share span a.share_twitter {
		background-image: url(https://i.ibb.co/cCvXddP/favourites3.png) !important;
		background-size: 35px 286px !important;
		width: 35px !important;
		height: 35px !important;
	}
	
	.article .uhead .uhead_share span.favorite_link {
		background-position: 0px -41px !important;  
	}
	
	.article .uhead .uhead_share span.favorite_link.favorite {
		background-position: 0px 0px !important;
	}
	
	.article .uhead .uhead_share span a.share_vk {
		background-position: 0px -125px !important;
	}
	
	.article .uhead .uhead_share span a.share_fb {
		background-position: 0px -83px !important;
	}
	
	.article .uhead .uhead_share span a.share_twitter {
		background-position: 0px -167px !important;
	}
	
	.article .ufoot span a.response {
		background-color: var(--inactiveButtonColor);
		color: var(--buttonTextColor);
	}
	
	#submenu span.delimiter,
	#submenu a, #submenu b {
		color: var(--buttonTextColor);
	}
	
	.littleGrayButton {
		background-color: rgba(0, 0, 0, 0.4) !important;
	}
	
	#private_message_tabs, .ui-tabs-panel {
		background-color: rgba(0, 0, 0, 0);
	}
	
	.ui-tabs-vertical .ui-tabs-panel {
		background-color: rgba(0, 0, 0, 0);
	}
	
	.private_message_own,
	.private_message {
		background-color: var(--backgroundColor) !important;
	}
	
	
	/* SMARTPHONE */
	@media (max-width: 1080px) {
		div.vote-plus {
			width: 99px !important;
			height: 99px !important;
			background-image: url(https://i.ibb.c...

Reviews

No reviews yet.