@hearthsound/design 0.2.9 → 0.2.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -6,16 +6,22 @@
6
6
  * name and the glyph says what it is. Items that are not in the library carry
7
7
  * no mark at all.
8
8
  *
9
- * Two placements: inline in a track row's status cell, and as a badge on the
10
- * bottom-left of an album card's cover.
9
+ * Two placements: beside a track row's title, where it is small and muted so it
10
+ * reads as a detail of the title rather than as a column of its own, and as a
11
+ * badge on the bottom-left of an album card's cover.
11
12
  */
12
13
 
13
14
  .hs-library-mark {
14
- --hs-icon-size: 16px;
15
15
  display: inline-flex;
16
+ flex: none;
16
17
  align-items: center;
17
- justify-content: center;
18
- color: var(--hs-accent-text);
18
+ color: var(--hs-fg-muted);
19
+ }
20
+
21
+ /* `.hs-icon` declares its own size on the element, so the mark's size is set
22
+ * there too rather than inherited from the wrapper. */
23
+ .hs-library-mark .hs-icon {
24
+ --hs-icon-size: 11px;
19
25
  }
20
26
 
21
27
  /* Sits above the cover art and its play disc, and takes no pointer events: the
@@ -144,6 +144,19 @@
144
144
  min-width: 0;
145
145
  }
146
146
 
147
+ /* The title and the library mark share one line: the title keeps the ellipsis
148
+ * and the mark stays visible beside it at every width. */
149
+ .hs-track-row__title-line {
150
+ display: flex;
151
+ align-items: center;
152
+ gap: 4px;
153
+ min-width: 0;
154
+ }
155
+
156
+ .hs-track-row__title-line .hs-track-row__title {
157
+ min-width: 0;
158
+ }
159
+
147
160
  .hs-track-row__title,
148
161
  .hs-track-row__artist,
149
162
  .hs-track-row__album {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hearthsound/design",
3
- "version": "0.2.9",
3
+ "version": "0.2.10",
4
4
  "license": "MIT",
5
5
  "description": "Design language of Hearthsound: tokens, fonts, icons and component styles",
6
6
  "repository": {