MediaWiki:Themes.css

/** Lyrics Infobox [credits: LOONA Wiki]**/ .pi-theme-lyrics.portable-infobox { width: auto; float: none; text-transform: none; font-weight: normal; margin-left: 0; } .pi-theme-lyrics .pi-header { display: none; } .pi-theme-lyrics .pi-data { width: 100%; margin: 0 auto; background: none !important; } .pi-theme-lyrics .pi-data-value { font-size: 14px; width: 100%; text-align: center; } .pi-theme-lyrics .pi-navigation { font-weight: normal; text-align: center; font-size: 14px !important; } /* == Make the tabs centered == */ .pi-theme-lyrics.portable-infobox ul.wds-tabs { justify-content: center; }

/* Background coloring */ .theme-fandomdesktop-light .portable-infobox.pi-theme-lyrics.pi-background { background-color: #f9f9f9; } .theme-fandomdesktop-dark .portable-infobox.pi-theme-lyrics.pi-background { background-color: var(--theme-page-background-color); background-image: linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)); }

.portable-infobox.pi-theme-lyrics .wds-tabs__tab .wds-tabs__tab-label { height: auto; width: auto !important; padding: 4px 8px; transition: none; font-weight: normal; letter-spacing: 0; } .portable-infobox.pi-theme-lyrics .wds-tabs__tab { width: auto; background-color: #f9f9f9; } .portable-infobox.pi-theme-lyrics .wds-tabs__tab:hover { background-color: #f0f0f0; } .portable-infobox.pi-theme-lyrics .wds-tabs__tab.wds-is-current { box-shadow: none; background-color: var(--theme-accent-color); color: var(--theme-accent-label-color); } .theme-fandomdesktop-dark .portable-infobox.pi-theme-lyrics .wds-tabs__tab:not(.wds-is-current) { background-color: var(--theme-page-background-color); background-image: linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)); } .theme-fandomdesktop-dark .portable-infobox.pi-theme-lyrics .wds-tabs__tab:not(.wds-is-current):hover { background-color: var(--theme-page-background-color); background-image: linear-gradient(rgba(255,255,255,.2), rgba(255,255,255,.2)); }

/* Color-themes */ /* Film */ .portable-infobox.pi-theme-film, .portable-infobox.pi-theme-film .pi-border-color { border-color: #2d36ea; } .portable-infobox.pi-theme-film .pi-title { background-color: #2d36ea; } .portable-infobox.pi-theme-film .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-film .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-film .pi-navigation a { color: white; } /* Series/Anime */ .portable-infobox.pi-theme-series, .portable-infobox.pi-theme-series .pi-border-color { border-color: #2d36ea; } .portable-infobox.pi-theme-series .pi-title { background-color: #2d36ea; } .portable-infobox.pi-theme-series .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-series .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-series .pi-navigation a { color: white; } /* Season */ .portable-infobox.pi-theme-season, .portable-infobox.pi-theme-season .pi-border-color { border-color: #2d36ea; } .portable-infobox.pi-theme-season .pi-title { background-color: #2d36ea; } .portable-infobox.pi-theme-season .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-season .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-season .pi-navigation a { color: white; } /* Person */ .portable-infobox.pi-theme-person, .portable-infobox.pi-theme-person .pi-border-color { border-color: #d3d3d3; } .portable-infobox.pi-theme-person .pi-title { background-color: #d3d3d3; color: black; } .portable-infobox.pi-theme-person .pi-header { background-color: #e6e6e6; } .portable-infobox.pi-theme-person .pi-navigation { background-color: #d3d3d3; color: black; } .portable-infobox.pi-theme-person .pi-navigation a { color: black; } /* Character/Groups */ .portable-infobox.pi-theme-character, .portable-infobox.pi-theme-character .pi-border-color { border-color: #F90025; } .portable-infobox.pi-theme-character .pi-title { background-color: #F90025; } .portable-infobox.pi-theme-character .pi-header { background-color: #ff7c8f; } .portable-infobox.pi-theme-character .pi-navigation { background-color: #F90025; color: white; } .portable-infobox.pi-theme-character .pi-navigation a { color: white; } /* Location */ .portable-infobox.pi-theme-location, .portable-infobox.pi-theme-location .pi-border-color { border-color: #25963e; } .portable-infobox.pi-theme-location .pi-title { background-color: #25963e; } .portable-infobox.pi-theme-location .pi-header { background-color: #5ad676; } .portable-infobox.pi-theme-location .pi-navigation { background-color: #25963e; color: white; } .portable-infobox.pi-theme-location .pi-navigation a { color: white; } /* Object */ .portable-infobox.pi-theme-object, .portable-infobox.pi-theme-object .pi-border-color { border-color: #088488; } .portable-infobox.pi-theme-object .pi-title { background-color: #088488; } .portable-infobox.pi-theme-object .pi-header { background-color: #00cdd0; } .portable-infobox.pi-theme-object .pi-navigation { background-color: #088488; color: white; } .portable-infobox.pi-theme-object .pi-navigation a { color: white; } /* Video game */ .portable-infobox.pi-theme-videogame, .portable-infobox.pi-theme-videogame .pi-border-color { border-color: #228b22; } .portable-infobox.pi-theme-videogame .pi-title { background-color: #228b22; } .portable-infobox.pi-theme-videogame .pi-heade { background-color: #3ebd68; } .portable-infobox.pi-theme-videogame .pi-navigation { background-color: #228b22; color: white; } .portable-infobox.pi-theme-videogame .pi-navigation a { color: white; } /* Song */ .portable-infobox.pi-theme-song, .portable-infobox.pi-theme-song .pi-border-color { border-color: #2b93ff; } .portable-infobox.pi-theme-song .pi-title { background-color: #2b93ff; } .portable-infobox.pi-theme-song .pi-header { background-color: #79bbff; } .portable-infobox.pi-theme-song .pi-navigation { background-color: #2b93ff; color: white; } .portable-infobox.pi-theme-song .pi-navigation a { color: white; } /* Album */ .portable-infobox.pi-theme-album, .portable-infobox.pi-theme-album .pi-border-color { border-color: #eb585d; } .portable-infobox.pi-theme-album .pi-title { background-color: #eb585d; } .portable-infobox.pi-theme-album .pi-header { background-color: #f39ea1; } .portable-infobox.pi-theme-album .pi-navigation { background-color: #eb585d; color: white; } .portable-infobox.pi-theme-album .pi-navigation a { color: white; } /* Channel */ .portable-infobox.pi-theme-album, .portable-infobox.pi-theme-album .pi-border-color { border-color: #eb585d; } .portable-infobox.pi-theme-channel .pi-title { background-color: #a020f0; } .portable-infobox.pi-theme-channel .pi-header { background-color: #d9a5f9; } .portable-infobox.pi-theme-channel .pi-navigation { background-color: #a020f0; color: white; } .portable-infobox.pi-theme-channel .pi-navigation a { color: white; } /* Episode */ .portable-infobox.pi-theme-episode, .portable-infobox.pi-theme-episode .pi-border-color { border-color: #26abff; } .portable-infobox.pi-theme-episode .pi-title { background-color: #26abff; } .portable-infobox.pi-theme-episode .pi-header { background-color: #bfe6ff; } .portable-infobox.pi-theme-episode .pi-navigation { background-color: #26abff; color: white; } .portable-infobox.pi-theme-episode .pi-navigation a { color: white; } /* Company */ .portable-infobox.pi-theme-company, .portable-infobox.pi-theme-company .pi-border-color { border-color: #5d3df3; } .portable-infobox.pi-theme-company .pi-title { background-color: #5d3df3; } .portable-infobox.pi-theme-company .pi-header { background-color: #ae9fe9; } .portable-infobox.pi-theme-company .pi-navigation { background-color: #5d3df3; color: white; } .portable-infobox.pi-theme-company .pi-navigation a { color: white; } /* Streaming service */ .portable-infobox.pi-theme-streaming, .portable-infobox.pi-theme-streaming .pi-border-color { border-color: #4188ff; } .portable-infobox.pi-theme-streaming .pi-title { background-color: #4188ff; } .portable-infobox.pi-theme-streaming .pi-header { background-color: #accbff; } .portable-infobox.pi-theme-streaming .pi-navigation { background-color: #4188ff; color: white; } .portable-infobox.pi-theme-streaming .pi-navigation a { color: white; } /* Website */ .portable-infobox.pi-theme-website, .portable-infobox.pi-theme-website .pi-border-color { border-color: #ffc500; } .portable-infobox.pi-theme-website .pi-title { background-color: #ffc500; color: black; } .portable-infobox.pi-theme-website .pi-header { background-color: #ffff99; } .portable-infobox.pi-theme-website .pi-navigation { background-color: #ffc500; color: black; } .portable-infobox.pi-theme-website .pi-navigation a { color: black; } /* Franchise */ .portable-infobox.pi-theme-franchise, .portable-infobox.pi-theme-franchise .pi-border-color { border-color: #000099; } .portable-infobox.pi-theme-franchise .pi-title { background-color: #000099; } .portable-infobox.pi-theme-franchise .pi-header { background-color: #9999ff; } .portable-infobox.pi-theme-franchise .pi-navigation { background-color: #000099; color: white; } .portable-infobox.pi-theme-franchise .pi-navigation a { color: white; } /* Species */ .portable-infobox.pi-theme-species, .portable-infobox.pi-theme-species .pi-border-color { border-color: #ff0080; } .portable-infobox.pi-theme-species .pi-title { background-color: #ff0080; } .portable-infobox.pi-theme-species .pi-header { background-color: #ff69b4; } .portable-infobox.pi-theme-species .pi-navigation { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-species .pi-navigation a { color: white; } /* Book */ .portable-infobox.pi-theme-book, .portable-infobox.pi-theme-book .pi-border-color { border-color: #be8f3c; } .portable-infobox.pi-theme-book .pi-title { background-color: #be8f3c; } .portable-infobox.pi-theme-book .pi-header { background-color: #f2dcb1; } .portable-infobox.pi-theme-book .pi-navigation { background-color: #be8f3c; color: white; } .portable-infobox.pi-theme-book .pi-navigation a { color: white; } /* === User colors === */ /* Silver (Default) */ .portable-infobox.pi-theme-silver, .portable-infobox.pi-theme-silver .pi-border-color { border-color: #be8f3c; } .portable-infobox.pi-theme-silver .pi-title { background-color: #d3d3d3; color: black; } .portable-infobox.pi-theme-silver .pi-header { background-color: #e6e6e6; } .portable-infobox.pi-theme-silver .pi-navigation { background-color: #d3d3d3; color: black; } .portable-infobox.pi-theme-silver .pi-navigation a { color: black; } /* Red */ .portable-infobox.pi-theme-red, .portable-infobox.pi-theme-red .pi-border-color { border-color: #F90025; } .portable-infobox.pi-theme-red .pi-title { background-color: #F90025; color: white; } .portable-infobox.pi-theme-red .pi-header { background-color: #ff7c8f; } .portable-infobox.pi-theme-red .pi-navigation { background-color: #F90025; color: white; } .portable-infobox.pi-theme-red .pi-navigation a { color: white; } /* Orange */ .portable-infobox.pi-theme-orange, .portable-infobox.pi-theme-orange .pi-border-color { border-color: #FF7614; } .portable-infobox.pi-theme-orange .pi-title { background-color: #FF7614; color: white; } .portable-infobox.pi-theme-orange .pi-header { background-color: #ffa361; } .portable-infobox.pi-theme-orange .pi-navigation { background-color: #FF7614; color: white; } .portable-infobox.pi-theme-orange .pi-navigation a { color: white; } /* Yellow */ .portable-infobox.pi-theme-yellow, .portable-infobox.pi-theme-yellow .pi-border-color { border-color: #FFE400; } .portable-infobox.pi-theme-yellow .pi-title { background-color: #FFE400; color: black; } .portable-infobox.pi-theme-yellow .pi-header { background-color: #ffec54; } .portable-infobox.pi-theme-yellow .pi-navigation { background-color: #FFE400; color: black; } .portable-infobox.pi-theme-yellow .pi-navigation a { color: black; } /* Green */ .portable-infobox.pi-theme-green, .portable-infobox.pi-theme-green .pi-border-color { border-color: #00CB00; } .portable-infobox.pi-theme-green .pi-title { background-color: #00CB00; color: white; } .portable-infobox.pi-theme-green .pi-header { background-color: #96ff96; } .portable-infobox.pi-theme-green .pi-navigation { background-color: #00CB00; color: white; } .portable-infobox.pi-theme-green .pi-navigation a { color: white; } /* Blue */ .portable-infobox.pi-theme-blue, .portable-infobox.pi-theme-blue .pi-border-color { border-color: #2d36ea; } .portable-infobox.pi-theme-blue .pi-title { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-blue .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-blue .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-blue .pi-navigation a { color: white; } /* Purple */ .portable-infobox.pi-theme-purple, .portable-infobox.pi-theme-purple .pi-border-color { border-color: #8D42F6; } .portable-infobox.pi-theme-purple .pi-title { background-color: #8D42F6; color: white; } .portable-infobox.pi-theme-purple .pi-header { background-color: #c6a0fa; } .portable-infobox.pi-theme-purple .pi-navigation { background-color: #8D42F6; color: white; } .portable-infobox.pi-theme-purple .pi-navigation a { color: white; } /* Violet - same as purple */ .portable-infobox.pi-theme-violet, .portable-infobox.pi-theme-violet .pi-border-color { border-color: #8D42F6; } .portable-infobox.pi-theme-violet .pi-title { background-color: #8D42F6; color: white; } .portable-infobox.pi-theme-violet .pi-header { background-color: #c6a0fa; } .portable-infobox.pi-theme-violet .pi-navigation { background-color: #8D42F6; color: white; } .portable-infobox.pi-theme-violet .pi-navigation a { color: white; } /* Lavender */ .portable-infobox.pi-theme-lavender, .portable-infobox.pi-theme-lavender .pi-border-color { border-color: #B57EDC; } .portable-infobox.pi-theme-lavender .pi-title { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-lavender .pi-header { background-color: #E4C1FE; } .portable-infobox.pi-theme-lavender .pi-navigation { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-lavender .pi-navigation a { color: white; } /* Teal */ .portable-infobox.pi-theme-teal, .portable-infobox.pi-theme-teal .pi-border-color { border-color: #009194; } .portable-infobox.pi-theme-teal .pi-title { background-color: #009194; color: white; } .portable-infobox.pi-theme-teal .pi-header { background-color: #00b8bb; } .portable-infobox.pi-theme-teal .pi-navigation { background-color: #009194; color: white; } .portable-infobox.pi-theme-teal .pi-navigation a { color: white; } /* Pink */ .portable-infobox.pi-theme-pink, .portable-infobox.pi-theme-pink .pi-border-color { border-color: #ff0080; } .portable-infobox.pi-theme-pink .pi-title { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-pink .pi-header { background-color: #ff7fbf; } .portable-infobox.pi-theme-pink .pi-navigation { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-pink .pi-navigation a { color: white; } /* === Gender === */ /* Male */ .portable-infobox.pi-theme-male .pi-title { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-male .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-male .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-male .pi-navigation a { color: white; } /* Female */ .portable-infobox.pi-theme-female .pi-title { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-female .pi-header { background-color: #ff7fbf; } .portable-infobox.pi-theme-female .pi-navigation { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-female .pi-navigation a { color: white; } /* Non-binary */ .portable-infobox.pi-theme-nonbinary .pi-title { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-nonbinary .pi-header { background-color: #E4C1FE; } .portable-infobox.pi-theme-nonbinary .pi-navigation { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-nonbinary .pi-navigation a { color: white; } /* === Fix capitalization === */ /* Male */ .portable-infobox.pi-theme-Male .pi-title { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-Male .pi-header { background-color: #969af4; } .portable-infobox.pi-theme-Male .pi-navigation { background-color: #2d36ea; color: white; } .portable-infobox.pi-theme-Male .pi-navigation a { color: white; } /* Female */ .portable-infobox.pi-theme-Female .pi-title { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-Female .pi-header { background-color: #ff7fbf; } .portable-infobox.pi-theme-Female .pi-navigation { background-color: #ff0080; color: white; } .portable-infobox.pi-theme-Female .pi-navigation a { color: white; } /* Non-binary */ .portable-infobox.pi-theme-Nonbinary .pi-title { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-Nonbinary .pi-header { background-color: #E4C1FE; } .portable-infobox.pi-theme-Nonbinary .pi-navigation { background-color: #B57EDC; color: white; } .portable-infobox.pi-theme-Nonbinary .pi-navigation a { color: white; }