Voiranime Dark by darkissou

Details
Authordarkissou
LicenseNo License
Created
Updated
Categoryvoiranime
Statistics
Learn how we calculate statistics in the FAQ.
Total views
Total installs
Weekly installs
Weekly updates
Description
A dark theme for Voiranime. Enjoy watching anime at night
Notes
Make sure to enable "Expose iframes via HTML[stylus-iframe]" in Stylus settings else some features won't work!!!
Tested on Chrome and Firefox. Discord: Darkuwu#2946
Changelog:
1.6.5
- Added no results dark box
1.6.4
- Minor tweaks to the theme
1.6.3
- Improved adblocking
1.6.2
- Added toggle dark theme
- Added toggle ad-blocking
- Added toggle dark reCaptcha
- Minor tweaks to the dark theme
1.6.1
- Fixed reCaptcha box too wide and container not wide enough using "Enable wide website" setting
1.6
- Added settings panel
- Added toggle dark Voiranime logo
- Added wide website
- Added remove sidebar
- Added disable sticky navbar
- Improved adblocking
1.5.3
- Fixed reCAPTCHA activating on every other sites and improved its dark theme
1.5.2
- Fixed theme activating on https://www.google.com/recaptcha/
1.5.1
- Better dark reCAPTCHA
1.5
- Dark reCAPTCHA box
1.4.1
- Fixed video player not appearing, whoops
1.4
- Added (partial) ad blocking
- Fixed comments field placeholder text color being too similar with the background and not matching the rest of the color palette
- Added dark color for the bookmarks button
1.3
- Dark Voiranime logo
1.2
- Enhanced existing features
1.1
- More dark features, specifically on the search results
1.0
- Initial release
Source code
/* Voiranime Site */
/* ==UserStyle==
@name Voiranime Dark
@namespace github.com/openstyles/stylus
@author Darkuwu#2946
@description `A simple dark theme for Voiranime. Enjoy watching anime at night`
@version 1.6.5
@preprocessor stylus
@var checkbox dark "Enable dark theme" 1
@var checkbox adblock "Enable ad-blocking" 1
@var checkbox dcaptcha "Enable dark reCaptcha box Requires 'Expose iframes via HTML[stylus-iframe]' to be enabled in stylus settings" 0
@var checkbox dlogo "Enable Dark Voiranime logo" 0
@var checkbox wide "Enable wide website (experimental)" 0
@var checkbox hsearch "Hide sidebar" 0
@var checkbox navbar "Disable sticky navbar" 0
==/UserStyle== */
@-moz-document domain("voiranime.com"), domain("voirdrama.org") {
::-moz-selection {
background: #444444 !important;
color: #bbbbff !important;
}
/* Ad blocking */
if adblock {
.app_gdpr--SPx19r {
display: none !important;
}
div[class="ad doubleclick skyscraper"] {
display:none !important;
}
.c-ads {
display: none !important;
}
iframe[id*="container-a78"] {
display: none !important;
}
div[id*="bg_content"] {
display: none !important;
}
div[class="code-block code-block-49"] {
display: none !important;
}
div[class="code-block code-block-37"] {
display: none !important;
}
div[class="code-block code-block-22"] {
display: none !important;
}
div[class="code-block code-block-38"] {
display: none !important;
}
div[class="code-block code-block-42"] {
display: none !important;
}
div[class="code-block code-block-7"] {
display: none !important;
}
div[class="widget col-12 col-md-12 default no-icon heading-style-1 ai_widget"] {
display: none !important;
}
.pl-4a0c19b0102707e35ee9c357b0b42199__content {
display: none !important;
}
}
if wide {
.container, .container-lg, .container-md, .container-sm, .container-xl {
max-width: inherit;
}
form#chapter-video-captcha-validator {
height: 802px !important;
}
.c-blog-post .entry-content .entry-content_wrap iframe:not([title="reCAPTCHA"]) {
height: 802px !important;
}
}
if hsearch {
div[class="sidebar-col col-md-4 col-sm-4"] {
display:none !important;
}
.col-md-8 {
flex: auto;
max-width: 100%;
}
.wp-pagenavi {
width: 600px;
margin: 0 auto;
}
}
if navbar {
.c-sub-header-nav.with-border.sticky {
display:none !important;
}
}
if dlogo {
img[src*="https://voiranime.com/wp-content/uploads/2019/12/vato.png"] {
height: 0 !important;
width: 0 !important;
padding-left: 933px !important;
padding-top: 34px !important;
background-image: url("https://i.imgur.com/JryNFlb.png") !important;
background-repeat: no-repeat !important;
background-size: 232px !important;
}
}
if dark {
body {
background-color: #222222 !important;
color: #bbb !important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item {
border-bottom: 1px solid #404040 !important;
}
body.search .c-search-header__wrapper #search-advanced .search-advanced-form .form-group.checkbox-group .checkbox label {
color: #bbb !important;
}
body.search .c-search-header__wrapper #search-advanced .search-advanced-form .form-group:not(.checkbox-group) span {
color: #bbb !important;
}
body.search .c-search-header__wrapper .search-content .search-form .search-field {
background-color: #404040 !important;
}
body.search .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-meta .latest-chap .chapter {
background-color: #404040 !important;
}
body.search .c-search-header__wrapper .search-content .search-form .search-submit {
position: relative !important;
}
body.manga-page .profile-manga .tab-summary .summary_content_wrap .summary_content {
background-color: #404040 !important;
}
body.manga-page .profile-manga .tab-summary .summary_image {
background: #404040 !important;
}
body.reading-manga .entry-header .c-selectpicker select.selectpicker option, body.reading-manga .c-select-bottom .c-selectpicker select.selectpicker option {
background-color: #404040 !important;
color: #ccc !important;
}
input.search-field {
color: #ddd !important;
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
color: #bbb !important;
}
.site-header .c-sub-header-nav.with-border {
border-bottom: 1px solid #bfbfbf !important;
}
.font-title a {
color: #bbb !important;
}
.site-header .c-sub-header-nav {
background-color: #000 !important;
}
.site-header .c-sub-header-nav.with-border {
border-bottom: 1px solid #646464 !important;
}
.site-header .c-sub-header-nav .c-sub-nav_wrap .sub-nav_content .sub-nav_list li a {
color: #646464 !important;
}
.site-footer {
border-top: 3px solid #666666 !important;
}
.site-header .main-navigation .search-navigation .menu-search .open-search-main-menu {
background-color: #404040 !important;
}
.genres_wrap .genres__collapse .genres ul li a:before {
color: #ddd !important;
}
a {
color: #bbb !important;
}
a.btn.btn-genres.icon.ion-md-arrow-dropdown.float-right.active {
border-color: #444444 !important;
}
a.btn-link {
background-color: #404040 !important;
}
a:hover {
color: #ddd !important;
}
ul.sub-menu {
background-color: #202020 !important;
border-bottom-color: #404040 !important;
border-top: 1px solid #646464 !important;
}
.c-blog__heading.style-2 {
border-bottom: 2px solid #404040 !important;
}
.wp-pagenavi span {
background-color: #404040 !important;
}
.wp-pagenavi a.nextpostslink, .wp-pagenavi a.previouspostslink {
background-color: #404040 !important;
}
.wp-pagenavi .current {
color: #ddd !important;
}
.rc-anchor-light {
background: #202020 !important;
color: #bbb !important;
}
#rc-imageselect {
background-color: #404040 !important;
}
#manga-filte-alphabeta-bar {
background-color: #404040 !important;
}
#manga-filte-alphabeta-bar a {
background: #606060 !important;
border: 1px solid #888888 !important;
}
h6[class="heading fn"] {
color: #bbb !important;
}
div.post-content {
background-color: #404040 !important;
}
div.profile-manga {
background-color: #222222 !important;
}
div[class="c-breadcrumb-wrapper"] {
background-image: none !important;
}
div[class="c-search-header__wrapper"] {
background-image: none !important;
}
div[class="comment-content"] {
color: #888888 !important;
}
select[class="selectpicker host-select"] {
background-color: #404040 !important;
color: #ccc !important;
}
select[class="c-selectpicker selectpicker_chapter selectpicker single-chapter-select"] {
background-color: #404040 !important;
color: #ccc !important;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .rating .score {
color: #bbb !important;
}
#ajaxsearchprores4_1.vertical, #ajaxsearchprores4_2.vertical, div.asp_r.asp_r_4.vertical {
background: rgb(50, 50, 50) !important;
}
#ajaxsearchprores4_1 .results .item, #ajaxsearchprores4_2 .results .item, div.asp_r.asp_r_4 .results .item {
background: rgb(28, 28, 28) !important;
}
div[class="item asp_r_pagepost asp_r_pagepost_1279 asp_r_wp-manga"] {
background: rgb(20, 20, 20) !important;
}
#ajaxsearchprores4_1 .results .item.hovered, #ajaxsearchprores4_2 .results .item.hovered, div.asp_r.asp_r_4 .results .item.hovered {
background-image: radial-gradient(ellipse at center, rgb(15, 15, 15), rgb(20, 20, 20)) !important;
}
div.asp_w.asp_r .results .item {
border-left: hidden !important;
border-right: hidden !important;
}
#ajaxsearchprores4_1.vertical .results .item::after, #ajaxsearchprores4_2.vertical .results .item::after, div.asp_r.asp_r_4.vertical .results .item::after {
background: rgba(60, 60, 60, 0.55) !important;
}
#ajaxsearchprores4_1 .results .item div.asp_content, #ajaxsearchprores4_2 .results .item div.asp_content, div.asp_r.asp_r_4 .results .item div.asp_content {
color: #bbb !important;
}
#ajaxsearchprores3_1.vertical, #ajaxsearchprores3_2.vertical, div.asp_r.asp_r_3.vertical {
background: rgb(50, 50, 50) !important;
}
#ajaxsearchprores3_1 .results .item, #ajaxsearchprores3_2 .results .item, div.asp_r.asp_r_3 .results .item {
background: rgb(28, 28, 28) !important;
}
div[class="item asp_r_pagepost asp_r_pagepost_2193 asp_r_wp-manga"] {
background: rgb(20, 20, 20) !important;
}
#ajaxsearchprores3_1 .results .item.hovered, #ajaxsearchprores3_2 .results .item.hovered, div.asp_r.asp_r_3 .results .item.hovered {
background-image: radial-gradient(ellipse at center, rgb(15, 15, 15), rgb(20, 20, 20)) !important;
}
#ajaxsearchprores3_1.vertical .results .item::after, #ajaxsearchprores3_2.vertical .results .item::after, div.asp_r.asp_r_3.vertical .results .item::after {
background: rgba(60, 60, 60, 0.55) !important;
}
#ajaxsearchprores3_1 .results .item div.asp_content, #ajaxsearchprores3_2 .results .item div.asp_content, div.asp_r.asp_r_3 .results .item div.asp_content {
color: #bbb !important;
}
::selection {
background: #bbb !important;
color: #222 !important;
}
html {
background: #222222 !important;
}
body.search .c-search-header__wrapper #search-advanced .search-advanced-form .form-group .checkbox-inline label {
color: #bbb !important;
}
.form-control {
color: #999 !important;
background-color: #404040;
border: 1px solid #aaa !important;
}
.form-control:focus {
color: #495057;
background-color: #111;
border-color: #888;
}
body.search .c-search-header__wrapper #search-advanced .search-advanced-form .form-group:not(.checkbox-group) input[type="text"] {
background-color: #404040;
}
input.form-control {
color:#fff !important;
background-color:#404040 !important;
border-color:#aaa !important;
}
.c-btn.c-btn_style-2 {
background-color: #1a1920;
color: #ddd
}
.c-btn.c-btn_style-2:hover {
background-color: #0f0f0f;
}
.wp-pagenavi {
float: none !important;
}
body.search .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-meta .rating .score {
color: #aaa;
}
body.modal-open .modal .modal-content a:hover, .tab-wrap .c-nav-tabs ul.c-tabs-content li.active a, .tab-wrap .c-nav-tabs ul.c-tabs-content li:hover a, body.search.search-results .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-summary .post-content .post-content_item .summary-content:not(.release-year) a:hover, body.search.search-results .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-summary .post-content .post-content_item .summary-content.release-year a:hover, .c-blog-post .entry-header .entry-meta .post-on::before, .manga-slider .slider__container .slick-dots li.slick-active button::before, .manga-slider .slider__container .slick-dots li button:hover::before, body.manga-page .profile-manga .tab-summary .summary_content_wrap .summary_content .post-status .manga-action .count-comment .action_icon a i, body.manga-page .profile-manga .tab-summary .summary_content_wrap .summary_content .post-status .manga-action .add-bookmark .action_icon a i, body.manga-page .profile-manga .tab-summary .summary_content_wrap .summary_content .post-status .manga-action .count-comment .action_detail a i, body.manga-page .profile-manga .tab-summary .summary_content_wrap .summary_content .post-status .manga-action .add-bookmark .action_detail a i, body.manga-page .profile-manga .post-title a, body.manga-page .content-readmore:hover, body.text-ui-light.manga-page .content-readmore:hover, .genres_wrap .genres__collapse .genres ul li a:hover, .genres_wrap .genres__collapse .genres ul li a:hover::before, .c-blog-post .entry-header .entry-meta .post-on .posted-on a:hover, body.search .c-search-header__wrapper #search-advanced .search-advanced-form .form-group.checkbox-group .checkbox label:hover, .site-header .main-navigation .search-navigation .menu-search .open-search-main-menu, .c-btn.c-btn_style-2, body.search .c-search-header__wrapper .search-content .btn-search-adv, body.reading-manga .entry-header .entry-header_wrap .action-icon ul li a, body.reading-manga .c-select-bottom .entry-header_wrap .action-icon ul li a, .widget.c-released .released-item-wrap ul.list-released li a:hover, body.manga-page .profile-manga .post-title h1, .genres_wrap .genres__collapse #genres ul li:hover a, .genres_wrap .genres__collapse #genres ul li:hover a::before, input[type="checkbox"]:checked + label::before, input[type="radio"]:checked + label::before, .genres_wrap a.btn-genres, .c-breadcrumb .breadcrumb li a:hover, body.search.search-results .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-summary .post-content .post-content_item.mg_genres .summary-content, body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item .page-item-detail .item-summary .list-chapter .chapter-item .vol a:hover, #hover-infor .item_thumb .post-title a, body.manga-page .version-chap::before, body.manga-page .content-readmore:hover, body.manga-page .chapter-readmore:hover, .icon-load-info, .c-blog-post .entry-header .entry-meta .post-on .c-blog__date .post-category a:hover, .woocommerce ul.products li.product .price, .woocommerce div.entry-summary p.price, .woocommerce div.entry-summary form.cart .variations .label, .woocommerce div.entry-summary form.cart .quantity-text, .widget_product_categories .product-categories li a:hover, .woocommerce ul.products li.product h2:hover, .woocommerce .c-woo-breadcrumb a:hover, .site-header .c-sub-header-nav .c-sub-nav_wrap .c-modal_item .c-user_item .c-user_menu a:hover, .site-header .c-sub-header-nav .c-sub-nav_wrap .sub-nav_content .sub-nav_list li:hover > a, .settings-page .action i.ion-ios-close:hover::before, .settings-page .list-chapter .chapter-item a:hover, .settings-page .tabs-content-wrap .tab-group-item .tab-item .history-content .item-infor .chapter span a, .settings-page .nav-tabs-wrap ul.nav-tabs li:not(.active):hover a, .main-color, .site-header .c-sub-header-nav .c-sub-nav_wrap .sub-nav_content .sub-nav_list li.menu-item-has-children.active > a, .woocommerce .woocommerce-ordering::after, .text-ui-light .widget.c-popular .popular-item-wrap .popular-content .chapter-item .chapter a:hover, body.text-ui-light .settings-page .list-chapter .chapter-item .chapter a:hover, body.search.text-ui-light .search-wrap .tab-content-wrap .c-tabs-item .c-tabs-item__content .tab-meta .latest-chap .chapter a:hover {
color: #fff;
}
body.page .c-page-content .c-page .c-page__content .page-content-listing .page-listing-item {
border-bottom: none !important;
}
body.reading-manga .entry-header .entry-header_wrap .action-icon ul li a, body.reading-manga .c-select-bottom .entry-header_wrap .action-icon ul li a {
background-color: #444444;
}
input:not([type]):focus, input[type="color"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="text"]:focus, input[type="search"]:focus, textarea:focus, select:focus, input:not([type]):hover, input[type="color"]:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="tel"]:hover, input[type="url"]:hover, input[type="text"]:hover, input[type="search"]:hover, textarea:hover, select:hover {
border-color: #444;
background-color: rgba(0, 0, 0, 0.3);
}
input:not([type]), input[type="color"], input[type="email"], input[type="number"], input[type="password"], input[type="tel"], input[type="url"], input[type="text"], input[type="search"], textarea, select {
color: #ddd;
}
.c-blog__heading.style-2 a.btn-reverse-order i {
color: #bbb;
}
body.manga-page .profile-manga .tab-summary .post-rating span {
color: #aaa;
}
div.asp_w.asp_r .results .asp_nores {
background: #333;
color: #bbb;
}
#ajaxsearchprores3_1 .results .asp_nores .asp_keyword, #ajaxsearchprores3_2 .results .asp_nores .asp_keyword, div.asp_r.asp_r_3 .results .asp_nores .asp_keyword {
color: rgb(175, 175, 175);
}
}
}
@-moz-document url-prefix("https://www.google.com/recaptcha/api2/") {
/* Recaptcha Dark Theme */
if dcaptcha {
[stylus-iframe="https://voiranime.com"] .rc-anchor-light {
background: #2a2c31 !important;
color: #fff !important;
}
[stylus-iframe="https://voiranime.com"] .rc-anchor-light.rc-anchor-normal {
border-color: #434343;
}
[stylus-iframe="https://voiranime.com"] .rc-anchor-light .rc-anchor-logo-text, .rc-anchor-light div a:link, .rc-anchor-light div a:visited {
color: #aaa;
}
[stylus-iframe="https://voiranime.com"] .recaptcha-checkbox-border {
background-color: #202124;
border-color: #515151;
}
[stylus-iframe="https://voiranime.com"].recaptcha-checkbox-hover .recaptcha-checkbox-border, .recaptcha-checkbox-hover {
border-color: #626262;
}
[stylus-iframe="https://voiranime.com"] #rc-imageselect {
background-color: #202124;
}
[stylus-iframe="https://voiranime.com"].rc-button-help, .rc-button-audio, .rc-button-reload {
filter: invert(1) hue-rotate(180deg);
}
[stylus-iframe="https://voiranime.com"] .rc-imageselect-desc-wrapper {
background-color: #8ab4f8;
color: #202124;
}
[stylus-iframe="https://voiranime.com"] .rc-imageselect-desc-wrapper, .rc-button-default {
background-color: #8ab4f8;
color: #202124;
}
[stylus-iframe="https://voiranime.com"] .rc-challenge-help {
color: #ddd;
}
[stylus-iframe="https://voiranime.com"] .rc-button-help {
filter: invert(1) hue-rotate(180deg);
}
[stylus-iframe="https://voiranime.com"] .rc-button-image {
filter: invert(1) hue-rotate(180deg);
}
[stylus-iframe="https://voiranime.com"] .rc-audiochallenge-tdownload-link {
filter: invert(1) hue-rotate(180deg);
}
[stylus-iframe="https://voiranime.com"] html:not(.XkWAb):not([class="w50Hl"]):not([class="hMukDb"]):not([stylus-iframe*="store.google.com"]):not([stylus-iframe*="play.google.com"]):not([stylus-iframe="https://www.google.com"]) {
background-color: #202124;
color: #bbb;
}
[stylus-iframe="https://voiranime.com"] body:not(#yDmH0d), input, button:not(devsite-feedbackf > button), .language_list_item, .ksb, .ZdjxGf .aRjnqc, .VVN44 {
color: #ddd;
}
[stylus-iframe="https://voiranime.com"] body:not([id="yDmH0d"]:not(.IqBfM)):not([class*="tQj5Y ghyPEc IqBfM EIlDfe cjGgHb d8Etdd LcUz9d EWZcud ecJEib"]):not([class="XPiYd EIlDfe uOat3d"]):not(body.LoJzbe.keynav-mode-off.screen-mode):not(.VfPpkd-Sx9Kwc-XuHpsb-pGuBYc.EIlDfe.uOat3d):not(.VfPpkd-Sx9Kwc-XuHpsb-pGuBYc.EIlDfe) {
background-color: #202124;
}
[stylus-iframe="https://voiranime.com"] input:not([type="submit"]):not([jsname]):not([matinput]):not([id="ace-select-filter-input-cfc-select-8"]):not([class="og3lId"]):not(.search-input):not(.gb_8e):not([jsaction]):not(.jfk-textinput):not([ng-model]):not([class="help-panel-header__search-input"]):not([class="gb_ef"]):not([data-gtm-ref]), select, .gtm-form-input, .suite.suite-gaia-container {
background-color: #111;
}
[stylus-iframe="https://voiranime.com"] input[type="text"] {
color: #ccc;
border-color: #494949;
border-top-color: #505050;
}
// @css {
[stylus-iframe="https://voiranime.com"] div[style="background-color: rgb(255\, 255\, 255); border: 1px solid rgb(204\, 204\, 204); box-shadow: rgba(0\, 0\, 0\, 0.2) 2px 2px 3px; position: absolute; transition: visibility 0s linear 0s\, opacity 0.3s linear 0s; opacity: 1; visibility: visible; z-index: 2000000000; left: 850.5px; top: 293px;"] {
content: 'bug';
background-color: #111;
border: 1px solid rgb(50, 50, 50);
}
// }
[stylus-iframe="https://voiranime.com"] iframe[title="Le test reCAPTCHA expire dans deux minutes"] {
filter: invert(1) hue-rotate(180deg);
}
[stylus-iframe="https://voiranime.com"] .rc-separator {
border-top: 1px solid #505050;
}
}
}