@dillingerstaffing/strand-svelte 0.17.1 → 0.17.3
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/dist/css/strand-ui.css +21 -7
- package/package.json +2 -2
package/dist/css/strand-ui.css
CHANGED
|
@@ -4047,11 +4047,20 @@ body.strand-banner-active .strand-instrument-viewport--full-bleed {
|
|
|
4047
4047
|
font-family: var(--strand-font-sans);
|
|
4048
4048
|
}
|
|
4049
4049
|
|
|
4050
|
-
/* ── Inner layout ──
|
|
4050
|
+
/* ── Inner layout ──
|
|
4051
|
+
min-height: inherit picks up the nav's own min-height (the
|
|
4052
|
+
--strand-nav-height token). On mobile the nav switches to
|
|
4053
|
+
height: auto + min-height: var(--strand-nav-height); without this
|
|
4054
|
+
inherit the inner only takes its content height (~40px from the
|
|
4055
|
+
hamburger), and the nav's extra ~24px appears as empty space below,
|
|
4056
|
+
which reads as "logo squished upward". With min-height: inherit the
|
|
4057
|
+
inner is always at least token-tall and align-items: center
|
|
4058
|
+
distributes content vertically through that full height. */
|
|
4051
4059
|
.strand-nav__inner {
|
|
4052
4060
|
display: flex;
|
|
4053
4061
|
align-items: center;
|
|
4054
4062
|
height: 100%;
|
|
4063
|
+
min-height: inherit;
|
|
4055
4064
|
padding: 0 var(--strand-space-6);
|
|
4056
4065
|
max-width: 1280px;
|
|
4057
4066
|
margin: 0 auto;
|
|
@@ -4063,6 +4072,8 @@ body.strand-banner-active .strand-instrument-viewport--full-bleed {
|
|
|
4063
4072
|
identity on the page, so it carries the brand even at this small size. */
|
|
4064
4073
|
.strand-nav__logo {
|
|
4065
4074
|
flex-shrink: 0;
|
|
4075
|
+
display: inline-flex;
|
|
4076
|
+
align-items: center;
|
|
4066
4077
|
margin-right: var(--strand-space-8);
|
|
4067
4078
|
font-family: var(--strand-font-mono);
|
|
4068
4079
|
font-size: var(--strand-text-sm);
|
|
@@ -4226,14 +4237,17 @@ body.strand-banner-active .strand-instrument-viewport--full-bleed {
|
|
|
4226
4237
|
}
|
|
4227
4238
|
|
|
4228
4239
|
/* ── Mobile menu ──
|
|
4229
|
-
|
|
4230
|
-
|
|
4231
|
-
|
|
4232
|
-
|
|
4240
|
+
Docks immediately below its parent .strand-nav as an overlay (the
|
|
4241
|
+
parent has position: relative, so absolute positions against it).
|
|
4242
|
+
For .strand-nav--glass the parent is position: fixed, so the menu
|
|
4243
|
+
still anchors right under the fixed bar at viewport top. For inline
|
|
4244
|
+
specimens or any non-glass placement the menu drops below the nav
|
|
4245
|
+
in flow rather than jumping to viewport top. Hidden by default;
|
|
4246
|
+
show via JS by adding strand-nav__mobile-menu--open. */
|
|
4233
4247
|
.strand-nav__mobile-menu {
|
|
4234
4248
|
display: none;
|
|
4235
|
-
position:
|
|
4236
|
-
top:
|
|
4249
|
+
position: absolute;
|
|
4250
|
+
top: 100%;
|
|
4237
4251
|
left: 0;
|
|
4238
4252
|
right: 0;
|
|
4239
4253
|
flex-direction: column;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dillingerstaffing/strand-svelte",
|
|
3
|
-
"version": "0.17.
|
|
3
|
+
"version": "0.17.3",
|
|
4
4
|
"description": "Strand UI - Svelte component library built on the Strand Design Language",
|
|
5
5
|
"author": "Dillinger Staffing <engineering@dillingerstaffing.com> (https://dillingerstaffing.com)",
|
|
6
6
|
"license": "MIT",
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
"svelte": "^4.0.0 || ^5.0.0"
|
|
57
57
|
},
|
|
58
58
|
"dependencies": {
|
|
59
|
-
"@dillingerstaffing/strand": "^0.17.
|
|
59
|
+
"@dillingerstaffing/strand": "^0.17.3"
|
|
60
60
|
},
|
|
61
61
|
"devDependencies": {
|
|
62
62
|
"@sveltejs/vite-plugin-svelte": "^5.0.0",
|