feat(dashboard): Home view hides support panels for focused first impression
The Home hero was being crowded by the sidebar, inspector, and console that surround it on every other view. Add a 'simple' grid layout that collapses to just rail + topbar + main when view==='home', giving the hero the full screen. The moment a user clicks any non-Home rail icon (Scene, Apps, Inspector, Witness, Ghost Murmur), the full power-user grid restores. Co-Authored-By: claude-flow <ruv@ruv.net>
This commit is contained in:
parent
b34e5ee8cf
commit
779cb83343
|
|
@ -60,6 +60,18 @@ export class NvApp extends LitElement {
|
|||
height: 100vh;
|
||||
width: 100vw;
|
||||
}
|
||||
/* Home view simplifies: hides sidebar / inspector / console so the
|
||||
hero gets the full screen. Power-user panels stay one rail click away. */
|
||||
.app.simple {
|
||||
grid-template-columns: 56px 1fr;
|
||||
grid-template-rows: 48px 1fr;
|
||||
grid-template-areas:
|
||||
'rail topbar'
|
||||
'rail main';
|
||||
}
|
||||
.app.simple nv-sidebar,
|
||||
.app.simple nv-inspector,
|
||||
.app.simple nv-console { display: none; }
|
||||
nv-rail { grid-area: rail; }
|
||||
nv-topbar { grid-area: topbar; }
|
||||
nv-sidebar { grid-area: sidebar; }
|
||||
|
|
@ -90,12 +102,13 @@ export class NvApp extends LitElement {
|
|||
`;
|
||||
|
||||
override render() {
|
||||
const isSimple = this.view === 'home';
|
||||
return html`
|
||||
<a class="skip-link" href="#main-content"
|
||||
@click=${(e: Event) => { e.preventDefault(); const sr = this.shadowRoot; sr?.querySelector<HTMLElement>('.main')?.focus(); }}>
|
||||
Skip to main content
|
||||
</a>
|
||||
<div class="app">
|
||||
<div class="app ${isSimple ? 'simple' : ''}">
|
||||
<nv-rail .view=${this.view} @navigate=${(e: CustomEvent<View>) => (this.view = e.detail)}></nv-rail>
|
||||
<nv-topbar></nv-topbar>
|
||||
<nv-sidebar></nv-sidebar>
|
||||
|
|
|
|||
Loading…
Reference in New Issue