forked from
tokono.ma/diffuse
A music player that connects to your cloud/distributed storage.
chore: more blur theme improvements
+32
-13
src/fonts/SourceSans3VF-Italic.otf.woff2
src/fonts/SourceSans3VF-Italic.otf.woff2
This is a binary file and will not be displayed.
src/fonts/SourceSans3VF-Upright.otf.woff2
src/fonts/SourceSans3VF-Upright.otf.woff2
This is a binary file and will not be displayed.
+3
-1
src/themes/blur/artwork-controller/facet/index.html
+3
-1
src/themes/blur/artwork-controller/facet/index.html
···
5
5
@import "./themes/blur/font-faces.css";
6
6
7
7
db-artwork-controller {
8
-
font-family: "Public Sans", "Intervariable", sans-serif;
8
+
font-family: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
9
+
font-feature-settings: normal;
10
+
font-optical-sizing: auto;
9
11
}
10
12
</style>
11
13
+19
-6
src/themes/blur/browser/element.css
+19
-6
src/themes/blur/browser/element.css
···
67
67
.playlist-btn {
68
68
align-items: center;
69
69
background: transparent;
70
-
border: 1px solid color-mix(in oklch, currentColor 12%, transparent);
70
+
border: 1px solid color-mix(in oklch, currentColor 6%, transparent);
71
71
border-radius: var(--radius-md);
72
72
color: inherit;
73
73
cursor: pointer;
···
78
78
margin-left: var(--space-2xs);
79
79
max-width: 12rem;
80
80
overflow: hidden;
81
-
padding: var(--space-3xs) var(--space-2xs);
81
+
padding: var(--space-3xs) var(--space-2xs) calc(var(--space-3xs) - 1px);
82
+
text-box: trim-both cap alphabetic;
82
83
text-overflow: ellipsis;
83
84
white-space: nowrap;
84
85
}
···
108
109
109
110
.table-header {
110
111
border-bottom: 1px solid color-mix(in oklch, currentColor 12%, transparent);
111
-
color: color-mix(in oklch, currentColor 50%, transparent);
112
+
color: color-mix(in oklch, currentColor 40%, transparent);
112
113
display: flex;
113
114
font-size: 75%;
114
115
font-weight: 500;
115
116
letter-spacing: var(--tracking-wider);
117
+
line-height: 1;
116
118
padding: 0 var(--space-xs);
119
+
text-box: trim-both cap alphabetic;
117
120
text-transform: uppercase;
118
121
user-select: none;
119
122
}
120
123
121
124
.table-header > div {
122
125
align-items: center;
126
+
border-left: 1px solid color-mix(in oklch, currentColor 12%, transparent);
123
127
cursor: pointer;
124
128
display: flex;
125
129
gap: var(--space-3xs);
126
-
padding: var(--space-3xs) var(--space-2xs) var(--space-3xs) 0;
130
+
margin-right: var(--space-2xs);
131
+
padding: calc(var(--space-3xs) + 1px) 0 var(--space-3xs) var(--space-2xs);
132
+
position: relative;
133
+
134
+
& > i {
135
+
position: absolute;
136
+
right: 0;
137
+
}
127
138
}
128
139
129
140
.table-header > div:hover {
···
135
146
}
136
147
137
148
.table-header .col-fav {
149
+
border-left: none;
138
150
cursor: default;
151
+
margin-right: 0;
139
152
}
140
153
141
154
/***********************************
···
144
157
145
158
.col-fav {
146
159
flex-shrink: 0;
147
-
width: var(--space-lg);
160
+
width: var(--space-md);
148
161
}
149
162
150
163
.col-title {
···
237
250
.track-row .col-title,
238
251
.track-row .col-artist,
239
252
.track-row .col-album {
240
-
padding-right: var(--space-sm);
253
+
padding-left: var(--space-2xs);
241
254
}
242
255
243
256
.track-row span {
+3
-1
src/themes/blur/browser/facet/index.html
+3
-1
src/themes/blur/browser/facet/index.html
···
7
7
@import "./themes/blur/font-faces.css";
8
8
9
9
db-browser {
10
-
font-family: "Public Sans", "Intervariable", sans-serif;
10
+
font-family: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
11
+
font-feature-settings: normal;
12
+
font-optical-sizing: auto;
11
13
height: 100vh;
12
14
}
13
15
</style>
+3
-1
src/themes/blur/facet/index.html
+3
-1
src/themes/blur/facet/index.html
···
13
13
main,
14
14
db-artwork-controller,
15
15
db-browser {
16
-
font-family: "Public Sans", "Intervariable", sans-serif;
16
+
font-family: "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
17
+
font-feature-settings: normal;
18
+
font-optical-sizing: auto;
17
19
}
18
20
19
21
@media (orientation: landscape) and (width < 63rem) {
+4
-4
src/themes/blur/font-faces.css
+4
-4
src/themes/blur/font-faces.css
···
1
1
@font-face {
2
2
font-display: swap;
3
-
font-family: "Public Sans";
3
+
font-family: "Source Sans 3";
4
4
font-style: normal;
5
5
font-weight: 100 900;
6
-
src: url("../../fonts/PublicSans[wght].woff2") format("woff2");
6
+
src: url("../../fonts/SourceSans3VF-Upright.otf.woff2") format("woff2");
7
7
}
8
8
9
9
@font-face {
10
10
font-display: swap;
11
-
font-family: "Public Sans";
11
+
font-family: "Source Sans 3";
12
12
font-style: italic;
13
13
font-weight: 100 900;
14
-
src: url("../../fonts/PublicSans-Italic[wght].woff2") format("woff2");
14
+
src: url("../../fonts/SourceSans3VF-Italic.otf.woff2") format("woff2");
15
15
}