Dark theme for cos.tv videos platform.
(almost 100% dark)
COS.TV Dark theme by savebytes
Details
Authorsavebytes
LicenseMIT
Categorycos
Created
Updated
Size9.5 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
/* ==UserStyle==
@name cos.tv
@version 20220327.03.30
@namespace userstyles.world/user/savebytes
@description Dark theme for cos.tv videos platform.
(almost 100% dark)
@author savebytes
@license MIT
==/UserStyle== */
@-moz-document url-prefix("https://cos.tv/") {
/* Colors config */
:root {
--main-background-color: #181818;
--header-background-color: rgb(33, 33, 33);
--text-color: #ececec;
--link-color: #3674ff;
--search-background-color: #121212;
}
/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
scrollbar-width: auto;
scrollbar-color: #4d4d4d #1a1a1a;
}
/* Chrome, Edge, and Safari */
*::-webkit-scrollbar {
background: #1a1a1a;
width: 14px;
}
*::-webkit-scrollbar-thumb {
background-color: #6c6c6c;
background-clip: padding-box;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
border-radius: 100px;
}
.comp-spinner,
body {
background-color: var(--main-background-color) !important;
}
}
@-moz-document url("https://cos.tv/") {
/* Main */
.page-home[data-v-21ba1791] {
background-color: var(--main-background-color);
}
/* Videos */
.item-out li .item-wrapper .bottom-part .face-out .right {
background-color: var(--header-background-color) !important;
}
.item-out li .item-wrapper .bottom-part .face-out .right > span {
color: #a6a6a6e0 !important;
}
.go,
.cta {
background-color: var(--main-background-color) !important;
}
}
@-moz-document url-prefix("https://cos.tv/videos/play/") {
/* Videos settings */
.app-router-view-container {
background: var(--main-background-color);
}
.page-video-play .play-left {
background: var(--main-background-color);
}
.comment-wrap,
.comp-video-description,
.follower,
.comp-current-video-info-bar,
.play-rank {
background: var(--main-background-color) !important;
}
.rank-wrapper[data-v-9978f8d6] {
background: var(--main-background-color) !important;
}
.rank {
background: var(--header-background-color) !important;
}
.title {
color: var(--text-color) !important;
}
.commit-tabs .tab-out .commit-num {
color: var(--text-color) !important;
}
.content {
color: var(--text-color) !important;
}
.content > a {
color: var(--link-color) !important;
}
.follower .face-wrap .creator-icon {
filter: brightness(0) invert(1);
}
.follower .face-wrap .subscribe.followed {
color: black !important;
}
.comp-comment-textarea .textarea-wrapper .text-area {
color: white !important;
}
.comp-comment-textarea .misc .coment-button[type=reset] {
color: #9d9d9d !important;
}
.comp-emoji-picker .switch-btn-wrapper .btn-switch,
.creator-emoji-wrap .creator-icon {
filter: brightness(0) invert(1);
}
.comp-emoji-picker .switch-btn-wrapper .btn-switch:hover,
.creator-emoji-wrap .creator-icon:hover {
filter: brightness(0) invert(0.6);
}
.msg-center-time {
color: #7b7b7b !important;
}
.video-lists .top .tips-text {
color: white !important;
}
.video-lists .top .model-tips-content {
background: var(--header-background-color) !important;
}
.slider-btn-container .switch {
background: #848484 !important;
}
.learn-more-container .learn-more {
filter: brightness(0) invert(1);
}
.model-tips-content {
background: var(--header-background-color) !important;
}
.ticket-rank-list-container {
background: var(--header-background-color) !important;
}
.ticket-rank-list-container > ul {
overflow-x: hidden;
}
.ticket-rank-list-container > .top {
background: var(--main-background-color);
height: auto;
}
.auto {
background: transparent !important;
}
.buy-emoji-pop {
background: var(--main-background-color) !important;
}
.buy-emoji-pop .close img {
filter: invert(1);
}
}
@-moz-document url-prefix("https://cos.tv/videos/play/") {
/* Video player */
.vjs-has-started .vjs-control-bar {
background: rgba(0, 0, 0, 0);
}
.vjs-control-bar:before {
pointer-events: none;
content: "";
width: 100%;
height: 250px;
position: absolute;
bottom: 0px;
background: rgb(0,0,0);
background: linear-gradient(0deg, rgba(0,0,0,0.97) 0%, rgba(0, 0, 0, .16) 45%, rgba(255,255,255,0) 100%);
}
.video-js .vjs-play-progress {
background-color: #4780ff !important;
}
.video-js .vjs-play-progress:before {
color: #3674ff !important;
font-size: 1em;
}
.comp-pop-reward-box .progress-box .progress-container .progress-value {
height: 90% !important;
margin: 0 auto !important;
text-align: center;
}
}
@-moz-document url("https://cos.tv/"), url("https://cos.tv/ucenter/summary"), url-prefix("https://cos.tv/videos/play"), url-prefix("https://cos.tv/subject/home/dist"), url-prefix("https://cos.tv/home"), url-prefix("https://cos.tv/channel/") {
/* Header */
.cos-header {
background-color: var(--header-background-color) !important;
}
.comp-main-search .search-wrap {
border-radius: 10px !important;
}
.logo-img {
object-position: -99999px 99999px;
background: url("https://i.imgur.com/oqwCVO3.png") no-repeat center;
background-size: contain;
}
.cos-header .arrow-down:after {
filter: brightness(0) invert(1);
}
.menu-list-wrapper {
background: var(--main-background-color) !important;
}
.menu-list-wrapper > .menu-item > a {
color: var(--text-color) !important;
}
.menu-list-wrapper > .menu-item:hover > a {
background: var(--header-background-color) !important;
}
.message-center-container .msg-title-container {
background-color: var(--header-background-color) !important;
}
.msg-list-container {
background-color: var(--header-background-color) !important;
}
.msg-center-list > li:hover {
background-color: var(--main-background-color) !important;
}
.msg-reply-container {
background-color: var(--header-background-color) !important;
}
.reply-list-container .reply-list > li.comment-bgc {
background-color: var(--header-background-color) !important;
}
.secondary-comment ul > :first-child {
background-color: var(--main-background-color) !important;
}
.money {
color: var(--text-color) !important;
}
.out {
filter: brightness(0) invert(1);
}
.long > .v {
color: #000 !important;
}
.comp-main-search .search-wrap {
background-color: var(--search-background-color) !important;
}
.cos-header .header-link.studio {
border-radius: 10px !important;
}
.comp-main-search .search-wrap .search {
border-top-right-radius: 10px !important;
border-bottom-right-radius: 10px !important;
}
.person-info {
background-color: var(--main-background-color) !important;
}
.strips .strip span.icon .tips p {
color: var(--text-color) !important;
}
.strips .strip span.icon .tips[data-v-88d256a0] {
background-color: var(--main-background-color) !important;
z-index: 999999;
}
.strips > div > span.icon {
object-position: 9999px 9999px;
background: url("https://i.imgur.com/pu1tg0a.png") center no-repeat !important;
background-size: contain !important;
}
.strips .strip span.icon .tips:before {
border-left: 5px solid rgba(215, 19, 19, 0) !important;
border-right: 5px solid rgba(227, 24, 24, 0) !important;
border-bottom: 5px solid var(--header-background-color) !important;
}
.lists {
background: var(--main-background-color) !important;
color: var(--text-color) !important;
}
.lists > div:hover {
background: var(--search-background-color) !important;
}
.cos-header .link-menu-wrapper .link-menu-current[data-v-7dba9dc6] {
color: var(--text-color) !important;
}
.language-menu-wrapper * {
color: var(--text-color) !important;
}
.person-info * {
color: var(--text-color) !important;
}
}
@-moz-document url("https://cos.tv/"), url-prefix("https://cos.tv/videos/play") {
/* General text and others*/
a,
span,
p,
h1,
h2,
h3,
h4,
h5 {
color: var(--text-color) !important;
}
input {
color: var(--text-color) !important;
}
}
@-moz-document url-prefix("https://cos.tv/v2/wallet") {
/* Wallet MainNet v2 (the new dashboard)*/
.theme--light.v-app-bar.v-toolbar.v-sheet {
background-color: var(--header-background-color) !important;
}
.router-link-active > div > .v-image__image {
background: url("https://i.imgur.com/oqwCVO3.png") no-repeat center !important;
background-size: contain !important;
}
button.v-app-bar__nav-icon {
filter: brightness(0) invert(1);
}
.v-toolbar__title {
color: var(--text-color) !important;
}
span.v-btn__content > i {
color: #ececec !important;
}
.v-main > .v-main__wrap {
background: var(--main-background-color) !important;
}
h1 {
color: var(--text-color) !important;
}
div.v-navigation-drawer__content {
background: var(--header-background-color) !important;
}
div.v-list * {
color: white !important;
}
div.v-card {
background: var(--header-background-color) !important;
}
div.v-list {
background: var(--header-background-color) !important;
}
div.v-card__title {
color: white !important;
}
span.v-chip__content {
color: white !important;
}
div.theme--light.v-data-table {
background: var(--header-background-color) !important;
}
div.theme--light.v-data-table * {
color: white !important;
}
tbody > tr:hover {
background: var(--main-background-color) !important;
}
ul > li > button {
background: var(--header-background-color) !important;
color: white !important;
}
button > i {
color: white !important;
}
.v-card__text * {
color: white !important;
}
.v-stepper {
background: var(--header-background-color) !important;
}
.v-stepper * {
color: white !important;
}
.v-application--is-ltr .theme--light.v-stepper--vertical .v-stepper__content:not(:last-child) {
border-left: 1px solid rgba(219, 219, 219, .23) !important;
}
.text-truncate {
color: #c6c6c6 !important;
}
.spacer + span {
color: #fff;
}
.v-icon {
color: #fff !important;
}
}