@kerfjs/ui 5.0.0-beta.67 → 5.0.0-beta.68
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.
- package/ai/application-ui-profile-sync.cjs +20 -1
- package/ai/application-ui-profile.d.ts +4 -0
- package/ai/application-ui-profile.mjs +27 -0
- package/ai/application-ui-profile.schema.json +10 -0
- package/ai/component-composition.schema.json +1 -0
- package/ai/public-api-signatures-v1.md +1 -1
- package/ai/webawesome-jsx-signatures-v1.md +1 -1
- package/dist/styles/app-tab.css +12 -0
- package/dist/styles/token-search-field.css +9 -0
- package/dist/styles/webawesome.css +17 -0
- package/docs/accessibility.md +4 -0
- package/docs/apple-hig.md +1 -0
- package/docs/component-contract.md +7 -1
- package/docs/component-selection.md +3 -1
- package/docs/design/templates/toolbar/title-and-actions-dark.svg +1 -1
- package/docs/design/templates/toolbar/title-and-actions.svg +1 -1
- package/docs/design/templates/toolbar-dark.svg +1 -1
- package/docs/design/templates/toolbar.svg +1 -1
- package/docs/webawesome-theme.md +7 -0
- package/package.json +1 -1
|
@@ -28,7 +28,7 @@ function mergeApplicationUiProfiles(layers) {
|
|
|
28
28
|
catalogs.set(catalog.package, catalog);
|
|
29
29
|
provenance[`$catalogs.${catalog.package}`] = source;
|
|
30
30
|
}
|
|
31
|
-
for (const field of ['preferences', 'theme', 'tokens', 'layout'])
|
|
31
|
+
for (const field of ['preferences', 'theme', 'tokens', 'layout', 'wiring'])
|
|
32
32
|
if (
|
|
33
33
|
layer[field] &&
|
|
34
34
|
typeof layer[field] === 'object' &&
|
|
@@ -166,6 +166,7 @@ function validateApplicationUiProfile(profile, options = {}) {
|
|
|
166
166
|
'theme',
|
|
167
167
|
'tokens',
|
|
168
168
|
'layout',
|
|
169
|
+
'wiring',
|
|
169
170
|
'exceptions',
|
|
170
171
|
],
|
|
171
172
|
'$',
|
|
@@ -183,7 +184,25 @@ function validateApplicationUiProfile(profile, options = {}) {
|
|
|
183
184
|
const theme = objectAt(profile.theme, '$.theme');
|
|
184
185
|
const tokens = objectAt(profile.tokens, '$.tokens') ?? {};
|
|
185
186
|
const layout = objectAt(profile.layout, '$.layout');
|
|
187
|
+
const wiring = objectAt(profile.wiring, '$.wiring');
|
|
186
188
|
const exceptions = arrayAt(profile.exceptions, '$.exceptions');
|
|
189
|
+
rejectUnknown(wiring, ['entries'], '$.wiring');
|
|
190
|
+
if (wiring?.entries !== undefined) {
|
|
191
|
+
if (
|
|
192
|
+
!stringList(wiring.entries) ||
|
|
193
|
+
wiring.entries.some(
|
|
194
|
+
(entry) =>
|
|
195
|
+
isAbsolute(entry) ||
|
|
196
|
+
entry.split('/').includes('..') ||
|
|
197
|
+
/[*?]/.test(entry),
|
|
198
|
+
)
|
|
199
|
+
)
|
|
200
|
+
add(
|
|
201
|
+
'KUI-P030',
|
|
202
|
+
'$.wiring.entries',
|
|
203
|
+
'Wiring entries must be unique workspace-relative paths without traversal or wildcards.',
|
|
204
|
+
);
|
|
205
|
+
}
|
|
187
206
|
const packages = new Set();
|
|
188
207
|
for (const [index, catalog] of catalogs.entries()) {
|
|
189
208
|
const path = `$.catalogs[${index}]`;
|
|
@@ -39,6 +39,10 @@ export interface ApplicationUiProfile {
|
|
|
39
39
|
scrollOwnership?: 'one-per-pane' | 'application';
|
|
40
40
|
spacingScale?: 'kerf-five-step' | 'application';
|
|
41
41
|
};
|
|
42
|
+
wiring?: {
|
|
43
|
+
/** Static application entry modules, relative to the workspace root. */
|
|
44
|
+
entries?: string[];
|
|
45
|
+
};
|
|
42
46
|
exceptions?: Array<{
|
|
43
47
|
id: string;
|
|
44
48
|
rules: string[];
|
|
@@ -123,6 +123,14 @@ export function mergeApplicationUiProfiles(layers) {
|
|
|
123
123
|
profile.layout = { ...profile.layout, ...layer.layout };
|
|
124
124
|
recordProvenance(provenance, source, '$layout', layer.layout);
|
|
125
125
|
}
|
|
126
|
+
if (
|
|
127
|
+
layer.wiring &&
|
|
128
|
+
typeof layer.wiring === 'object' &&
|
|
129
|
+
!Array.isArray(layer.wiring)
|
|
130
|
+
) {
|
|
131
|
+
profile.wiring = { ...profile.wiring, ...layer.wiring };
|
|
132
|
+
recordProvenance(provenance, source, '$wiring', layer.wiring);
|
|
133
|
+
}
|
|
126
134
|
for (const exception of Array.isArray(layer.exceptions)
|
|
127
135
|
? layer.exceptions
|
|
128
136
|
: []) {
|
|
@@ -250,6 +258,7 @@ export function validateApplicationUiProfile(
|
|
|
250
258
|
'theme',
|
|
251
259
|
'tokens',
|
|
252
260
|
'layout',
|
|
261
|
+
'wiring',
|
|
253
262
|
'exceptions',
|
|
254
263
|
],
|
|
255
264
|
'$',
|
|
@@ -269,7 +278,25 @@ export function validateApplicationUiProfile(
|
|
|
269
278
|
const theme = objectAt(profile?.theme, '$.theme');
|
|
270
279
|
const tokens = objectAt(profile?.tokens, '$.tokens') ?? {};
|
|
271
280
|
const layout = objectAt(profile?.layout, '$.layout');
|
|
281
|
+
const wiring = objectAt(profile?.wiring, '$.wiring');
|
|
272
282
|
const exceptions = arrayAt(profile?.exceptions, '$.exceptions');
|
|
283
|
+
rejectUnknown(wiring, ['entries'], '$.wiring');
|
|
284
|
+
if (wiring?.entries !== undefined) {
|
|
285
|
+
if (
|
|
286
|
+
!stringList(wiring.entries) ||
|
|
287
|
+
wiring.entries.some(
|
|
288
|
+
(entry) =>
|
|
289
|
+
isAbsolute(entry) ||
|
|
290
|
+
entry.split('/').includes('..') ||
|
|
291
|
+
/[*?]/.test(entry),
|
|
292
|
+
)
|
|
293
|
+
)
|
|
294
|
+
add(
|
|
295
|
+
'KUI-P030',
|
|
296
|
+
'$.wiring.entries',
|
|
297
|
+
'Wiring entries must be unique workspace-relative paths without traversal or wildcards.',
|
|
298
|
+
);
|
|
299
|
+
}
|
|
273
300
|
|
|
274
301
|
const catalogPackages = new Set();
|
|
275
302
|
for (const [index, catalog] of catalogs.entries()) {
|
|
@@ -25,6 +25,16 @@
|
|
|
25
25
|
"additionalProperties": { "type": "string", "minLength": 1 }
|
|
26
26
|
},
|
|
27
27
|
"layout": { "$ref": "#/$defs/layout" },
|
|
28
|
+
"wiring": {
|
|
29
|
+
"type": "object",
|
|
30
|
+
"properties": {
|
|
31
|
+
"entries": {
|
|
32
|
+
"description": "Application entry modules, relative to the workspace root, where application-scoped wiring is installed.",
|
|
33
|
+
"$ref": "#/$defs/stringList"
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
"additionalProperties": false
|
|
37
|
+
},
|
|
28
38
|
"exceptions": {
|
|
29
39
|
"type": "array",
|
|
30
40
|
"items": { "$ref": "#/$defs/exception" }
|
|
@@ -214,6 +214,7 @@
|
|
|
214
214
|
"required": ["required", "helpers", "obligations"],
|
|
215
215
|
"properties": {
|
|
216
216
|
"required": { "type": "boolean" },
|
|
217
|
+
"scope": { "enum": ["application", "module"] },
|
|
217
218
|
"helpers": { "$ref": "#/$defs/stringList" },
|
|
218
219
|
"obligations": { "$ref": "#/$defs/stringList" },
|
|
219
220
|
"stateAttributes": {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Public API signatures for the UI authoring corpus
|
|
2
2
|
|
|
3
|
-
Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.
|
|
3
|
+
Generated from emitted declarations for `@kerfjs/ui@5.0.0-beta.68` and `kerfjs@5.0.0-beta.68`. This bounded reference covers only APIs used by the seven-task corpus. It is interface evidence, not an implementation or runtime guarantee.
|
|
4
4
|
|
|
5
5
|
## `@kerfjs/ui/css-values`
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Web Awesome JSX signatures for the UI authoring corpus
|
|
2
2
|
|
|
3
|
-
Generated from the emitted `@kerfjs/ui@5.0.0-beta.
|
|
3
|
+
Generated from the emitted `@kerfjs/ui@5.0.0-beta.68` declaration boundary. Import `@kerfjs/ui/webawesome` for type effects when authoring direct `wa-*` JSX. The module emits no runtime behavior and does not register custom elements.
|
|
4
4
|
|
|
5
5
|
```ts
|
|
6
6
|
import { KerfCustomElement } from 'kerfjs/jsx-runtime';
|
package/dist/styles/app-tab.css
CHANGED
|
@@ -38,6 +38,18 @@
|
|
|
38
38
|
var(--_kui-app-tab-pinned-default-background, var(--kui-color-surface))
|
|
39
39
|
);
|
|
40
40
|
}
|
|
41
|
+
.kui-app-tab[data-pinned="true"]::before {
|
|
42
|
+
content: "";
|
|
43
|
+
position: absolute;
|
|
44
|
+
z-index: -1;
|
|
45
|
+
inset-block: 0;
|
|
46
|
+
inset-inline-start: calc(-1 * var(--kui-tab-bar-strip-padding, 1px));
|
|
47
|
+
inset-inline-end: 0;
|
|
48
|
+
background: var(
|
|
49
|
+
--kui-app-tab-pinned-background,
|
|
50
|
+
var(--_kui-app-tab-pinned-default-background, var(--kui-color-surface))
|
|
51
|
+
);
|
|
52
|
+
}
|
|
41
53
|
.kui-tab-bar[data-presentation="segmented"] .kui-app-tab[data-pinned="true"],
|
|
42
54
|
.kui-tab-bar[data-presentation="inspector"] .kui-app-tab[data-pinned="true"] {
|
|
43
55
|
--_kui-app-tab-pinned-default-background: var(
|
|
@@ -98,6 +98,15 @@
|
|
|
98
98
|
cursor: text;
|
|
99
99
|
}
|
|
100
100
|
|
|
101
|
+
/* iOS can magnify a small editor on focus and leave the page magnified after
|
|
102
|
+
blur. Keep the desktop small-text rhythm, but give touch editors legible text
|
|
103
|
+
without restricting the user's own page zoom. */
|
|
104
|
+
@media (hover: none) and (pointer: coarse) {
|
|
105
|
+
.kui-token-search__editor {
|
|
106
|
+
font-size: max(16px, var(--kui-font-s));
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
|
|
101
110
|
.kui-token-search__editor:empty::before {
|
|
102
111
|
color: var(--kui-color-text-quiet);
|
|
103
112
|
content: attr(data-placeholder);
|
|
@@ -591,6 +591,23 @@
|
|
|
591
591
|
}
|
|
592
592
|
}
|
|
593
593
|
|
|
594
|
+
/* Small Web Awesome fields have 14px hosts by default. Raise only the editable
|
|
595
|
+
shadow part on touch devices so focusing them need not magnify the page;
|
|
596
|
+
their compact chrome and desktop typography keep their normal sizes. */
|
|
597
|
+
@media (hover: none) and (pointer: coarse) {
|
|
598
|
+
@layer wa-theme-overrides {
|
|
599
|
+
:is(wa-input, wa-number-input, wa-time-input):is(
|
|
600
|
+
[size="xs"],
|
|
601
|
+
[size="s"],
|
|
602
|
+
[size="small"]
|
|
603
|
+
)::part(input),
|
|
604
|
+
wa-textarea:is([size="xs"], [size="s"], [size="small"])::part(textarea),
|
|
605
|
+
wa-select:is([size="xs"], [size="s"], [size="small"])::part(display-input) {
|
|
606
|
+
font-size: max(16px, var(--wa-font-size-m, 16px));
|
|
607
|
+
}
|
|
608
|
+
}
|
|
609
|
+
}
|
|
610
|
+
|
|
594
611
|
@media (prefers-contrast: more) {
|
|
595
612
|
@layer wa-theme-overrides {
|
|
596
613
|
:where(:root),
|
package/docs/accessibility.md
CHANGED
|
@@ -444,6 +444,10 @@ there as the editor wraps. In `collapsible` mode, the closed state is one named
|
|
|
444
444
|
iconic search button and the open state is the same named searchbox, whether
|
|
445
445
|
the field stands alone or is composed inside `ToolbarControlGroup`.
|
|
446
446
|
|
|
447
|
+
On coarse touch devices, the editor's computed text size has a 16px floor. This
|
|
448
|
+
avoids iOS focus magnification of the small-text editor while preserving the
|
|
449
|
+
user's ability to pinch zoom; other field chrome and desktop density are unchanged.
|
|
450
|
+
|
|
447
451
|
For an app-driven query replacement with an unmanaged field, change its
|
|
448
452
|
`revision` along with `query` so the editor text rebuilds. For a model-managed
|
|
449
453
|
field, call `model.replace({ query, tokens })`: it parses the supplied state and
|
package/docs/apple-hig.md
CHANGED
|
@@ -7,6 +7,7 @@ Native Apple applications should use native platform controls and follow the Hum
|
|
|
7
7
|
- Accessibility is behavior: every workflow is keyboard-operable; focus is visible; DOM and reading order agree; controls have accessible names; decorative icons are hidden.
|
|
8
8
|
- Use adaptive semantic colors. Every custom role needs usable light, dark, and increased-contrast behavior. Never rely on color alone.
|
|
9
9
|
- Use the system UI font stack and allow browser zoom through 200%. Avoid thin weights and hard minimums that clip enlarged text.
|
|
10
|
+
- On iOS, prevent unwanted focus magnification by keeping editable text legible at touch widths. Do not force the page scale back on blur: that would also undo a person's deliberate pinch zoom.
|
|
10
11
|
- Group with space and alignment before adding borders. Keep essential content in the leading reading path and secondary detail in progressive disclosure.
|
|
11
12
|
- Use one icon family and one metaphor per action. Directional icons may mirror in RTL; checkmarks, logos, and real-world objects do not.
|
|
12
13
|
- Motion is brief, causal, and optional. Honor reduced-motion and reduced-transparency preferences; repeating indicators stop moving under reduced motion.
|
|
@@ -154,7 +154,7 @@ check in `.kerf-ui-profile.json` conforming to
|
|
|
154
154
|
[`application-ui-profile.schema.json`](../ai/application-ui-profile.schema.json).
|
|
155
155
|
Keep package-qualified catalog locations and recurring-concept preferences,
|
|
156
156
|
allowed color schemes and density, public semantic-token overrides,
|
|
157
|
-
layout/responsive conventions, and narrow rule exceptions there. Product
|
|
157
|
+
layout/responsive conventions, application wiring entry paths, and narrow rule exceptions there. Product
|
|
158
158
|
records, copy, permissions, user preferences, and transport state do not belong
|
|
159
159
|
in this policy file.
|
|
160
160
|
|
|
@@ -175,6 +175,12 @@ Discovery and precedence are deterministic:
|
|
|
175
175
|
Later scalar and object-map values win. Catalogs merge by package; preferences
|
|
176
176
|
and token overrides merge by key; exceptions merge by stable id. Lists such as
|
|
177
177
|
allowed themes/densities replace the earlier list rather than accumulating.
|
|
178
|
+
`wiring.entries` similarly names workspace-relative application entry modules;
|
|
179
|
+
later profile layers replace the entry list. The `ui-wiring` ESLint rule checks
|
|
180
|
+
application-scoped helper calls and registration imports once at each entry
|
|
181
|
+
that reaches a rendering module, while a composition entry with
|
|
182
|
+
`wiring.scope: "module"` keeps a local obligation. See the
|
|
183
|
+
[`ui-wiring` rule](../../eslint-plugin/docs/rules/ui-wiring.md).
|
|
178
184
|
Every resolved field retains its source file. The shipped
|
|
179
185
|
`application-ui-profile.mjs` API implements discovery, merge, loading, and
|
|
180
186
|
validation and reports actionable originating file + JSON-path diagnostics for stale
|
|
@@ -271,7 +271,9 @@ its internal classes. `--kui-tab-bar-trailing-flex` controls the trailing zone.
|
|
|
271
271
|
Set `pinned` on the first `AppTab` when that tab must remain visible as peers
|
|
272
272
|
scroll. It stays inside the tablist and keyboard order. Set the public
|
|
273
273
|
`--kui-app-tab-pinned-background` token if the surrounding surface differs from
|
|
274
|
-
the default; the pinned tab must cover peers as they scroll beneath it.
|
|
274
|
+
the default; the pinned tab must cover peers as they scroll beneath it. Its
|
|
275
|
+
background also covers the strip's inline padding so scrolled labels cannot
|
|
276
|
+
paint beside the pinned edge, including in right-to-left strips. Call
|
|
275
277
|
`wireTabBars` for keyboard selection and reorder behavior and its WebKit RTL
|
|
276
278
|
scroll correction.
|
|
277
279
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="cp0"><rect x="
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="cp0"><rect x="24" y="24" width="460" height="52"/></clipPath><clipPath id="ov1"><rect x="24" y="24" width="460" height="52" rx="0"/></clipPath><clipPath id="cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="cp4"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="ct5"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#cp0)"/><g clip-path="url(#ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp2)"><g clip-path="url(#ov3)"><g clip-path="url(#cp4)"><g clip-path="url(#ct5)"><text x="38" y="55.41" font-family=""ui-sans-serif", "-apple-system", "system-ui", "Segoe UI", sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar</text></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp6)"><g color="rgb(174, 174, 178)"><clipPath id="svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp8)"><g color="rgb(174, 174, 178)"><clipPath id="svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp10)"><g color="rgb(174, 174, 178)"><clipPath id="svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="cp0"><rect x="
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 104" width="640" height="104"><defs><clipPath id="cp0"><rect x="24" y="24" width="460" height="52"/></clipPath><clipPath id="ov1"><rect x="24" y="24" width="460" height="52" rx="0"/></clipPath><clipPath id="cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="cp4"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="ct5"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#cp0)"/><g clip-path="url(#ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp2)"><g clip-path="url(#ov3)"><g clip-path="url(#cp4)"><g clip-path="url(#ct5)"><text x="38" y="55.41" font-family=""ui-sans-serif", "-apple-system", "system-ui", "Segoe UI", sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar</text></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp6)"><g color="rgb(110, 110, 115)"><clipPath id="svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp8)"><g color="rgb(110, 110, 115)"><clipPath id="svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#cp10)"><g color="rgb(110, 110, 115)"><clipPath id="svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, "-apple-system", sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(28,28,30)"/><text x="16" y="28" font-family="system-ui, "-apple-system", sans-serif" font-size="12" font-weight="600" fill="rgb(174,174,178)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="24" y="24" width="460" height="52"/></clipPath><clipPath id="svgimg3ov1"><rect x="24" y="24" width="460" height="52" rx="0"/></clipPath><clipPath id="svgimg3cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="svgimg3ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="svgimg3cp4"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="svgimg3ct5"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="svgimg3cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"/><g clip-path="url(#svgimg3ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp2)"><g clip-path="url(#svgimg3ov3)"><g clip-path="url(#svgimg3cp4)"><g clip-path="url(#svgimg3ct5)"><text x="38" y="55.41" font-family=""ui-sans-serif", "-apple-system", "system-ui", "Segoe UI", sans-serif" font-size="16" font-weight="650" fill="rgb(174,174,178)">Northstar</text></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(58,58,60)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(72,72,74)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp6)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp8)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp10)"><g color="rgb(174, 174, 178)"><clipPath id="svgimg3svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(174, 174, 178)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, "-apple-system", sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 672 158" width="672" height="158"><defs><clipPath id="cp0"><rect x="16" y="38" width="640" height="104"/></clipPath><clipPath id="ct1"><rect x="16" y="16" width="640" height="22"/></clipPath><clipPath id="irc2"><rect x="16" y="38" width="640" height="104" rx="0"/></clipPath></defs><rect x="0" y="0" width="672" height="158" rx="0" fill="rgb(255,255,255)"/><text x="16" y="28" font-family="system-ui, "-apple-system", sans-serif" font-size="12" font-weight="600" fill="rgb(110,110,115)">Title with a trailing group</text><g clip-path="url(#cp0)"><g clip-path="url(#irc2)"><clipPath id="svgimg3vclip"><rect x="16" y="38" width="640" height="104"/></clipPath><g clip-path="url(#svgimg3vclip)"><g transform="translate(16 38)"><defs><clipPath id="svgimg3cp0"><rect x="24" y="24" width="460" height="52"/></clipPath><clipPath id="svgimg3ov1"><rect x="24" y="24" width="460" height="52" rx="0"/></clipPath><clipPath id="svgimg3cp2"><rect x="30" y="30" width="88.1" height="40"/></clipPath><clipPath id="svgimg3ov3"><rect x="30" y="30" width="88.1" height="40" rx="0"/></clipPath><clipPath id="svgimg3cp4"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="svgimg3ct5"><rect x="38" y="40.4" width="72.1" height="19.2"/></clipPath><clipPath id="svgimg3cp6"><rect x="502" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp8"><rect x="542" y="42" width="16" height="16"/></clipPath><clipPath id="svgimg3cp10"><rect x="582" y="42" width="16" height="16"/></clipPath></defs><g clip-path="url(#svgimg3cp0)"/><g clip-path="url(#svgimg3ov1)"><rect x="28.5" y="28.5" width="91" height="43" rx="21.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp2)"><g clip-path="url(#svgimg3ov3)"><g clip-path="url(#svgimg3cp4)"><g clip-path="url(#svgimg3ct5)"><text x="38" y="55.41" font-family=""ui-sans-serif", "-apple-system", "system-ui", "Segoe UI", sans-serif" font-size="16" font-weight="650" fill="rgb(110,110,115)">Northstar</text></g></g></g></g></g><rect x="488" y="28" width="124" height="44" rx="22" fill="rgb(229,229,234)"/><rect x="488.5" y="28.5" width="123" height="43" rx="21.5" fill="none" stroke="rgb(209,209,214)" stroke-width="1"/><rect x="490.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp6)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic7"><rect x="502" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic7)"><g transform="translate(502 42)scale(.66667)"><path d="M3 5z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 12z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M3 19z" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 5h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 12h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M8 19h13" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="530.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp8)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic9"><rect x="542" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic9)"><g transform="translate(542 42)scale(.66667)"><rect width="18" height="18" x="3" y="3" rx="2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M9 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><path d="M15 3v18" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g><rect x="570.5" y="30.5" width="39" height="39" rx="19.5" fill="none" stroke="rgba(0,0,0,0)" stroke-width="1"/><g clip-path="url(#svgimg3cp10)"><g color="rgb(110, 110, 115)"><clipPath id="svgimg3svgic11"><rect x="582" y="42" width="16" height="16"/></clipPath><g clip-path="url(#svgimg3svgic11)"><g transform="translate(582 42)scale(.66667)"><path d="M9.7 4.1a2.3 2.3 0 0 1 4.6 0 2.3 2.3 0 0 0 3.3 2 2.3 2.3 0 0 1 2.4 4 2.3 2.3 0 0 0 0 3.8 2.3 2.3 0 0 1-2.4 4 2.3 2.3 0 0 0-3.3 2 2.3 2.3 0 0 1-4.6 0 2.3 2.3 0 0 0-3.3-2A2.3 2.3 0 0 1 4 14a2.3 2.3 0 0 0 0-3.8 2.3 2.3 0 0 1 2.3-4 2.3 2.3 0 0 0 3.4-2" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/><circle cx="12" cy="12" r="3" style="marker:none;vector-effect:none;color-interpolation:srgb" fill="none" stroke="rgb(110, 110, 115)" stroke-width="2px" stroke-dasharray="none" stroke-linecap="round" stroke-linejoin="round" stroke-opacity="1" fill-opacity="1" opacity="1"/></g></g></g></g></g></g></g></g></svg>
|
package/docs/webawesome-theme.md
CHANGED
|
@@ -86,6 +86,13 @@ exposes `label` instead of `form-control-label`; the theme gives it the same
|
|
|
86
86
|
uppercase 12px/650 treatment. Inline control labels (Checkbox, Switch) keep
|
|
87
87
|
their natural sentence case.
|
|
88
88
|
|
|
89
|
+
On coarse touch devices, the editable part of small and extra-small Web Awesome
|
|
90
|
+
Input, Number Input, Time Input, Textarea, and Select has a 16px minimum text
|
|
91
|
+
size. Small field chrome keeps its compact height and desktop typography stays
|
|
92
|
+
small. This prevents Safari from magnifying the page just to focus text; it does
|
|
93
|
+
not constrain a user's own pinch zoom. App-owned native fields need the same
|
|
94
|
+
editable-text audit.
|
|
95
|
+
|
|
89
96
|
Known Date's field captions and bordered text-like field hints use the same 9px
|
|
90
97
|
inline inset, keeping secondary text aligned with the value rather than the
|
|
91
98
|
field's outer border. This covers Input, Known Date, Number Input, OTP Input,
|