Skip to content

Instantly share code, notes, and snippets.

@SpinB

SpinB/verge.css

Created September 21, 2019 04:01
Show Gist options
  • Save SpinB/d44d525157220d05ec758bf6b5e2a98a to your computer and use it in GitHub Desktop.
Save SpinB/d44d525157220d05ec758bf6b5e2a98a to your computer and use it in GitHub Desktop.
Download ZIP
Custom coloring of verge.com
Raw
verge.css
/***********************************************************************************************************************
THE VERGE BY SpinBox
************************************************************************************************************************/
@-moz-document domain(theverge.com) {
body,
html {
background-color: #151515 !important;
color: #888888 !important;
}
.c-masthead__main,
.l-root {
background-color: #151515 !important;
}
.c-global-header::before {
background-color: #181818 !important;
}
.c-global-header {
border-color: #B60E63 !important;
color: #888888 !important;
}
.p-input-header {
background: #121212 !important;
border-bottom: 1px solid #B60E63 !important;
border-top: 1px solid #252525 !important;
}
.p-input-header__input {
color: #888888 !important;
}
.c-seven-up .c-entry-box--compact {
background-color: #181818 !important;
color: #888888 !important;
}
.l-hub-wrapper {
background-color: #181818 !important;
}
.c-compact-river__entry {
background-color: #202020 !important;
border-top: 1px solid #B60E63 !important;
}
.c-compact-river .c-entry-box--compact--featured:not(.c-entry-box--compact--hero),
.c-compact-river .c-entry-box--compact--package_landing{
background-color: #181818 !important;
color: #888888 !important;
}
.c-compact-river .c-entry-box--compact--package_landing .c-entry-box--compact__body .c-entry-box--compact__title a{
color: #B60E63 !important;
}
.c-compact-river .c-entry-box--compact--package_landing .c-entry-box--compact__body .c-entry-box--compact__dek,
.c-compact-river .c-entry-box--compact--featured:not(.c-entry-box--compact--hero) .c-entry-box--compact__dek{
color: #666666 !important;
}
.c-byline__item::before{
border-left: #B60E63 !important
}
.c-rock-list {
background-color: #252525 !important;
color: #888888 !important;
}
.l-main-content {
background-color: #252525 !important;
color: #888888 !important;
}
.c-seven-up {
background-color: #151515 !important;
}
span[class="c-rock-list__item--body"],
.c-page-title {
color: #888888 !important;
}
.c-seven-up .c-entry-box--compact:last-child .c-byline,
.c-seven-up .c-entry-box--compact:last-child .c-entry-sponsorship {
color: #666666 !important;
}
.e-image__meta-cite,
.e-image cite,
.c-related-list__head {
color: #B60E63 !important;
}
.e-image__meta {
border-bottom: 1px solid #B60E63 !important;
}
.c-related-list__community-name,
.c-related-list__group-name:link,
.c-related-list__head a:link {
color: #393092 !important;
}
.c-social-buttons__popover {
background-color: #181818 !important;
box-shadow: 0 0 5px #151515 !important;
}
.c-social-buttons__popover-header {
color: #888888 !important;
border-bottom: #252525 1px solid !important;
}
a.c-social-buttons__more svg {
fill: #B60E63 !important;
}
spam[class="c-social-buttons--label"] {
color: #B60E63 !important;
}
.c-tab-bar {
border-bottom: 1px solid #B60E63 !important;
background: hsla(0, 0%, 15%, .9) !important;
}
.p-page-title,
.c-group-header {
border-color: #393092 !important;
}
.c-pagination {
background-color: #202020 !important;
}
.c-entry-hero--unison-split-left,
.c-entry-hero--unison-split-right {
background-color: #181818 !important;
color: #888888 !important;
}
.c-entry-content .blockquote, .c-entry-content .p-blockquote, .c-entry-content blockquote{
background-color: #181818 !important;
border-left: #393092 6px solid !important;
}
.c-entry-hero--unison-split-left .c-byline,
.c-entry-hero--unison-split-left .c-entry-sponsorship,
.c-entry-hero--unison-split-left .c-page-title,
.c-entry-hero--unison-split-left .p-dek,
.c-entry-hero--unison-split-right .c-byline,
.c-entry-hero--unison-split-right .c-entry-sponsorship,
.c-entry-hero--unison-split-right .c-page-title,
.c-entry-hero--unison-split-right .p-dek {
color: #666666 !important;
}
.c-entry-content .p-pullquote::after,
.c-entry-content .pullquote::after,
.c-entry-content q::after,
.c-entry-content .p-pullquote::before,
.c-entry-content .pullquote::before,
.c-entry-content q::before {
background: #E5127D !important;
}
.c-comments__message {
background-color: #252525 !important;
color: #888888 !important;
}
.c-comments__load-error {
background: #151515 !important;
}
.c-comments__load-error pre {
background-color: #202020 !important;
border: 1px solid #202020 !important;
}
.c-comments__comment {
border-bottom: 1px solid #B60E63 !important;
border-left: 3px solid #B60E63 !important;
background: #202020 !important;
}
.c-comments__list {
border-top: 1px solid #393092 !important;
border-left: 1px solid #393092 !important;
border-right: 1px solid #393092 !important;
}
.c-comments__recommended{
background: #181818 !important;
}
.c-seven-up .c-entry-box--compact:last-child {
background: linear-gradient(90deg,#f7c626 15%,#f68c2f 40%,#e5127d 85%) !important;
}
.c-seven-up .c-entry-box--compact:last-child a{
color: #000000 !important;
}
.volume-video, html, body{
background-color: #151515 !important;
}
.c-entry-box--group-4-up .c-entry-box-group__title{
background-color: #222222 !important;
color: #E5127D !important;
}
.c-footer {
background-color: #181818 !important;
color: #888888 !important;
border-top: 1px solid #B60E63 !important;
}
.c-tab-bar__logo svg{
margin-left: 40px !important;
}
.c-image-gallery__viewer-next, .c-image-gallery__viewer-prev,
.c-image-gallery__thumbs-next, .c-image-gallery__thumbs-prev,
.p-modal__window {
background-color: #151515 !important;
}
/*twitter*/
.EmbeddedTweet--mediaForward .EmbeddedTweet-tweet,
.EmbeddedTweet
{
background: #252525 !important;
color: #888888 !important;
border-color: #393092 !important;
}
.CallToAction{
background: #252525 !important;
border-color: #B60E63 !important;
}
.CallToAction:hover{
border-color: #E5127D !important;
}
.MediaCard-borderOverlay{
border-color: #B60E63 !important;
}
.EmbeddedTweet--mediaForward:hover .MediaCard-borderOverlay{
border-color: #393092 !important;
}
/**/
.c-scorecard__additional-info{
background-color: #252525 !important;
}
.c-entry-sidebar{
background-color: #252525 !important;
color: #666666 !important;
}
/*BLOCKED ITEMS*/
div[id="privacy-consent"],
.c-tab-bar .c-social-buttons a,
.c-newsletter_signup_box__disclaimer,
.c-newsletter_signup_box
{
display: none !important;
}
/**/
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment