Voiranime Dark by darkissou

Voiranime Dark screenshot
Install Get Stylus Write a review

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

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;
    }
}
}

Reviews

No reviews yet.