bytelyst/learning_ai_notes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(web): stabilize mobile layouts

Browse Source
This commit is contained in:
Saravana Achu Mac 2026-05-05 10:58:10 -07:00
parent 7acbf2dae7
commit 837a187bd1
3 changed files with 19 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/src/app/(app)/notes/[noteId]/page.tsx
View File

@ -228,7 +228,7 @@ export default function NoteDetailPage() {
title={note.title} title={note.title}
description="Editable note surface with metadata, linked context, tasks, artifacts, and review history." description="Editable note surface with metadata, linked context, tasks, artifacts, and review history."
actions={ actions={
<div style={{ display: "flex", gap: "var(--nl-space-2)", alignItems: "center" }}> <div style={{ display: "flex", gap: "var(--nl-space-2)", alignItems: "center", flexWrap: "wrap" }}>
{isSaving ? ( {isSaving ? (
<Badge>Saving</Badge> <Badge>Saving</Badge>
) : ( ) : (
@ -259,7 +259,7 @@ export default function NoteDetailPage() {
</div> </div>
} }
> >
<div style={{ display: "grid", gridTemplateColumns: "minmax(0, 1.7fr) minmax(320px, 1fr)", gap: "var(--nl-space-4)" }}> <div className="note-detail-grid" style={{ display: "grid", gridTemplateColumns: "minmax(0, 1.7fr) minmax(320px, 1fr)", gap: "var(--nl-space-4)" }}>
<NoteEditor <NoteEditor
note={note} note={note}
onSave={handleSave} onSave={handleSave}

2
web/src/app/(app)/workspaces/page.tsx
View File

@ -172,7 +172,7 @@ function WorkspacesPageInner() {
</div> </div>
} }
> >
<section style={{ display: "grid", gridTemplateColumns: "minmax(260px, 320px) minmax(0, 1fr)", gap: "var(--nl-space-4)" }}> <section className="workspace-layout-grid" style={{ display: "grid", gridTemplateColumns: "minmax(260px, 320px) minmax(0, 1fr)", gap: "var(--nl-space-4)" }}>
<aside className="surface-card" style={{ padding: "var(--nl-space-5)", display: "grid", gap: "var(--nl-space-4)" }}> <aside className="surface-card" style={{ padding: "var(--nl-space-5)", display: "grid", gap: "var(--nl-space-4)" }}>
<div style={{ fontWeight: 700 }}>Saved views</div> <div style={{ fontWeight: 700 }}>Saved views</div>
<div style={{ display: "grid", gap: "var(--nl-space-3)" }}> <div style={{ display: "grid", gap: "var(--nl-space-3)" }}>

16
web/src/app/globals.css
View File

@ -124,6 +124,22 @@ button {
border-right: 0; border-right: 0;
border-bottom: 1px solid var(--nl-border-default); border-bottom: 1px solid var(--nl-border-default);
} }
.main-panel {
padding: var(--nl-space-5);
}
.note-detail-grid,
.workspace-layout-grid {
grid-template-columns: minmax(0, 1fr) !important;
}
}
@media (max-width: 520px) {
.main-panel {
padding: var(--nl-space-4);
padding-top: var(--nl-space-8);
}
} }
/* Focus-visible — keyboard accessibility */ /* Focus-visible — keyboard accessibility */