/ plugins / oled-theme-luna / src / dark-theme.css
dark-theme.css
  1  /*
  2  {
  3      "name": "Abyss Neptune",
  4      "author": "@itzzexcel",
  5      "description": "Abyss Neptune: ShadowX Theme from Spicetify to TIDAL (17/Jan/2025)"
  6  }
  7  */
  8  
  9  ::-webkit-scrollbar {
 10      display: none;
 11  }
 12  
 13  :root {
 14      --wave-color-solid-accent-fill: white;
 15      --wave-color-solid-rainbow-yellow-fill: white;
 16      --wave-color-solid-contrast-fill: white;
 17      --wave-color-solid-base-brighter: black;
 18      --wave-text-body-medium: white !important;
 19      --track-vibrant-color: white !important;
 20      --wave-color-opacity-contrast-fill-ultra-thin: #fffafa1a !important;
 21      --wave-color-solid-rainbow-yellow-darkest: #fffafa1a !important;
 22      --wave-color-solid-accent-dark: rgb(128, 128, 128);
 23  }
 24  
 25  /* Credits to https://github.com/surfbryce for the fonts */
 26  @font-face {
 27      font-family: "AbyssFont";
 28      font-weight: 400;
 29      src: url("https://excel.lexploits.top/extra/tidal/LyricsRegular.woff2") format("woff2");
 30  }
 31  
 32  @font-face {
 33      font-family: "AbyssFont";
 34      font-weight: 500;
 35      src: url("https://excel.lexploits.top/extra/tidal/LyricsMedium.woff2") format("woff2");
 36  }
 37  
 38  @font-face {
 39      font-family: "AbyssFont";
 40      font-weight: 600;
 41      src: url("https://excel.lexploits.top/extra/tidal/LyricsSemibold.woff2") format("woff2");
 42  }
 43  
 44  @font-face {
 45      font-family: "AbyssFont";
 46      font-weight: 700;
 47      src: url("https://excel.lexploits.top/extra/tidal/LyricsBold.woff2") format("woff2");
 48  }
 49  
 50  [class^="followingButton"],
 51  [title="Unfollow"],
 52  [title="Follow"],
 53  [title="Unfollow"]>span,
 54  [title="Follow"]>span {
 55      background-color: var(--wave-color-solid-rainbow-yellow-fill) !important;
 56      color: var(--wave-color-solid-base-brighter);
 57  }
 58  
 59  [class^="_wave-badge-color-max"] {
 60      color: black !important;
 61      background-color: var(--wave-color-solid-accent-fill);
 62      border-radius: 3px;
 63  }
 64  
 65  [data-test="main-layout-sidebar-wrapper"] {
 66      border-right: rgb(25, 25, 25) 1px solid;
 67  }
 68  
 69  [class^="_wave-badge"] {
 70      background-color: var(--wave-color-solid-accent-fill);
 71      border-radius: 4px;
 72      color: black;
 73  }
 74  
 75  [class^="_progressBarWrapper"] {
 76      color: var(--wave-color-solid-accent-fill) !important;
 77  }
 78  
 79  [class^="_sidebarItem"]>span {
 80      color: var(--wave-color-solid-accent-dark);
 81  }
 82  
 83  [data-test="main-layout-header"] {
 84      border-left: 0 !important;
 85  }
 86  
 87  [class^="_sidebarItem"]:hover span {
 88      color: var(--wave-color-solid-contrast-fill);
 89  }
 90  
 91  [class^="_sidebarItem"] [class^="active"]>span {
 92      color: var(--wave-color-solid-accent-dark) !important;
 93  }
 94  
 95  [class^="_active"] {
 96      color: var(--wave-color-solid-accent-fill) !important;
 97  }
 98  
 99  [class^="ReactVirtualized__Grid"] {
100      border-radius: 10px;
101      margin: 5px;
102  }
103  
104  [data-test="media-table"]>div>div>div {
105      border: 1px solid rgb(25, 25, 25) !important;
106  }
107  
108  [class^="ReactVirtualized__Grid__innerScrollContainer"] {
109      border: none;
110      margin: 5px;
111  }
112  
113  [class^="button"]>span {
114      color: black;
115  }
116  
117  [class^="_explicitBadge"] {
118      color: var(--wave-color-solid-accent-fill);
119  }
120  
121  [class^="viewAllButton"] {
122      border-radius: 4px;
123      display: grid;
124      place-items: center;
125  }
126  
127  [data-test="current-media-imagery"] {
128      border: 0 !important;
129      margin: none;
130  }
131  
132  [class^="_imageBorder"] {
133      display: none;
134  }
135  
136  [class^="_headerButtons"]>button,
137  [class^="_headerButtons"]>button>span,
138  [data-test="toggle-picture-in-picture"] {
139      background-color: var(--wave-color-solid-accent-fill) !important;
140      color: black;
141  }
142  
143  [class^="_container"]>[class^="_navigationArrows"] {
144      color: black;
145      background-color: var(--wave-color-solid-accent-fill) !important;
146      border-radius: 4px;
147  }
148  
149  [class^="_buttons"]>button>span {
150      color: black !important;
151  }
152  
153  [class^="_container"]>button {
154      border: 0px none;
155  }
156  
157  
158  [data-test="feed-sidebar"] {
159      margin-top: 10px;
160  }
161  
162  [data-test="footer-player"] {
163      width: calc(100% - 20px);
164      bottom: 10px;
165      left: 10px;
166      border: 1px solid rgb(25, 25, 25);
167      border-radius: 4px !important;
168      position: absolute !important;
169  }
170  
171  [class^="_tooltipContainer"]>button {
172      background-color: var(--wave-color-solid-accent-fill);
173      color: black;
174  }
175  
176  [class^="_tooltipContainer"]>button:hover {
177      background-color: lightgray !important;
178  }
179  
180  [class^="_tableRow"]:hover>*,
181  [data-test-is-playing="true"]>* {
182      color: var(--wave-color-solid-accent-fill) !important;
183  }
184  
185  [class^="_tableRow"]>*,
186  [data-test-is-playing="false"]>* {
187      color: lightgray !important;
188  }
189  
190  [class*="coverColumn"] {
191      padding-left: 5px !important;
192  }
193  
194  [class^="actionList"] {
195      background-color: transparent;
196      margin: 0px;
197      border-radius: 5px;
198  }
199  
200  button[data-test="request-fullscreen"],
201  button[data-test="close-now-playing"],
202  button[data-test="play-all"],
203  button[data-test="shuffle-all"] {
204      color: black;
205      background-color: var(--wave-color-solid-accent-fill);
206      border-radius: 12px;
207  }
208  
209  button[data-test="request-fullscreen"]:hover,
210  button[data-test="close-now-playing"]:hover {
211      color: black;
212      background-color: lightgray !important;
213  }
214  
215  .neptune-switch-checkbox:checked+.neptune-switch {
216      background-color: rgba(255, 255, 255, 0.1);
217  }
218  
219  [data-test="navigation-arrows"]>button {
220      background-color: var(--wave-color-solid-accent-fill) !important;
221      color: black !important;
222      border-radius: 5px;
223  }
224  
225  [data-test="navigation-arrows"]>button:disabled {
226      background-color: lightgray !important;
227      opacity: 1;
228  }
229  
230  [data-test="main-layout-header"],
231  [data-test="feed-sidebar"],
232  [data-test="stream-metadata"],
233  [data-test="footer-player"] {
234      background-color: rgba(0, 0, 0, 0.8) !important;
235      backdrop-filter: blur(10px);
236      border: 1px solid var(--wave-color-opacity-contrast-fill-ultra-thin) !important;
237  }
238  
239  [data-wave-color=textUrl] {
240      color: var(--wave-color-solid-accent-fill);
241  }
242  
243  [class^="_smallHeader"] {
244      margin-top: 7.5px;
245  }
246  
247  [data-test="play-all"]>div>*,
248  [data-test="shuffle-all"]>div>*,
249  [data-test="play-all"],
250  [data-test="shuffle-all"] {
251      color: var(--wave-color-solid-accent-fill) !important;
252      background-color: transparent !important;
253  }
254  
255  [class^="__NEPTUNE_PAGE"],
256  [data-test="main"] {
257      margin-top: 35px;
258  }
259  
260  [data-test="button-desktop-release-notes"],
261  [data-test="button-release-notes"] {
262      background-color: white;
263  }
264  
265  [data-test="button-desktop-release-notes"]:hover,
266  [data-test="button-release-notes"]:hover {
267      background-color: lightgray !important;
268      transition: none !important;
269  }
270  
271  #playQueueSidebar {
272      top: 50px !important;
273      border: 1px solid var(--wave-color-opacity-contrast-fill-ultra-thin);
274      margin: 2px;
275      margin-right: -14px !important;
276      background-color: rgba(0, 0, 0, 0.8) !important;
277      backdrop-filter: blur(10px);
278  }
279  
280  [class^="_bottomGradient"] {
281      visibility: hidden;
282  }
283  
284  [data-test="settings-page"] {
285      padding-bottom: 60px !important;
286  }
287  
288  [data-test="query-suggestions"],
289  [data-test="recent-searches-container"] {
290      background-color: rgba(0, 0, 0, 0.6);
291      backdrop-filter: blur(10px);
292  }
293  
294  [data-test="contextmenu"] {
295      border: 1px solid var(--wave-color-opacity-contrast-fill-ultra-thin) !important;
296  }
297  
298  [class^="_dataContainer_"]::before {
299      background-image: var(--img);
300      filter: blur(10px) brightness(0.4);
301  }