trainingpeaks.com Dark Mode
当前为
/* ==UserStyle==
@name trainingpeaks.com - Dark Mode
@version 20241107.04.55
@namespace typpi.online
@description trainingpeaks.com Dark Mode
@author Nick2bad4u
@license UnLicense
@homepageURL https://github.com/Nick2bad4u/UserStyles
==/UserStyle== */
@-moz-document domain("trainingpeaks.com")
{
/* Invert colors except images and videos */
:is(html:not([stylus-iframe]), img, svg, video):not(png), #workOutQuickView > div.QVHeader > div.QVHeaderItemsContain.cf > div.workoutBarView > div:nth-child(2) > div > div > div.workoutIconAndKeyStats > div.tomahawkButton, body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div > div > div:nth-child(1) > div.profilePicture > fieldset > div
{
filter: invert(1) hue-rotate(180deg) !important;
}
/* Ensure background images are not inverted */
:is(html:not([stylus-iframe]), img, svg, video, #workOutQuickView > div.QVHeader > div.QVHeaderItemsContain.cf > div.workoutBarView > div:nth-child(2) > div > div):not(z#z.z[z])
{
background-color: inherit !important;
}
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer,
#wrapper > div > div > div.appHeader > div.userControls,
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeContent > div.columns > div.column__center > div > div.todaysWorkouts > div:nth-child(n) > div > div > div.workoutHeader
{
background: #FFF !important;
}
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeHeader > div.athleteName,
.value
{
color: #9612B2 !important;
text-decoration-line: underline;
text-decoration-color: blue;
}
#wrapper > div > div > div.appHeader > div.userControls > div.logoAndUserType > a.appHeaderLogoLargeScreen,
#wrapper > div > div > div.appHeader > div.userControls > div.secondaryNavigation > div.appHeaderUserSettings > div.appHeaderUserPhoto,
span,
button,
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeHeader > div.athletePhoto > div > div,
#wrapper > div > div > div.appHeader > div.userControls > div.secondaryNavigation > div.tpVirtualButtonContainer > button > svg > path:nth-child(n)
{
filter: invert(1) hue-rotate(180deg)
}
a:hover,
button:hover
{
text-decoration-line: underline !important;
text-decoration-color: #B41289 !important;
}
.tabbedLayoutNav li,
.overlayBoxBody > ul > li.active > span
{
color: White;
}
.tabbedLayoutNav li:hover,
.overlayBoxBody > ul > li.active > span:hover
{
color: #006BB9;
}
.css-37jdci-MuiTypography-root.title.newActivityUItitle.MuiTypography-H6.MuiTypography-root,
body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div:nth-child(n) > div.heartRateZones > div > div > div.zoneSetContain.heartrate > fieldset > label:nth-child(n) > span,
body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div:nth-child(n) > div.heartRateZones > div > div > div.zones.zonesConfigGroupView.ui-sortable > div:nth-child(n) > span,
span.zoneEntryTo,
span.zoneSetTitle
{
color: white;
}
.MuiTypography-root
{
color: #CB0808;
}
.units
{
color: #007580 !important;
}
body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div:nth-child(n) > div.heartRateZones > div > div > div.zoneSetContain.heartrate > fieldset > label:nth-child(n) > input,
.heartRateZones > div > div > div.zones.zonesConfigGroupView.ui-sortable > div:nth-child(n) > input,
body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div:nth-child() > div.powerZones > div > div > div.zoneSetContain.power > fieldset > label > input,
body > div.tabbedSettings.userSettings.overlayBox.modal.modalShadow > div.overlayBoxBody > div.tabbedLayoutBody.scrollable > div > div > div:nth-child(2) > div.powerZones > div > div > div.zones.zonesConfigGroupView.ui-sortable > div:nth-child(n) > input.numberInput.tpSettingsInput.min.first
{
color: black;
}
div.workoutStatsColumn.workoutStatsUnitLabel > label,
div.workoutStatsColumn.workoutStatsLabel > label,
div.workoutStatsColumn.workoutStatsMinMaxAvgLabel > label,
div.equipment > div > div:nth-child(2) > div > label,
div.equipment > div > div:nth-child(3) > label
{
color: green;
}
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeContent > div.columns > div.column__center > div > div.todaysWorkouts > div.metric > div > div.activityHeader.metricsTileHeader > div > div > span.metricKeyStat.activitySubText,
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeContent > div.columns > div.column__center > div > div.todaysWorkouts > div.metric > div > div.activityHeader.metricsTileHeader > div > span:nth-child(n)
{
color: red;
}
#quickViewContent > div.tabContent.tabContentRegion > div > div > div.rightColumn > div.otherThanCommentsContainer > div.workoutTagsContainer > div > div > div:nth-child(n) > span,
#wrapper > div > div > div.appHeader > div.dreamingSeasonPencilBanner > div.dreamingSeasonPencilBannerContainer > div > span.MuiTypography-root.MuiTypography-body1.css-1njuh5f-MuiTypography-root,
#wrapper > div > div > div.appHeader > div.dreamingSeasonPencilBanner > div.dreamingSeasonPencilBannerContainer > div > span.MuiTypography-root.MuiTypography-body1.css-1d9r2xn-MuiTypography-root,
#workOutQuickView > div.QVHeader > div.QVHeaderItemsContain.cf > div.performanceData > div > div > div > div.form.TSB > span.label,
#workOutQuickView > div.QVHeader > div.QVHeaderItemsContain.cf > div.dateAndTime > div > div > div > span,
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div > div.trainingPeaksAthleteHomeContent > div.columns > div.column__center > div > div.todaysWorkouts > div.metric > div > div.activityHeader.metricsTileHeader > div > div > span:nth-child(1)
{
color: white;
}
#workOutQuickView > div.QVHeader > div.QVHeaderItemsContain.cf > div.workoutBarView > div:nth-child(2) > div > div
{
border: white !important;
border-color: #CB0808 !important;
border-style: dashed !important;
}
.css-70qvj9.MuiBox-root.athleteHealthMetricsCalendarCardHeaderRight > svg > path
{
fill: #ff0000 !important;
/* changes the color to red */
}
#wrapper > div > div > div.appContainerLibrayAndContentContainer > div.appContainerMainContentContainer > div > div.frameworkMainWrapper > div > div.calendarContainer > div > div > div.contents.scrollable > div.focusedWeeks > div.calendarWeekContainer.inView > div > div:nth-child(n) > div.activities > div:nth-child(n) > div > div > div.lowerWorkoutCard > div.PRCommentRPEContainer
{
filter: invert(20%) sepia(90%) saturate(700%) hue-rotate(180deg) brightness(90%) contrast(90%);
}
#commentsContainer > div > div > div:nth-child(1) > div.rpeContainer > div > div > div.emojiSelector.greatToBrutal > div.emojiScale > div:nth-child(n)
{
filter: invert(70%) sepia(100%) saturate(500%) hue-rotate(18deg) brightness(50%) contrast(100%);
}
#chartsContainer > div > div.dashboardChart
{
border: 2px solid pink;
}
}