AOTYColors by aguywhosaguy

/* ==UserStyle==
@name   AOTYColors
@namespace  github.com/aguywhosaguy
@version    1.0.2
@preprocessor   stylus
@description    Allows you to control the colors on albumoftheyear
@author aguywhosaguy <aguywhosaguy@aguywhosaguy.com> (https://aguywhosaguy.com)
@license    MIT
@var    color   primaryColor "Primary Color" #040e32
@var    color   secondaryColor "Secondary Color" #1a145d
@var    color   font "Font" #FFFFFF
@var    color   accent "Accent" #426fd9
@var    color   lowRatingColor "Low Rating (0-49) Color" #D76666
@var    color   mediumRatingColor "Medium Rating (50-69) Color" #F0E68C
@var    color   highRatingColor "High Rating (70-100) Color" #85CE73
@var    color   mustHearUsers "Must Hear: Users" rgba(39, 76, 236, .85)
@var    color   mustHearCritics "Must Hear: Critics" rgba(221, 79, 129, .85)
@var    color   mustHearBoth "Must Hear: Both" rgba(221, 37, 221, .85)
@var    checkbox    logoColor "Light AOTY Logo" 1
==/UserStyle== */

@-moz-document url-prefix("https://www.albumoftheyear.org/") 
    body, body.dark
        // Primary - Darkest
        background-color: primaryColor
        color: font
        
        .header, #centerContent, .searchContainer, .largeSearch
            color: font
            
        .wideLeft,  .profileNav div,  .albumRankNav.prev,  .albumRankNav.next,  .summaryPointsMisc,  .headerYearEnd .link,  .userListRow img,  #searchSuggestions .ui-autocomplete,  #findAlbums .ui-autocomplete,  .albumCriticScoreBox,  .albumUserScoreBox .moreStats 
            border-color: primaryColor
            
        .fullWidth,  .wideLeft,  .rightBox,  .adTagTwo,  .adTagThree,  .artistHeader,  .facetContent,  .facetColumn,  .dotDropMenu,  .headerYearEnd,  table.userStatsTable tr:nth-child(even),  #listEdit tr.focus,  .header,  #centerContent,  .searchContainer, .largeSearch
            background-color: primaryColor
            
            
            
            
        // Secondary - Medium Dark, Alternate Medium Dark, Misc
        .nav, .rightContent, table.discussion th, .signInComments, .signInReview, .viewMoreDiscussion, .albumCriticScoreBox, .albumUserScoreBox, .albumButton, .albumButton.vinyl, .facetTitle, .artistCriticScoreBox, .artistUserScoreBox, .profileNav, .userReviewScoreBox, .prevAlbumReview, .nextAlbumReview, .loginContainer, .albumListScoreContainer, .feedUserHead, .listItem:hover, .yourRatingContainer, .commentBoxContainer, .socialConnect, .albumRankNav.prev, .albumRankNav.next, .overlay .content, .thisDay, .dotDropMenu .row:hover, .grayBox, .footer, .summaryPointsMisc, .summaryRecentLists, .otherLists, .donorList tr:nth-child(even), table.listRows tr:nth-child(even), .commentButtonDesktop, .menuDropSelected ul li, .menuDropSelected ul, .menuDropSelected ul  li.current:hover, .ui-autocomplete, .correctionResponse, .submitMediaBox, .songScoreBox, .adInArticle, .signInNotice, .tag, .noCover, .summaryPointsMisc:hover, .ui-autocomplete li:hover, .ui-autocomplete li:hover a, .statsHeaderRow, .listenOn, .dotDropMenu hr, textarea, .ratingTextBox, input[type=text], #newListForm .checkmark, #editListForm .checkmark, select, .inputFile, .navBlock.signIn, .navBlock.profile
            background-color: secondaryColor
        
        .albumBlock .image img, .albumTopBox.cover img, .userReviewBlock .cover img, .listItemSmall .cover img, .albumListCover img, .recentTopAlbumBlock img, .userReviewImage.square img, .userReviewHeader .cover img, .rightBox.donorBanner, .feedAlbumRow .cover img, .updImage img, .userCover img, .noCover, .userListRow, .userListBlock .userCover img, .userListRow .covers img, .userListRow .userCover img, .albumReviewRow.showUser .userReviewImage.square img, .ratingRowContainer, .albumReviewRow, .rightBox .row, .albumListRow, .listItem, .mediaContainer, .profileStatContainer, .profileStatContainer.first, .artistTopBox.info, table.discussion td, table.discussion, .albumHeader, .artistHeader.small, .rightBox .moreButton, .largeButton, .albumButton, .albumTopBox.info, .button, .commentTextBox, .prevAlbumReview, .nextAlbumReview, .newsListContainerSmall, .albumListLinks div, .reviewTextBox, .feedAlbumRow, .userListRow, .ratingTextBox, .notificationRow, .commentRow, .upd, .listSummaryRow, .listSelect, #newListForm textarea, #newListForm input[type=text], #newListForm .checkmark, #editListForm .checkmark, #listEdit table, #listEdit td, #editListForm textarea, #editListForm input[type=text], #editListEntry textarea, #editListEntry input[type=text], .dotDropMenu, .editUserEntry input, .editUserEntry select, table.existing td, table.existing th, .addCoverBox, input[type=submit].link, .editUserEntry textarea, .textBox, .textLine, .userReviewBlock.full, .listRow, .overlaySearchBox, .donorList, table.listRows, .menuDropSelected ul, .tagRow, .overlayTextarea, .trackListTable td, .ratingDistribution, .overlay select, .inlineRelated, .artistList .photo, .artistList .name, .songRatings, .ui-autocomplete, .credit, .sectionEnd
            border-color: secondaryColor
        
        a .button, .profileNav div.selected, .profileNav div:hover, .yearNavBox.selected, input[type=submit].link
            color: secondaryColor
            
            
            

        // Fonts - White, Lighter Grey, Lightest Grey
        .genreHeader p.description, .genreSuggestDescription, a, a:visited, a .pageSelect, a:visited .pageSelect, .rating, a .artistTitle, a .albumTitle, a:visited .artistTitle, a:visited .albumTitle, .sectionHeading a:visited, .sectionHeading a, .instagramHead, .facebookHead, .twitterHead, .selectRow .selected, .filterRow .selected, .sectionHeading, table.discussion th, .detailRow a, .detailRow a:visited, .detailRow, .rightBox .moreButton, a .largeButton, .albumButton, .relatedHeading a, a .albumButton.vinyl, .albumHeadline .artist a, .profileStat, .artistTitle A, A .artistTitle, .albumTitle A:Visited, .artistTitle.black A:Visited, A:visited .albumTitle, .albumTitle a, a .albumTitle, .criticListBlockTitle a, .criticListBlockTitle a:visited, .listItem a, .userReviewName a:visited, .userReviewName a, .relatedHeading a, .relatedHeading a:visited, textarea, .commentTextBox.small, .ratingTextBox, .headline a, .headline a:visited, .albumUserScoreBox a, .buyAmazon a, input[type=text], select, .listDescription, .commentTextBox, .listRow .about, .subHeadline a, .subHeadline a:visited, .userListBlock .albumTitle a, .ui-autocomplete li, .ui-autocomplete li a, .ui-autocomplete li:hover, .ui-autocomplete li:hover a, .ratingRowContainer a:hover .icon, .followsYou, .listenOn .title, .overlay .albumListScoreContainer .scoreText, a:hover, a:hover .selectBox, .albumReviewLinks a:hover, .albumCriticScore a, .albumCriticScore a:visited, .albumUserScore a, .albumUserScore a:visited, .albumReviewRating, a:hover .artistTitle, a:hover .albumTitle, .albumUserScore, .gradeScale, .headline a:hover, .userListBlock .albumTitle a:hover, .menuDropSelected ul li a, #searchSuggestions .ui-autocomplete li a, #findAlbums .ui-autocomplete li a, .mediaContainer .links a:hover, .mediaLinks a:hover, .albumBlockLinks a:hover, .overlay .tab a, .overlay .tab a:visited, .reviewFunctionRow .dotDropMenuContainer a:hover, .spinList:hover, .inSpinList:hover, .addToList:hover, .likeAlbum:hover, .share:hover, .reviewFunctionRow .recommend:hover, .reviewFunctionRow .tagLink:hover, .reviewFunctionRow .dotDropMenuContainer a .icon:hover, .distCount a:visited:hover, .listenAlbum:hover, .navBlock a, .navBlock a:visited
            color: font
            
        #newListForm .checkmark::after, #editListForm .checkmark::after
            border-color: font
            
            
            
            
        // Accent - Somewhat Light Grey, Hint of Blue
        .ratingText, .selectBox, .albumReviewLinks, .detailRow span, .detailRow span a, .detailRow span a:visited, .gray, .sectionHeading .viewAll, .commentFunctions, .commentFunctions a,  .commentFunctions a:visited, .commentDate, .profileStatName, A.gray:visited, A.gray, a .reviewIcon, .row.comments, .albumListScoreContainer .scoreText, ::placeholder, #newListForm label, #editListForm label, #editListEntry label, .facetCount, .footerColumn, .footerColumn div, .footerContent div, .noCover i, .noCover span, .summaryPointsMisc, .summaryRecentLists .date, .dotDropMenuButton a:hover, table.userStatsTable td.headColumn, table.userStatsTable td.headColumn a, #searchSuggestions .resultRow .year, #findAlbums .resultRow .year, .overlay .subHeading, .mediaText a, .ratingRowContainer a .icon, .albumReviewLinks a:visited, .userListLikeContainer a:visited, .albumReviewLinks a, .userListLikeContainer a, .mediaLinks a, .albumBlockLinks a, .albumBlockLinks, .mediaLinks a:visited, .albumBlockLinks a:visited, .mediaContainer .links a, .mediaContainer .links a:visited, .distCount, .distCount a:visited, .distCount a
            color: accent
            
        .ratingBar, .gradeScale, .tag.strong, .smallBottomLink, .menuDropSelected ul li:hover, table.userStatsTable tr:hover, .distBar, .followsYou, .userListRow.profile .covers, .filterButtons div.highlight, .filterButtons div:hover
            background-color: accent
        
        a .reviewIcon, .follow, .following, .userListRow.profile .covers:hover, .genreSuggestGenre, .mediaText a, .submitMediaBox, .tinyTable tr, .loginContainer, .smallButton:hover, table.discussion.recommendations td.sentBy a:hover .profilePic img, .overlaySearchBox:focus, .yearNavBox.decade, .pageSelect
            border-color: accent
            
            
            
            
        // Rating Fonts
        .red-font
            color: lowRatingColor
            
        .yellow-font
            color: mediumRatingColor
            
        .green-font
            color: highRatingColor
        
            
            
            
    // Rating Bars
    .ratingBar, .albumReviewRatingBar
        .red
            background-color: lowRatingColor
    ...