anentrypoint-design 0.0.160 → 0.0.161
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/app-shell.css +25 -0
- package/dist/247420.css +25 -0
- package/dist/247420.js +10 -10
- package/package.json +1 -1
- package/src/components/community.js +8 -3
- package/src/components/shell.js +15 -3
package/app-shell.css
CHANGED
|
@@ -193,6 +193,31 @@ pre .n { color: var(--green-2); }
|
|
|
193
193
|
background: color-mix(in oklab, var(--bg) 88%, transparent);
|
|
194
194
|
backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
|
|
195
195
|
}
|
|
196
|
+
|
|
197
|
+
/* Merged chrome: when AppShell gets both a topbar and a crumb it wraps them
|
|
198
|
+
in .app-chrome and they share ONE sticky band instead of stacking as two
|
|
199
|
+
bars. The breadcrumb provides the left identity (it already begins with the
|
|
200
|
+
brand), so the topbar's standalone brand is hidden to avoid showing the name
|
|
201
|
+
twice; nav and the crumb's right slot sit together on the right. */
|
|
202
|
+
.app-chrome {
|
|
203
|
+
position: sticky; top: 0; z-index: var(--z-header);
|
|
204
|
+
display: flex; flex-wrap: wrap; align-items: center;
|
|
205
|
+
gap: var(--space-2) var(--space-4);
|
|
206
|
+
padding: 8px var(--pad-x);
|
|
207
|
+
background: color-mix(in oklab, var(--bg) 88%, transparent);
|
|
208
|
+
backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
|
|
209
|
+
}
|
|
210
|
+
.app-chrome > .app-topbar,
|
|
211
|
+
.app-chrome > .app-crumb {
|
|
212
|
+
position: static; background: none; backdrop-filter: none;
|
|
213
|
+
-webkit-backdrop-filter: none; padding: 0; min-height: 0;
|
|
214
|
+
flex: 1 1 auto;
|
|
215
|
+
}
|
|
216
|
+
.app-chrome > .app-crumb { order: 1; flex: 1 1 auto; }
|
|
217
|
+
.app-chrome > .app-topbar { order: 2; flex: 0 0 auto; }
|
|
218
|
+
.app-chrome > .app-topbar > .brand { display: none; }
|
|
219
|
+
.app-chrome > .app-topbar > nav { margin-left: 0; }
|
|
220
|
+
.app-chrome > .app-crumb > .crumb-right { margin-left: auto; }
|
|
196
221
|
.app-topbar > .brand { flex: 0 0 auto; }
|
|
197
222
|
.app-topbar > .app-search { flex: 1 1 auto; }
|
|
198
223
|
.app-topbar > nav { margin-left: auto; }
|
package/dist/247420.css
CHANGED
|
@@ -525,6 +525,31 @@
|
|
|
525
525
|
background: color-mix(in oklab, var(--bg) 88%, transparent);
|
|
526
526
|
backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
|
|
527
527
|
}
|
|
528
|
+
|
|
529
|
+
/* Merged chrome: when AppShell gets both a topbar and a crumb it wraps them
|
|
530
|
+
in .app-chrome and they share ONE sticky band instead of stacking as two
|
|
531
|
+
bars. The breadcrumb provides the left identity (it already begins with the
|
|
532
|
+
brand), so the topbar's standalone brand is hidden to avoid showing the name
|
|
533
|
+
twice; nav and the crumb's right slot sit together on the right. */
|
|
534
|
+
.ds-247420 .app-chrome {
|
|
535
|
+
position: sticky; top: 0; z-index: var(--z-header);
|
|
536
|
+
display: flex; flex-wrap: wrap; align-items: center;
|
|
537
|
+
gap: var(--space-2) var(--space-4);
|
|
538
|
+
padding: 8px var(--pad-x);
|
|
539
|
+
background: color-mix(in oklab, var(--bg) 88%, transparent);
|
|
540
|
+
backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
|
|
541
|
+
}
|
|
542
|
+
.ds-247420 .app-chrome > .app-topbar,
|
|
543
|
+
.ds-247420 .app-chrome > .app-crumb {
|
|
544
|
+
position: static; background: none; backdrop-filter: none;
|
|
545
|
+
-webkit-backdrop-filter: none; padding: 0; min-height: 0;
|
|
546
|
+
flex: 1 1 auto;
|
|
547
|
+
}
|
|
548
|
+
.ds-247420 .app-chrome > .app-crumb { order: 1; flex: 1 1 auto; }
|
|
549
|
+
.ds-247420 .app-chrome > .app-topbar { order: 2; flex: 0 0 auto; }
|
|
550
|
+
.ds-247420 .app-chrome > .app-topbar > .brand { display: none; }
|
|
551
|
+
.ds-247420 .app-chrome > .app-topbar > nav { margin-left: 0; }
|
|
552
|
+
.ds-247420 .app-chrome > .app-crumb > .crumb-right { margin-left: auto; }
|
|
528
553
|
.ds-247420 .app-topbar > .brand { flex: 0 0 auto; }
|
|
529
554
|
.ds-247420 .app-topbar > .app-search { flex: 1 1 auto; }
|
|
530
555
|
.ds-247420 .app-topbar > nav { margin-left: auto; }
|