A decentralized music tracking and discovery platform built on AT Protocol 馃幍
rocksky.app
spotify
atproto
lastfm
musicbrainz
scrobbling
listenbrainz
1@tailwind utilities;
2
3@font-face {
4 font-family: "RockfordSansLight";
5 src:
6 local("RockfordSansLight"),
7 url(./assets/fonts/RockfordSans-Light.otf) format("opentype");
8}
9
10@font-face {
11 font-family: "RockfordSansRegular";
12 src:
13 local("RockfordSans"),
14 url(./assets/fonts/RockfordSans-Regular.otf) format("opentype");
15}
16
17@font-face {
18 font-family: "RockfordSansMedium";
19 src:
20 local("RockfordSans"),
21 url(./assets/fonts/RockfordSans-Medium.otf) format("opentype");
22}
23
24@font-face {
25 font-family: "RockfordSansBold";
26 font-weight: 900;
27 src:
28 local("RockfordSans"),
29 url(./assets/fonts/RockfordSans-Bold.otf) format("opentype");
30}
31
32@font-face {
33 font-family: "RockfordSansExtraBold";
34 font-weight: 900;
35 src:
36 local("RockfordSans"),
37 url(./assets/fonts/RockfordSans-ExtraBold.otf) format("opentype");
38}
39
40@font-face {
41 font-family: "UberMove";
42 src:
43 local("RockfordSans"),
44 url(./assets/fonts/RockfordSans-Light.otf) format("opentype");
45}
46
47@font-face {
48 font-family: "UberMoveText";
49 src:
50 local("RockfordSans"),
51 url(./assets/fonts/RockfordSans-Regular.otf) format("opentype");
52}
53
54body {
55 margin: 0;
56 font-family:
57 RockfordSansLight, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto",
58 "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
59 sans-serif;
60 -webkit-font-smoothing: antialiased;
61 -moz-osx-font-smoothing: grayscale;
62 overflow-y: hidden;
63}
64
65:root {
66 --color-background: #ffffff;
67 --color-text: #000000;
68 --color-primary: #ff2876;
69 --color-text-muted: #42576ca6;
70 --color-border: #ffffff;
71 --color-input-background: #f3f3f3;
72 --color-placeholder: #3b3b3bb4;
73 --color-clear-input: #000000;
74 --color-menu-hover: #f7f7f7;
75 --color-default-button: rgba(0, 0, 0, 0.05);
76 --color-purple: oklch(0.5478 0.201 296.07);
77 --color-blue: oklch(0.789 0.154 211.53);
78 --color-pink: oklch(0.6372 0.229 346.83);
79 --color-bar: rgba(255, 40, 118, 0.1);
80 --color-play-button: #f4f4f4;
81 --color-toggle-track: #c7b2e9;
82 --color-button-text: #fff;
83 --color-skeleton-background: #f3f3f3;
84 --color-skeleton-foreground: #ecebeb;
85}
86
87.dark {
88 --color-background: #130825;
89 --color-text: oklch(95.07% 0.028 338.58);
90 --color-primary: #ff2876;
91 --color-text-muted: rgb(191 174 195 / 65%);
92 --color-border: #310e64;
93 --color-input-background: #221538;
94 --color-placeholder: #ffffffb4;
95 --color-clear-input: #ffffff;
96 --color-menu-hover: #1f0d3c;
97 --color-default-button: rgba(255, 255, 255, 0.05);
98 --color-purple: oklch(0.5478 0.201 296.07);
99 --color-blue: oklch(0.789 0.154 211.53);
100 --color-pink: oklch(0.6372 0.229 346.83);
101 --color-bar: rgb(255, 129, 175);
102 --color-play-button: var(--color-primary);
103 --color-toggle-track: #341b5c;
104 --color-button-text: #000;
105 --color-skeleton-background: #221538;
106 --color-skeleton-foreground: #2b1a4c;
107}
108
109::placeholder {
110 color: var(--color-text-muted) !important;
111}
112
113td > div {
114 color: var(--color-text-muted) !important;
115}
116
117* {
118 transition:
119 background-color 0.1s ease,
120 color 0.1s ease;
121}