AniList Darker

Dark theme with red accent for AniList.
目前为 2020-12-02 提交的版本。查看最新版本。
Wrap lines
/* ==UserStyle==
@name         AniList Darker
@namespace    github.com/DishankJ/AniList-Darker
@version      1.0.4
@description  Dark theme with red accent for AniList.
@author       Dishank Jaiswal
@homepageURL  https://github.com/DishankJ/AniList-Darker
@supportURL   https://github.com/DishankJ/AniList-Darker/issues
==/UserStyle== */

@-moz-document url-prefix("https://anilist.co") {

.feed-type-toggle > div.active[data-v-7b8d25f2] {
    background: #1f1f1f;
    color: #ff6961;
    font-weight: 500;
}

.feed-type-toggle > div[data-v-7b8d25f2]:hover {
    color: rgb(255, 142, 136, .7);
}

.info-header[data-v-4b71d7c6] {
    color: #ff6961;
    font-size: 1.2rem;
    font-weight: 500;
    margin-bottom: 8px;
}

.name[data-v-6c3dc0b8] {
    color: #ff6961;
    font-weight: 405;
    display: inline-block;
    font-size: 1.4rem;
}

.airing-countdown .value[data-v-c657baee] {
    color: #ff6961;
    font-weight: 500;
}

.name span[data-v-70ae1ba4] {
    color: #ff6961;
}

.create-btn[data-v-0064307c] {
    background: #ff6961;
    border-radius: 4px;
    color: #fff;
    display: block;
    font-size: 1.4rem;
    margin-bottom: 24px;
    padding: 11px 16px;
    text-align: center;
    width: 100%;
}

.list .title[data-v-6c3dc0b8] {
    color: #ff6961;
}

.site-theme-dark {
    --color-background: 32, 32, 32;
    --color-foreground: 24, 24, 24;
    --color-foreground-grey: 15, 22, 31;
    --color-foreground-grey-dark: 6, 12, 19;
    --color-foreground-blue: 15, 22, 31;
    --color-foreground-blue-dark: 6, 12, 19;
    --color-text: 159, 173, 189;
    --color-text-light: 114, 138, 161;
    --color-text-lighter: 133, 150, 165;
    --color-shadow-blue: 0, 5, 15;
    --color-background-1200: 251, 251, 251;
    --color-background-1100: 240, 243, 246;
    --color-background-1000: 221, 230, 238;
    --color-background-900: 201, 215, 227;
    --color-background-800: 173, 192, 210;
    --color-background-700: 139, 160, 178;
    --color-background-600: 116, 136, 153;
    --color-background-500: 100, 115, 128;
    --color-background-400: 81, 97, 112;
    --color-background-300: 30, 42, 56;
    --color-background-100: 21, 31, 46;
    --color-background-200: 32, 32, 32;
    --color-gray-1200: 251, 251, 251;
    --color-gray-1100: 240, 243, 246;
    --color-gray-1000: 221, 230, 238;
    --color-gray-900: 201, 215, 227;
    --color-gray-800: 173, 192, 210;
    --color-gray-700: 139, 160, 178;
    --color-gray-600: 116, 136, 153;
    --color-gray-500: 100, 115, 128;
    --color-gray-400: 81, 97, 112;
    --color-gray-300: 30, 42, 56;
    --color-gray-100: 21, 31, 46;
    --color-gray-200: 11, 22, 34;
}

.details .link[data-v-9132cd06] {
    color: #ff6961;
}

.el-checkbox__input.is-checked + .el-checkbox__label {
    color: #ff6961;
}

.expand-description[data-v-7ea10afe]:hover {
    color: #ff8e88;
}

.wrap[data-v-544390d2] {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: rgb(40, 40, 40);
    position: relative;
}

.type[data-v-544390d2] {
    background: rgb(30, 30, 30);
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    padding: 3px 12px;
    padding-top: 7px;
}

@media (max-width: 700px) {
    .mobile-background[data-v-66608714] {
    background: #191919;
    position: absolute;
    width: 100%;
    height: 200px;
    top: 0;
    left: 0;
    z-index: 1;
    }
}

@media (max-width: 700px) {
    .mobile-background[data-v-7ea10afe] {
    background: #191919;
    }
}

.header[data-v-66608714] {
    background: #191919;
    padding-bottom: 30px;
    padding-top: 50px;
}

.mobile-filters[data-v-458a983a] {
    align-items: center;
    display: grid;
    background-color: rgb(40, 40, 40);
    grid-gap: 15px;
    grid-template-columns: auto 42px;
    margin-top: 20px;
    padding: 0 20px;
    margin-bottom: 20px;
}

.mobile-filters .search-wrap[data-v-458a983a] {
    align-items: center;
    grid-gap: 12px;
    background-color: rgb(30, 30, 30);
    height: 42px;
}

.primary-filters[data-v-7a42bb24] {
    z-index: 700;
    background-color: rgb(40, 40, 40);
}

.filters-wrap[data-v-458a983a] {
    display: grid;
    grid-template-columns: auto 42px;
    background-color: rgb(40, 40, 40);
    align-items: center;
}

.progress[data-v-815ccddc] {
    background: rgb(30, 30, 30);
    height: 11px;
    padding: 0 16.5%;
}

.reset-btn[data-v-0a867854] {
    background: #ff6961;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 1.3rem;
    margin-bottom: 25px;
    padding: 10px 14px;
    text-align: center;
    width: 100%;
}

.open-btn[data-v-458a983a] {
    align-items: center;
    background: rgb(30, 30, 30);
    border-radius: 6px;
    color: rgb(var(--color-gray-500));
    cursor: pointer;
    display: inline-flex;
    font-size: 1.8rem;
    height: 42px;
    justify-content: center;
    width: 42px;
    transition: color .3s ease-in-out;
}

.secondary-filters[data-v-7a42bb24] {
    align-items: center;
    display: grid;
    grid-template-columns: auto -webkit-min-content;
    grid-template-columns: auto min-content;
    background-color: rgb(40, 40, 40);
    margin-bottom: 30px;
    min-height: 23px;
    position: relative;
}

.search[data-v-7a42bb24] {
    font-family: Overpass, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    background: rgb(40, 40, 40);
    min-height: 100vh;
}

.footer[data-v-6f9ee47f] {
    background: #181818;
    color: #7a858f;
    color: #a0b1c5;
    font-weight: 600;
    margin-top: 20px;
    min-height: 100px;
    padding: 50px 30px;
    text-align: left;
    width: 100%;
}


.banner[data-v-b5c85c0a] {
    height: 263px;
}

@media screen and (max-width: 760px){
    .banner[data-v-b5c85c0a] {
        height: 130px;
    }
}

.el-message--success .el-message__content {
    color: #ff8e88;
}

.el-icon-success:before {
    color: #ff8e88;
}

a:hover {
    color: #ff6961;
}

.el-message--success {
    background-color: rgba(16,16,16,.75);
    border: 0px solid black;
}

.status-distribution[data-v-515ea5f2] {
    grid-area: status;
    display: none;
}

.sense-wrap.above-fold[data-v-515ea5f2] {
    margin-bottom: 20px;
    max-height: 150px;
    display: none;
}

.episodes[data-v-515ea5f2] {
    display: none;
}

.cover[data-v-57a114e8] {
    background: rgb(30, 30, 30);
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    height: 265px;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 5;
}

.header[data-v-7ea10afe] {
    background: #191919;
    padding-bottom: 30px;
    padding-top: 50px;
}

.hamburger[data-v-8aeb5e9a],
.menu[data-v-8aeb5e9a] {
    background: #181818;
    border-radius: 6px;
    box-shadow: 0 1px 20px rgba(18, 18, 18, .3);
}

.hamburger svg[data-v-8aeb5e9a] {
    color: #ff6961;
}

.filter-toggle.active[data-v-0064307c] {
    color: #ff6961;
}

.button[data-v-93c5960c] {
    align-items: center;
    background: #ff6961;
    border-radius: 4px;
    color: rgb(var(--color-text-bright));
    cursor: pointer;
    display: inline-flex;
    font-family: Overpass, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    font-size: 1.3rem;
    font-weight: 900;
    margin-left: 18px;
    padding: 10px 15px;
    transition: .2s;
}

.feed-filter.active[data-v-7b8d25f2] {
    opacity: 1;
    color: #ff6961;
}

element.style {
    position: absolute;
    top: 297px;
    background-color: #181818;
    left: 144px;
    transform-origin: center bottom;
    z-index: 2002;
}

element.style {
    position: absolute;
    top: 297px;
    left: 144px;
    background-color: #181818;
    transform-origin: center bottom;
    z-index: 2001;
}

.el-popper[x-placement^=top] .popper__arrow:after {
    bottom: 1px;
    margin-left: -6px;
    border-top-color: #181818;
    border-bottom-width: 0;
}

.el-dropdown-menu__item.active {
    color: #ff8e88;
    font-weight: 500;
}

.el-dropdown-menu__item:focus,
.el-dropdown-menu__item:not(.is-disabled):hover {
    background: #ff6961;
    color: rgb(var(--color-white));
}

.name[data-v-5a191921] {
    color: #ff6961;
    display: inline-block;
    font-size: 1.3rem;
    height: 25px;
    line-height: 25px;
    margin-left: 6px;
    vertical-align: top;
}

.actions .action[data-v-6c3dc0b8]:hover {
    color: #ff8e88;
}

.liked[data-v-b23584ce] {
    color: #ff8e88;
}

.liked[data-v-b23584ce] {
    color: #ff6961;
}

.list-editor-wrap .header .save-btn {
    background: #ff6961;
    border-radius: 3px;
    color: rgb(var(--color-white));
    cursor: pointer;
    font-size: 1.3rem;
    margin-bottom: 15px;
    padding: 8px 14px;
}

.sticky .pin[data-v-70ae1ba4] {
    color: #ff8e88;
    margin-right: 10px;
}

.user[data-v-28c2b0a4] {
    align-items: center;
    color: #ff6961;
    display: flex;
}

.markdown .markdown-spoiler:before {
    color: #ff8e88;
    cursor: pointer;
    background: rgb(30, 30, 30);
    border-radius: 3px;
    content: "Click to view Spoiler";
    font-size: 1.3rem;
    padding: 0 5px;
}

.button.comment[data-v-28c2b0a4] {
    background: #ff8e88;
    padding-left: 15px;
    padding-right: 30px;
}

.user[data-v-768af104] {
    align-items: center;
    color: #ff6961;
    display: flex;
}

.user-page-unscoped.red .progress .bar {
    background: linear-gradient(270deg, #ff6961, #ff8e88);
}

.filter-toggle.active[data-v-0a867854] {
    color: #ff6961;
}

.el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: #181818;
    border-color: #ff8e88;
}

.el-checkbox .el-checkbox__inner {
    background: #181818;
    border-color: #ff8e88;
}

.markdown-editor > div:hover {
    color: #ff8e88;
}

.nav .link[data-v-b5c85c0a]:hover {
    color: #ff8e88;
}

.favourite[data-v-9b6efc52] {
    align-items: center;
    background: rgb(16, 16, 16, .7);
    border-radius: 5px;
    color: rgb(var(--color-white));
    cursor: pointer;
    display: flex;
    font-size: 1.4rem;
    font-family: Overpass, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    font-weight: 800;
    height: 35px;
    justify-content: center;
    padding-left: 1px;
    transition: .2s;
    padding: 0 14px;
}

.favourite.isFavourite[data-v-9b6efc52] {
    color: #ff8e88;
}

.list[data-v-b5c85c0a] {
    align-items: center;
    background: #ff6961;
    border-radius: 3px;
    color: rgb(var(--color-white));
    cursor: pointer;
    display: flex;
    font-size: 1.4rem;
    height: 35px;
    justify-content: center;
    line-height: 1.3rem;
}

.search-wrap[data-v-458a983a] {
    background: rgb(30, 30, 30);
    border-radius: 6px;
    font-family: Overpass, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    font-size: 1.3rem;
    font-weight: 600;
    grid-gap: 10px;
    grid-template-columns: 13px auto 13px;
    letter-spacing: .03rem;
    padding: 11px 16px;
    padding-left: 13px;
}

.select[data-v-0f4acdbb] {
    align-items: center;
    border-radius: 6px;
    cursor: pointer;
    background: rgb(30, 30, 30);
    display: grid;
    font-size: 1.3rem;
    font-weight: 600;
    grid-template-columns: auto 20px;
    letter-spacing: .03rem;
    padding: 11px 16px;
}

.open-btn.active[data-v-a679b1ba],
.open-btn[data-v-a679b1ba]:hover {
    color: #ff6961;
}

.open-btn[data-v-a679b1ba] {
    align-items: center;
    background: rgb(30, 30, 30);
    border-radius: 6px;
    color: rgb(var(--color-gray-500));
    cursor: pointer;
    display: inline-flex;
    font-size: 1.8rem;
    height: 38px;
    justify-content: center;
    margin-top: 37px;
    width: 38px;
    transition: color .3s ease-in-out;
}

.dropdown[data-v-a679b1ba] {
    background: #181818;
    border-radius: 10px;
    padding: 40px;
    padding-bottom: 0;
    position: absolute;
    top: 100%;
    margin-top: 10px;
    right: 0;
    z-index: 60;
}

.options[data-v-0f4acdbb] {
    background: rgb(30, 30, 30);
    border-radius: 6px;
    left: 0;
    position: absolute;
    top: calc(100% + 10px);
    width: 100%;
    z-index: 50;
}

.open-btn.active[data-v-458a983a] {
    color: #ff6961;
}

h2[data-v-6f9ee47f] {
    color: #ff6961;
    font-size: 1.6rem;
    font-weight: 700;
    padding-bottom: 14px;
}

.site-theme-dark .nav-unscoped.transparent:hover {
    background: #181818;
    color: #a0b1c5;
}

.site-theme-dark .nav-unscoped {
    background: #181818;
    color: #a0b1c5;
}

.site-theme-dark .nav-unscoped.transparent {
    background: rgba(24, 24, 24, .4);
    color: #e5e7ea;
}

.feed-filter[data-v-7b8d25f2]:hover {
    color: #ff8e88;
}

.media-preview[data-v-796abd11] .media-preview-card .content {
    background: rgb(40, 40, 40);
}

.time .action[data-v-6c3dc0b8]:hover {
    color: #ff8e88;
}

.load-more[data-v-6f203cf2]:hover {
    color: #ff8e88;
    box-shadow: 0 2px 20px 0 rgba(6, 13, 34, .05);
}

.dropdown[data-v-38edf8f8] {
    background: rgb(30, 30, 30);
    border-radius: 6px;
    left: -5px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 32px;
    transition: opacity .2s ease;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 270px;
}

.dropdown[data-v-0bb70ffa] {
    background: rgb(30, 30, 30);
    border-radius: 6px;
    font-family: Overpass, -apple-system, BlinkMacSystemFont, Segoe UI, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50px;
    transition: opacity .2s ease;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 200px;
    right: -80px;
}

.airing-countdown[data-v-c657baee] {
    color: #9fadbd;
}

.site-theme-dark .quick-search {
    background: rgba(17, 17, 17, .85);
}

.input .icon.right[data-v-bcbe965e]:hover {
    color: #ff6961;
}

.input .icon.right[data-v-bcbe965e]:hover {
    color: #ff6961;
    transition-duration: .5s;
}

.size-toggle[data-v-6aea970d]:hover {
    color: #ff6961;
}

.dropdown[data-v-38edf8f8]:before {
    width: 0;
    height: 0;
    content: "";
    z-index: 2;
    transform: scale(1.01);
    border-bottom: .6rem solid rgb(30, 30, 30);
    border-left: .4rem solid transparent;
    border-right: .4rem solid transparent;
    bottom: 100%;
    color: rgb(30, 30, 30);
    left: 15%;
    position: absolute;
}

.dropdown[data-v-0bb70ffa]:before {
    width: 0;
    height: 0;
    content: "";
    z-index: 2;
    transform: scale(1.01);
    border-bottom: .6rem solid rgb(30, 30, 30);
    border-left: .4rem solid transparent;
    border-right: .4rem solid transparent;
    bottom: 100%;
    color: rgb(30, 30, 30);
    right: 92px;
    position: absolute;
}

.banner .shadow[data-v-b5c85c0a] {
    background: rgba(17, 17, 17, .4);
    height: 100%;
    width: 100%;
}

[data-v-bcbe965e] .result:hover {
    background-color: #ff6961;
}

[data-v-bcbe965e] .result .open-list-editor {
    align-items: center;
    background: hsla(0, 0%, 100%, .45);
    border-radius: 50px;
    color: #fff;
    display: flex;
    height: 24px;
    justify-content: center;
    opacity: 0;
    position: absolute;
    right: 10px;
    top: calc(50% - 12px);
    transition: opacity .3s ease;
    width: 24px;
}

.el-dialog__headerbtn:focus .el-dialog__close,
.el-dialog__headerbtn:hover .el-dialog__close {
    color: #ff6961;
}

}

@-moz-document regexp("^https://anilist.co/anime/.*/.*/watch") {

@media screen and (max-width: 760px) {
    .external-links[data-v-da429fba] {
        display: inline;
    }
}

@media (max-width: 1040px) {
    .watch[data-v-7e52d138] {
    margin-top: 20px;
    }
}

@media (max-width: 760px) {
    .data[data-v-c657baee] {
    display: none;
    }
}

.content[data-v-da429fba] {
    margin-top: 18.5px;
}

}

@-moz-document regexp("^https://anilist.co/manga/.*/.*/stats") {

@media screen and (max-width: 760px) {
    .external-links[data-v-da429fba] {
        display: inline;
    }
}

@media screen and (max-width: 760px) {
    .data[data-v-c657baee] {
        display: none;
    }
}

.content[data-v-da429fba] {
    margin-top: 18.5px;
}

}