A modern, dark mode way to view your favourite Fantasy PL website. Works with FPL Tools too. Try it out now!
Modern FPL, Modern Dark FPL, Modern FPL Dark, Dark Mode FPL, Dark FPL, FPL, fantasy premierleague, fantasypl
Dark FPL by crossandinshallah
Details
Authorcrossandinshallah
LicenseCC BY-NC - Creative Commons Attribution - Non Commercial
Categoryfpl, pl, fantasypl, dark mode, dark, modern
Created
Updated
Size77 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Dark FPL
@version 2.1
@namespace userstyles.world/user/crossandinshallah
@description A modern, dark mode way to view your favourite Fantasy PL website
@author Simon
@license CC BY-NC - Creative Commons Attribution - Non Commercial
==/UserStyle== */
@-moz-document domain("fantasy.premierleague.com") {
:root {
--yellow: #FFE65B;
--orange: #FFAB1B;
--red: #FD4651;
--pink: #FF2974;
--lightpurple: #ea00ff;
--purple: #6e0078;
--darkpurple: #4E00A8;
--darkmodegray: #181A1B;
--invdark: #e7e5e4;
--bgpurple: #37003C;
--infogray: #DAD7D2;
--textgray: #CAC6BF;
--titlegray: #D9D9D9;
--disabledgray: #282C2D;
}
/* Team List Table */
.ElementTable-sc-1v08od9-0 {
border-radius: 15px;
}
/* Fixture Score Divider */
.NzGhj {
border-color: #404647 !important;
}
/* Status Table Borders */
.kGMjuJ {
border-bottom: 1px solid var(--disabledgray) !important;
}
/* Fixture Tab Border */
.jWmOgG {
border: none !important;
}
/* Active Bench Boost */
.eFcsvM {
border-radius: 0 0 25px 25px;
}
/* Orange Player */
.lbpiqh {
border-radius: 5px 5px 0 0;
}
/* Team News */
.tWCAn {
color: var(--pink);
}
.hxsLSP {
color: var(--pink);
}
.ikULsl {
border-color: var(--disabledgray) !important;
}
.slick-slide {
border-color: var(--disabledgray) !important;
}
/* Player Transfer Table */
.ElementListRow__StyledElementListRow-sc-122fdeq-0 {
border-bottom: 1px solid #3d3d3d;
border-radius: 25px;
}
/* Player Transfer List */
.dSplok {
border-radius: 15px 0 0 15px;
}
.dUzotg {
border-radius: 0 15px 15px 0;
}
/* Report Name */
.csDFXJ {
border-radius: 25px;
}
.dhPWJq {
padding: 10px;
}
/* Switch Player */
.notranslate {
border-radius: 15px;
}
/* Player List Printable */
.ism-table--el-list-print__name {
border-radius: 15px 0 0 15px;
}
.ism-table--el-list-print__rank {
border-radius: 0 15px 15px 0;
}
/* Deadlines */
#ism-collapsible-272 > div > table > thead > tr > th:first-child {
border-radius: 15px 0 0 15px;
}
#ism-collapsible-272 > div > table > thead > tr > th:last-child {
border-radius: 0 15px 15px 0;
}
/* Chips Rules */
#ism-collapsible-271 > div > table > thead > tr > th:first-child {
border-radius: 15px 0 0 15px;
}
#ism-collapsible-271 > div > table > thead > tr > th:last-child {
border-radius: 0 15px 15px 0;
}
/* Scoring Rules */
#ism-collapsible-273 > div > table:nth-child(2) > thead > tr > th:first-child {
border-radius: 15px 0 0 15px;
}
#ism-collapsible-273 > div > table:nth-child(2) > thead > tr > th:last-child {
border-radius: 0 15px 15px 0;
}
/* Leagues Phases */
#ism-collapsible-274 > div > table > thead > tr > th:first-child {
border-radius: 15px 0 0 15px;
}
#ism-collapsible-274 > div > table > thead > tr > th:last-child {
border-radius: 0 15px 15px 0;
}
/* Change Kit */
/* Select */
.gVsPkM {
border-radius: 25px !important;
background-color: #282C2D !important;
}
/* Color */
.ColorPicker__Preview-sc-19ux5mj-3 {
border-radius: 25px !important;
}
.dYkMki {
background-color: #282C2D !important;
border-radius: 5px !important;
}
/* H2H Standings Table */
/* Left */
#root > div:nth-child(2) > div > div.Layout__Main-eg6k6r-1.wXYnc > div.sc-bdnxRM.hItLLq > div > table > thead > tr > th:first-child {
border-radius: 15px 0 0 15px;
}
/* Right */
#root > div:nth-child(2) > div > div.Layout__Main-eg6k6r-1.wXYnc > div.sc-bdnxRM.hItLLq > div > table > thead > tr > th:last-child {
border-radius: 0 15px 15px 0;
}
/* H2H Match Scores */
.hsLBEv {
border-radius: 15px;
}
/* H2H Matches/Standings */
.irqFXE {
border-radius: 25px;
color: var(--textgray);
background-color: var(--darkmodegray);
border: none !important;
}
.iUeZnT {
border: none !important;
}
.NkgEU {
padding: 2px;
border-radius: 25px;
background-color: var(--darkpurple);
}
.hVwLXd {
border-radius: 6px;
color: black;
background: transparent;
}
.cxwWgD {
border-radius: 6px;
color: black;
background: transparent;
}
.hVwLXd > * {
color: black;
}
.fcpffP > thead > tr > th {
color: black;
}
/* H2H Highlight */
.eLwKMj > td:first-child {
border-radius: 15px 0 0 15px;
}
.eLwKMj > td:last-child {
border-radius: 0 15px 15px 0;
}
/* Cup */
/* Started in */
.eNluGh {
filter: grayscale() invert();
}
/* Non-Highlight Match */
.duqxSY {
border-radius: 25px;
}
/* N/A */
.dknBRX {
border-radius: 25px;
}
/* Bye Progress */
.dNcRIM {
color: black;
border-radius: 25px;
}
/* Points Table Borders */
.VFvId {
border-color: var(--disabledgray) !important;
}
/* Reload Points Button */
.cECRAW {
fill: var(--textgray);
}
/*** Scrollbar ***/
::-webkit-scrollbar {
border-radius: 25px !important;
width: 15px;
}
::-webkit-scrollbar-thumb {
background-image: linear-gradient(to bottom, rgb(0, 255, 135), rgb(2, 239, 255));
border-radius: 25px !important;
}
::-webkit-scrollbar-thumb:hover {
background-image: linear-gradient(to bottom, rgb(0, 255, 135), rgb(2, 239, 255));
}
.BenchUnit__BenchUnitHeading-sc-1ua794p-1 {
color: #37003C
}
.ButtonLink__ButtonHyperlink-sc-457mfk-0 {
color: var(--bgpurple);
}
#root > div:nth-child(2) > div.Layout__Wrapper-eg6k6r-0.kzyLIb > div.Layout__Main-eg6k6r-1.wXYnc > div.GraphicPatterns__PatternWrapMain-bfgp6c-0.dyLYOH > div.GraphicPatterns__Glass-bfgp6c-2.dIGCmx > div > div.TabHeading__TabHeadingOuter-sc-1wos76v-0.dbiWsa > div > h3 {
background-image: linear-gradient(to right, #37003C, #37003C)
}
#root > div:nth-child(2) > div.Layout__Wrapper-eg6k6r-0.kzyLIb > div.Layout__Main-eg6k6r-1.wXYnc > div.GraphicPatterns__PatternWrapMain-bfgp6c-0.izzKYk > div.GraphicPatterns__Glass-bfgp6c-2.hpjzWp > div > div.TabHeading__TabHeadingOuter-sc-1wos76v-0.dbiWsa > div > h3,
#root > div:nth-child(2) > div.SquadBase__PusherWrap-sc-16cuskw-0.sQBlU > div > div > div.Layout__Main-eg6k6r-1.wXYnc > div:nth-child(2) > div.GraphicPatterns__PatternWrapMain-bfgp6c-0.gArsoz > div.Scoreboard__ScoreboardWrap-sc-117tw9n-0.eBaJTr > div.DeadlineBar__StyledDeadlineBar-sc-15w29wz-0.cOzWYq > div.TabHeading__TabHeadingOuter-sc-1wos76v-0.dbiWsa > div > h3 {
background-image: linear-gradient(0, #37003C, #37003C);
}
.cpMJME {
background-image: linear-gradient(rgba(255, 255, 255, 0) 240px, transparent 360px), url(/static/media/pattern-1-874.9efe982e.png), linear-gradient(to right, rgb(2, 239, 255), rgb(98, 123, 255));
background-position: 0px 0px, right -60px top -481px, 0px 0px;
background-size: auto, 653px 925px, auto;
}
.dObEsi {
border-radius: 15px;
}
.kfCfav {
border-radius: 25px;
}
.frUpra {
border-radius: 8px;
background-image: linear-gradient(to right, rgb(0, 255, 135), rgb(2, 239, 255));
color: #37003C;
}
.iszZmN {
border-radius: 6px 6px 0 0;
}
.eKeAHJ,
.fyDevqc {
color: #37003C;
}
.DeadlineBar__DeadlineBarInner-sc-15w29wz-1 {
color: #37003C;
}
.ezEDev {
background-image: linear-gradient(transparent 60%, turquoise);
}
.dyLjqd {
display: none;
}
.dyLYOH {
box-shadow: none;
overflow: hidden;
background-image: linear-gradient(rgba(255, 255, 255, 0) 30px, #181A1B 120px), url(/static/media/pattern-2-crop-184.d7588c45.png), linear-gradient(to right, rgb(2, 239, 255), rgb(98, 123, 255));
}
.efhndX {
background-image: url(/static/media/pattern-2-crop-90.0e86ae39.png), linear-gradient(rgba(255, 255, 255, 0) 80px, #181A1B 160px), linear-gradient(to right, rgb(2, 239, 255), rgb(98, 123, 255));
box-shadow: none;
}
.gArsoz {
overflow: hidden;
background-image: linear-gradient(rgba(255, 255, 255, 0) 200px, #181A1B 320px), url(/static/media/pattern-2-crop-184.d7588c45.png), linear-gradient(to right, rgb(2, 239, 255), rgb(98, 123, 255));
}
div[class^='Fixture__Broadcaster'] {
display: none;
}
.diTVCI {
z-index: 120;
max-width: 90%;
max-height: 90%;
padding: 0px;
border: 0px;
border-radius: 6px;
width: 640px;
color: currentcolor;
box-shadow: rgba(0, 0, 0, 0.25) 0px 12px 24px 0px;
background-repeat: no-repeat;
background-position: right top, 0px center, 0px center;
background-image: url("/static/media/pattern-2-crop-90.0e86ae39.png"), linear-gradient(rgba(255, 255, 255, 0) 10px, rgba(255, 255, 255, 0.2) 30px, #181A1B 60px), linear-gradient(to right, rgb(2, 239, 255), rgb(98, 123, 255));
}
/* Player Page */
.lotDTB.ism-overflow-scroll {
padding-left: 10px;
padding-right: 10px;
}
/* Dialog Text */
#ism-dialog-title {
margin-left: 20px;
}
/*** Player Tables ***/
/** This Season **/
/* Left */
#root-dialog > div > dialog > div > div.Dialog__StyledDialogBody-sc-5bogmv-7.lotDTB.ism-overflow-scroll > div.sc-bdnxRM.ichxnR > div > div > div:nth-child(1) > div > table > thead > tr > th:first-child {
border-radius: 10px 0 0 10px;
}
/* Right */
#root-dialog > div > dialog > div > div.Dialog__StyledDialogBody-sc-5bogmv-7.lotDTB.ism-overflow-scroll > div.sc-bdnxRM.ichxnR > div > div > div:nth-child(1) > div > table > thead > tr > th:last-child {
border-radius: 0 10px 10px 0;
}
/** Previous Seasons */
/* Left */
#root-dialog > div > dialog > div > div.Dialog__StyledDialogBody-sc-5bogmv-7.lotDTB.ism-overflow-scroll > div.sc-bdnxRM.ichxnR > div > div > div.sc-bdnxRM.fDjTdD > div > table > thead > tr > th:first-child {
border-radius: 10px 0 0 10px;
}
/* Right */
#root-dialog > div > dialog > div > div.Dialog__StyledDialogBody-sc-5bogmv-7.lotDTB.ism-overflow-scroll > div.sc-bdnxRM.ichxnR > div > div > div.sc-bdnxRM.fDjTdD > div > table > thead > tr > th:last-child {
border-radius: 0 10px 10px 0;
}
/* KOGW Page */
.bfDFcP {
background-color: var(--darkmodegray);
border-radius: 25px;
}
.gOBSRy {
background-color: #212425;
border-radius: 25px;
}
/* Hide Captain Explainer */
.eBSDei {
display: none;
}
/* FDR Filter */
.bXUbam {
background-color: var(--invdark);
filter: invert();
}
...