Allows you to control (almost) every color on AOTY
AOTYColors by aguywhosaguy

Details
Authoraguywhosaguy
LicenseMIT
Categoryalbumoftheyear
Created
Updated
Code size13 kB
Code checksumd1202e7e
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Allows you to control (almost) every color on AOTY!
If you have any problems, send me a DM on Discord @aguywhosaguy. I'm in the AOTY Discord server.
Features
- Change the main and font colors
- Change the red, yellow, and green rating colors
- Change the "Must Hear" label colors
- Change the color of the AOTY logo from light to black
- Compatibility with light and dark mode
- Added styles for Rice's AOTY Add-ons
- Supports Striikerr's UserStyle [highly recommend, makes AOTY wide]
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name AOTYColors
@namespace github.com/aguywhosaguy
@version 1.1.1
@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 !important
color: font !important
.wideLeft, .profileNav div, .albumRankNav.prev, .albumRankNav.next, .summaryPointsMisc, .headerYearEnd .link, .userListRow img, #searchSuggestions .ui-autocomplete, #findAlbums .ui-autocomplete, .albumCriticScoreBox, .albumUserScoreBox .moreStats
border-color: primaryColor !important
.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 !important
// 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, .donateButtonPurchaseContainer, .listItem.selected, .yearNavBox.selected
background-color: secondaryColor !important
.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, .yearNavBox
border-color: secondaryColor !important
a .button, .profileNav div.selected, .profileNav div:hover, input[type=submit].link
color: secondaryColor !important
// 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, .sectionHeading .viewAll a:hover, .subHeadline .viewAll a:hover, .header, #centerContent, .searchContainer, .largeSearch, .listItem.selected, a:hover .listItem, .yearNavBox.selected
color: font !important
#newListForm .checkmark::after, #editListForm .checkmark::after
border-color: font !important
.listItem a:hover
text-decoration: underline !important
// 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 !important
.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 !important
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, .reviewTextBox, .commentTextBox
border-color: accent !important
.reviewTextBox, .co...