@skipleague/design 0.7.0 → 0.7.1

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.
@@ -57,6 +57,10 @@ export function ProfileMenu({ user, currentSlug, apps = SKIPLEAGUE_APPS, enabled
57
57
  display: "inline-flex",
58
58
  alignItems: "center",
59
59
  justifyContent: "center",
60
+ // Explicit padding:0 — a host app's global `button { padding }` would
61
+ // otherwise collapse this fixed 38×38 box's content area (border-box)
62
+ // and shrink the icon to a dot.
63
+ padding: 0,
60
64
  width: 38,
61
65
  height: 38,
62
66
  borderRadius: "var(--skl-radius-control)",
package/dist/TopBar.js CHANGED
@@ -82,6 +82,9 @@ export function TopBarIconButton({ tone = "dark", compact = false, style, childr
82
82
  justifyContent: "center",
83
83
  cursor: "pointer",
84
84
  flex: "0 0 auto",
85
+ // Explicit padding:0 so a host app's global `button { padding }` can't
86
+ // collapse this fixed-size box (border-box) and shrink the icon.
87
+ padding: 0,
85
88
  background: palette.background,
86
89
  border: `1px solid ${palette.border}`,
87
90
  color: palette.color,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@skipleague/design",
3
- "version": "0.7.0",
3
+ "version": "0.7.1",
4
4
  "description": "SkipUI — the SkipLeague design system: shared tokens and React components for every SkipLeague app.",
5
5
  "type": "module",
6
6
  "repository": {
@@ -161,6 +161,10 @@ export function ProfileMenu({
161
161
  display: "inline-flex",
162
162
  alignItems: "center",
163
163
  justifyContent: "center",
164
+ // Explicit padding:0 — a host app's global `button { padding }` would
165
+ // otherwise collapse this fixed 38×38 box's content area (border-box)
166
+ // and shrink the icon to a dot.
167
+ padding: 0,
164
168
  width: 38,
165
169
  height: 38,
166
170
  borderRadius: "var(--skl-radius-control)",
package/src/TopBar.tsx CHANGED
@@ -168,6 +168,9 @@ export function TopBarIconButton({
168
168
  justifyContent: "center",
169
169
  cursor: "pointer",
170
170
  flex: "0 0 auto",
171
+ // Explicit padding:0 so a host app's global `button { padding }` can't
172
+ // collapse this fixed-size box (border-box) and shrink the icon.
173
+ padding: 0,
171
174
  background: palette.background,
172
175
  border: `1px solid ${palette.border}`,
173
176
  color: palette.color,