@smwb/ui-styles 2.10.0 → 2.10.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.
|
@@ -4,14 +4,23 @@
|
|
|
4
4
|
color: var(--smui-tooltipTextColor);
|
|
5
5
|
z-index: @tooltipZ;
|
|
6
6
|
font-size: 12px;
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
line-height: @tooltipLineHeight;
|
|
8
|
+
padding: @tooltipPaddingY @tooltipPaddingX;
|
|
9
|
+
// A one-line tip is this tall (line + padding) and a longer one grows with its content. A fixed
|
|
10
|
+
// `height` with `overflow: hidden` showed the first line of a tip made of several and cut the rest.
|
|
11
|
+
min-height: @tooltipMinHeight;
|
|
12
|
+
box-sizing: border-box;
|
|
9
13
|
display: inline-flex;
|
|
10
14
|
align-items: center;
|
|
11
15
|
justify-content: center;
|
|
12
|
-
overflow: hidden;
|
|
13
|
-
white-space: nowrap;
|
|
14
16
|
min-width: 50px;
|
|
17
|
+
// As wide as its text, up to the window (less the 8px the placement keeps free on each side), and then
|
|
18
|
+
// the text wraps, a long path with no space in it too. `nowrap` ran a long tip off a narrow window
|
|
19
|
+
// and widened the page; `max-content` keeps a tip placed near the edge from wrapping early.
|
|
20
|
+
width: max-content;
|
|
21
|
+
max-width: calc(100vw - @tooltipViewportGap);
|
|
22
|
+
white-space: normal;
|
|
23
|
+
overflow-wrap: anywhere;
|
|
15
24
|
// The component mounts the tooltip only while it shows — on hover, on click,
|
|
16
25
|
// or while `open` — so it is visible whenever it is in the DOM. (It used to be
|
|
17
26
|
// shown by :hover alone, which hid click and manual tooltips.)
|
|
@@ -369,6 +369,12 @@
|
|
|
369
369
|
@toggleCompactMaxHeight: 28px;
|
|
370
370
|
|
|
371
371
|
@tooltipPaddingX: @smui-space-sm;
|
|
372
|
+
@tooltipPaddingY: @smui-space-xs;
|
|
373
|
+
// Line + vertical padding = the min height, so a one-line tip is 24px.
|
|
374
|
+
@tooltipLineHeight: 16px; // off-grid
|
|
375
|
+
@tooltipMinHeight: @smui-space-6;
|
|
376
|
+
// Free space kept at the window's two sides (the placement shifts a tip 8px in): twice @smui-space-sm.
|
|
377
|
+
@tooltipViewportGap: (@smui-space-sm * 2);
|
|
372
378
|
|
|
373
379
|
@treeViewIndent: 30px; // off-grid
|
|
374
380
|
@treeViewItemGap: 10px; // off-grid
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smwb/ui-styles",
|
|
3
|
-
"version": "2.10.
|
|
3
|
+
"version": "2.10.1",
|
|
4
4
|
"description": "Framework-agnostic LESS design tokens and component styles (smwb-*) shared by the @smwb UI libraries. Prebuilt aggregate CSS lives in @smwb/ui-css.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"sideEffects": [
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"./package.json": "./package.json"
|
|
20
20
|
},
|
|
21
21
|
"scripts": {
|
|
22
|
-
"lint": "node scripts/check-aggregate.mjs && node scripts/check-tokens.mjs && node scripts/check-control-heights.mjs && node scripts/check-typography-case.mjs && node scripts/check-overlay-layers.mjs && node scripts/check-chart-series.mjs && node scripts/check-normalize-specificity.mjs"
|
|
22
|
+
"lint": "node scripts/check-aggregate.mjs && node scripts/check-tokens.mjs && node scripts/check-control-heights.mjs && node scripts/check-typography-case.mjs && node scripts/check-overlay-layers.mjs && node scripts/check-tooltip-grows.mjs && node scripts/check-chart-series.mjs && node scripts/check-normalize-specificity.mjs"
|
|
23
23
|
},
|
|
24
24
|
"homepage": "https://sourcecraft.dev/elfenmail/ui",
|
|
25
25
|
"repository": {
|