trainingpeaks.com - Dark Mode

trainingpeaks.com Dark Mode

  1. /* ==UserStyle==
  2. @name trainingpeaks.com - Dark Mode
  3. @version 20241107.04.57
  4. @namespace typpi.online
  5. @description trainingpeaks.com Dark Mode
  6. @author Nick2bad4u
  7. @license UnLicense
  8. @homepageURL https://github.com/Nick2bad4u/UserStyles
  9. @supportURL https://github.com/Nick2bad4u/UserStyles/issues
  10. ==/UserStyle== */
  11. @-moz-document domain("trainingpeaks.com") {
  12. /* Invert colors except images and videos */
  13. :is(html:not([stylus-iframe]), img, svg, video):not(png),
  14. .tomahawkButton,
  15. .profilePicture > fieldset > div {
  16. filter: invert(1) hue-rotate(180deg) !important;
  17. }
  18.  
  19. /* Ensure background images are not inverted */
  20. :is(
  21. html:not([stylus-iframe]),
  22. img,
  23. svg,
  24. video,
  25. #workOutQuickView
  26. > div.QVHeader
  27. > div.QVHeaderItemsContain.cf
  28. > div.workoutBarView
  29. > div:nth-child(2)
  30. > div
  31. > div
  32. ):not(z#z.z[z]) {
  33. background-color: inherit !important;
  34. }
  35.  
  36. .appContainerMainContentContainer,
  37. .userControls,
  38. .todaysWorkouts > div:nth-child(n) > div.workoutHeader {
  39. background: #fff !important;
  40. }
  41.  
  42. #wrapper
  43. > div
  44. > div
  45. > div.appContainerLibrayAndContentContainer
  46. > div.appContainerMainContentContainer
  47. > div
  48. > div
  49. > div.trainingPeaksAthleteHomeHeader
  50. > div.athleteName,
  51. .value {
  52. color: #9612b2 !important;
  53. text-decoration-line: underline;
  54. text-decoration-color: blue;
  55. }
  56.  
  57. .appHeaderLogoLargeScreen,
  58. .appHeaderUserPhoto,
  59. span,
  60. button,
  61. .athletePhoto > div > div,
  62. .tpVirtualButtonContainer
  63. > button
  64. > svg
  65. > path:nth-child(n) {
  66. filter: invert(1) hue-rotate(180deg);
  67. }
  68.  
  69. a:hover,
  70. button:hover {
  71. text-decoration-line: underline !important;
  72. text-decoration-color: #b41289 !important;
  73. }
  74.  
  75. .tabbedLayoutNav li,
  76. .overlayBoxBody > ul > li.active > span {
  77. color: white;
  78. }
  79.  
  80. .tabbedLayoutNav li:hover,
  81. .overlayBoxBody > ul > li.active > span:hover {
  82. color: #006bb9;
  83. }
  84.  
  85. .css-37jdci-MuiTypography-root.title.newActivityUItitle.MuiTypography-H6.MuiTypography-root,
  86. .zoneSetContain.heartrate
  87. > fieldset
  88. > label:nth-child(n)
  89. > span,
  90. .zones.zonesConfigGroupView.ui-sortable
  91. > div:nth-child(n)
  92. > span,
  93. span.zoneEntryTo,
  94. span.zoneSetTitle {
  95. color: white;
  96. }
  97.  
  98. .MuiTypography-root {
  99. color: #cb0808;
  100. }
  101.  
  102. .units {
  103. color: #007580 !important;
  104. }
  105.  
  106. .zoneSetContain.heartrate
  107. > fieldset
  108. > label:nth-child(n)
  109. > input,
  110. .heartRateZones
  111. > div
  112. > div
  113. > div.zones.zonesConfigGroupView.ui-sortable
  114. > div:nth-child(n)
  115. > input,
  116. .zoneSetContain.power > fieldset > label > input,
  117. .zones.zonesConfigGroupView.ui-sortable
  118. > div:nth-child(n)
  119. > input.numberInput.tpSettingsInput.min.first {
  120. color: black;
  121. }
  122.  
  123. div.workoutStatsColumn.workoutStatsUnitLabel > label,
  124. div.workoutStatsColumn.workoutStatsLabel > label,
  125. div.workoutStatsColumn.workoutStatsMinMaxAvgLabel > label,
  126. div.equipment > div > div:nth-child(2) > div > label,
  127. div.equipment > div > div:nth-child(3) > label {
  128. color: green;
  129. }
  130.  
  131. .activityHeader.metricsTileHeader
  132. > div
  133. > div
  134. > span.metricKeyStat.activitySubText,
  135. .activityHeader.metricsTileHeader
  136. > div
  137. > span:nth-child(n) {
  138. color: red;
  139. }
  140.  
  141. .workoutTagsContainer
  142. > div
  143. > div
  144. > div:nth-child(n)
  145. > span,
  146. .dreamingSeasonPencilBannerContainer
  147. > div
  148. > span.MuiTypography-root.MuiTypography-body1.css-1njuh5f-MuiTypography-root,
  149. .dreamingSeasonPencilBannerContainer
  150. > div
  151. > span.MuiTypography-root.MuiTypography-body1.css-1d9r2xn-MuiTypography-root,
  152. .form.TSB > span.label,
  153. #workOutQuickView
  154. > div.QVHeader
  155. > div.QVHeaderItemsContain.cf
  156. > div.dateAndTime
  157. > div
  158. > div
  159. > div
  160. > span,
  161. .activityHeader.metricsTileHeader
  162. > div
  163. > div
  164. > span:nth-child(1) {
  165. color: white;
  166. }
  167.  
  168. .workoutBarView > div:nth-child(2) > div > div {
  169. border: white !important;
  170. border-style: dashed !important;
  171. border-color: #cb0808 !important;
  172. }
  173.  
  174. .css-70qvj9.MuiBox-root.athleteHealthMetricsCalendarCardHeaderRight
  175. > svg
  176. > path {
  177. fill: #ff0000 !important;
  178. /* changes the color to red */
  179. }
  180.  
  181. .activities
  182. > div:nth-child(n)
  183. > div
  184. > div
  185. > div.lowerWorkoutCard
  186. > div.PRCommentRPEContainer {
  187. filter: invert(20%) sepia(90%) saturate(700%)
  188. hue-rotate(180deg) brightness(90%) contrast(90%);
  189. }
  190.  
  191. .emojiScale > div:nth-child(n) {
  192. filter: invert(70%) sepia(100%) saturate(500%)
  193. hue-rotate(18deg) brightness(50%) contrast(100%);
  194. }
  195.  
  196. #chartsContainer > div > div.dashboardChart {
  197. border: 2px solid pink;
  198. }
  199. }

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址