From 2f8f594dff5ee19dc3fae75a5fd370b9b85dba9e Mon Sep 17 00:00:00 2001 From: lucaronin Date: Sun, 22 Feb 2026 12:35:43 +0100 Subject: [PATCH] =?UTF-8?q?design:=20fix=20improve-sort=20wireframes=20?= =?UTF-8?q?=E2=80=94=20sort=20dropdown=20with=20direction=20arrows?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-Authored-By: Claude Opus 4.6 --- design/improve-sort.pen | 10690 ++------------------------------------ 1 file changed, 495 insertions(+), 10195 deletions(-) diff --git a/design/improve-sort.pen b/design/improve-sort.pen index eecea385..fbd221fc 100644 --- a/design/improve-sort.pen +++ b/design/improve-sort.pen @@ -1,10253 +1,553 @@ { "version": "2.8", - "children": [ - { - "type": "frame", - "id": "qHhaj", - "x": 68, - "y": 3385, - "name": "Laputa App — Full Layout (Light)", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 1440, - "height": 900, - "fill": "$--background", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "yVQFF", - "name": "macOS Title Bar", - "width": "fill_container", - "height": 38, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "gap": 12, - "padding": [ - 0, - 12 - ], - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "0MCME", - "name": "trafficLights", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "ellipse", - "id": "c2AU6", - "name": "closeBtn", - "fill": "#FF5F57", - "width": 12, - "height": 12 - }, - { - "type": "ellipse", - "id": "h0zbh", - "name": "minimizeBtn", - "fill": "#FEBC2E", - "width": 12, - "height": 12 - }, - { - "type": "ellipse", - "id": "tcqbu", - "name": "maximizeBtn", - "fill": "#28C840", - "width": 12, - "height": 12 - } - ] - } - ] - }, - { - "type": "frame", - "id": "oHDfa", - "name": "Content", - "width": "fill_container", - "height": "fill_container", - "children": [ - { - "type": "frame", - "id": "ZTOSJ", - "name": "Panel: Sidebar", - "clip": true, - "width": 250, - "height": "fill_container", - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": 0, - "fill": "$--sidebar-border" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "4wMva", - "name": "Filters", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 1, - "padding": [ - 8, - 8, - 16, - 8 - ], - "children": [ - { - "type": "frame", - "id": "Q78hg", - "name": "filterAll", - "width": "fill_container", - "fill": "#4a9eff18", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "5ip58", - "name": "leftAll", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "PXpWi", - "name": "iconAll", - "width": 18, - "height": 18, - "iconFontName": "tray-fill", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--primary" - }, - { - "type": "text", - "id": "NWprl", - "name": "fAllTxt", - "fill": "$--primary", - "content": "Untagged", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "NZ9Dv", - "name": "countAll", - "height": 20, - "fill": "$--primary", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mPlUV", - "name": "badgeAllTxt", - "fill": "$--primary-foreground", - "content": "24", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "YLWsY", - "name": "filterUntagged", - "width": "fill_container", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "k7LIr", - "name": "leftUntagged", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "FMVlh", - "name": "untaggedIcon", - "width": 18, - "height": 18, - "iconFontName": "cardholder", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "5XllD", - "name": "untaggedTxt", - "fill": "$--foreground", - "content": "All Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "aSpGv", - "name": "countUntagged", - "height": 20, - "fill": "$--secondary", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "qZUFt", - "name": "untaggedBadgeTxt", - "fill": "$--muted-foreground", - "content": "6", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "Jahon", - "name": "filterTrash", - "width": "fill_container", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "IOiBI", - "name": "leftTrash", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "X6F74", - "name": "trashIcon", - "width": 18, - "height": 18, - "iconFontName": "trash", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "vRMH9", - "name": "trashTxt", - "fill": "$--foreground", - "content": "Archive", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "JMpkq", - "name": "countTrash", - "height": 20, - "fill": "$--secondary", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "0cKm4", - "name": "trashBadgeTxt", - "fill": "$--muted-foreground", - "content": "2", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "6RMbq", - "name": "filterChanges", - "width": "fill_container", - "cornerRadius": 6, - "gap": 6, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "DpdBu", - "name": "leftChanges", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "VTusA", - "name": "iconChanges", - "width": 18, - "height": 18, - "iconFontName": "git-branch", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "qvq5O", - "name": "fChangesTxt", - "fill": "$--foreground", - "content": "Changes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "qAMES", - "name": "countChanges", - "height": 20, - "fill": "$--secondary", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "nkzVk", - "name": "badgeChangesTxt", - "fill": "$--muted-foreground", - "content": "3", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "SSEUP", - "name": "Sections", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "padding": [ - 8, - 0 - ], - "children": [ - { - "type": "frame", - "id": "nM2Cn", - "name": "projGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6, - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "ouIl9", - "name": "projHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "Rx1Cp", - "name": "leftProj", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "t5WJJ", - "name": "projIcon", - "width": 18, - "height": 18, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "S3sGC", - "name": "projLabel", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "FKwSS", - "name": "projChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "IHzFh", - "name": "projItem1", - "width": "fill_container", - "fill": "$--accent-red-light", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "iiFcl", - "name": "proj1Txt", - "fill": "$--accent-red", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "LdaU9", - "name": "projItem2", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "XRll4", - "name": "proj2Txt", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Vmykd", - "name": "projItem3", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "0PqQQ", - "name": "proj3Txt", - "fill": "$--muted-foreground", - "content": "AI Habit Tracker", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "WAQtn", - "name": "respGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "aSi3l", - "name": "respHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "lov6B", - "name": "leftResp", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Em4ns", - "name": "respIcon", - "width": 18, - "height": 18, - "iconFontName": "medal", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "WPRCo", - "name": "respLabel", - "fill": "$--foreground", - "content": "Responsibilities", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "6hDdQ", - "name": "respChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "FmUu0", - "name": "procGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "Dat6o", - "name": "respHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "iJlgx", - "name": "leftResp", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "I2J1R", - "name": "respIcon", - "width": 18, - "height": 18, - "iconFontName": "arrows-clockwise", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "AToF0", - "name": "Procedures", - "fill": "$--foreground", - "content": "Procedures", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "meEIL", - "name": "procChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "T4NG2", - "name": "peopleGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "Q01iL", - "name": "peopleHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "eE6Ca", - "name": "leftPeople", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "jOmVa", - "name": "peopleIcon", - "width": 18, - "height": 18, - "iconFontName": "users", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "caelD", - "name": "peopleLbl", - "fill": "$--foreground", - "content": "People", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "TkuS1", - "name": "peopleChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "BY1Qx", - "name": "eventsGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "v28d8", - "name": "eventsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "TPyOc", - "name": "leftEvents", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "ELRMi", - "name": "eventsIcon", - "width": 18, - "height": 18, - "iconFontName": "calendar-blank", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "OlI6Q", - "name": "eventsLbl", - "fill": "$--foreground", - "content": "Events", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "TZwK8", - "name": "eventsChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "trKNW", - "name": "topicsGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "qdbZ3", - "name": "eventsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "JP83M", - "name": "leftEvents", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "Q57kF", - "name": "eventsIcon", - "width": 18, - "height": 18, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "DeVxP", - "name": "eventsLbl", - "fill": "$--foreground", - "content": "Topics", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "nzAcm", - "name": "topicsChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ZWXuk", - "name": "topicsGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "CQaLg", - "name": "eventsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "2SMcN", - "name": "leftEvents", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "0N8UH", - "name": "eventsIcon", - "width": 18, - "height": 18, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "6XB2H", - "name": "eventsLbl", - "fill": "$--foreground", - "content": "Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "NmBSB", - "name": "topicsChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "2cQBp", - "name": "eventsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "0f10v", - "name": "leftEvents", - "gap": 8, - "padding": [ - 8, - 0 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "xBv1X", - "name": "eventsIcon", - "width": 18, - "height": 18, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "viWPL", - "name": "eventsLbl", - "fill": "$--muted-foreground", - "content": "Create new type", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "8lLHp", - "name": "Commit Area", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "top": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "padding": 12, - "children": [ - { - "type": "frame", - "id": "YYjuy", - "name": "commitBtn", - "width": "fill_container", - "fill": "$--primary", - "cornerRadius": 6, - "gap": 6, - "padding": [ - 8, - 16 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "YF44G", - "name": "commitIcon", - "width": 14, - "height": 14, - "iconFontName": "git-commit-horizontal", - "iconFontFamily": "lucide", - "fill": "$--primary-foreground" - }, - { - "type": "text", - "id": "vpzJm", - "name": "commitTxt", - "fill": "$--primary-foreground", - "content": "Commit & Push", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "vhU5z", - "name": "commitBadge", - "height": 18, - "fill": "#ffffff40", - "cornerRadius": 9, - "padding": [ - 0, - 5 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "sdvYT", - "name": "commitBadgeTxt", - "fill": "$--white", - "content": "3", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "IIvWr", - "name": "Resize Handle", - "fill": "$--border", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "zFIJv", - "name": "Panel: NoteList", - "clip": true, - "width": 300, - "height": "fill_container", - "fill": "$--card", - "stroke": { - "align": "inside", - "thickness": 0, - "fill": "$--border" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "uZJVN", - "name": "NoteList Header", - "width": "fill_container", - "height": 45, - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "padding": [ - 14, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "hmbdb", - "name": "nlTitle", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "m6AeW", - "name": "nlActions", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "8gMXE", - "name": "searchIcon", - "width": 16, - "height": 16, - "iconFontName": "magnifying-glass", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "YqvSN", - "name": "plusIcon", - "width": 16, - "height": 16, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "0aJUm", - "name": "Note Items", - "clip": true, - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "y9y05", - "name": "Backlinks Group", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "tMsM4", - "name": "Note Item Selected", - "width": "fill_container", - "fill": "$--accent-red-light", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "#E9E9E7" - }, - "children": [ - { - "type": "rectangle", - "id": "npYuc", - "name": "leftAccent", - "fill": "$--accent-red", - "width": 3, - "height": "fill_container" - }, - { - "type": "frame", - "id": "a33Wx", - "name": "noteSelContent", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "padding": [ - 14, - 16 - ], - "children": [ - { - "type": "frame", - "id": "AZkyx", - "name": "noteSelRow", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "j7GDJ", - "name": "titleGroup", - "width": "fill_container", - "gap": 6, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "j7o2Q", - "name": "noteSelTitle", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "icon_font", - "id": "BnkTG", - "name": "ico", - "width": 14, - "height": 14, - "iconFontName": "wrench", - "iconFontFamily": "lucide", - "fill": "$--accent-red" - } - ] - } - ] - }, - { - "type": "text", - "id": "Ac5Ds", - "name": "noteSelSnip", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Personal knowledge and life management desktop app...", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "9ASsT", - "name": "noteSelTime", - "fill": "$--accent-red", - "content": "2m ago", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "7G8pN", - "name": "Related Notes Group", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "fDxtF", - "name": "Related Notes Header", - "width": "fill_container", - "height": 32, - "fill": "$--muted", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "UBRdO", - "name": "rnLeft", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "8Z4Wq", - "name": "rnLabel", - "fill": "$--muted-foreground", - "content": "RELATED NOTES", - "fontFamily": "IBM Plex Mono", - "fontSize": 11 - }, - { - "type": "text", - "id": "vpnZr", - "name": "rnCount", - "fill": "$--muted-foreground", - "content": "2", - "fontFamily": "IBM Plex Mono", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "X9LIR", - "name": "rnRight", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "fzVWu", - "name": "rnFilter", - "width": 12, - "height": 12, - "iconFontName": "funnel", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "wuqsO", - "name": "rnPlus", - "width": 12, - "height": 12, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "SbjLq", - "name": "rnChev", - "width": 12, - "height": 12, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "AsAKG", - "name": "Note Item", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 4, - "padding": [ - 14, - 16 - ], - "children": [ - { - "type": "frame", - "id": "QX5A1", - "name": "note2Row", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "rYdta", - "name": "leafGroup", - "width": "fill_container", - "gap": 6, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PC9XN", - "name": "note2Title", - "fill": "$--foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "oI64Y", - "name": "leafIco", - "width": 14, - "height": 14, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "fill": "$--accent-green" - } - ] - } - ] - }, - { - "type": "text", - "id": "S9JPj", - "name": "note2Snip", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Redesigning portfolio site with modern stack and updated visual language...", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "lU75x", - "name": "note2Time", - "fill": "$--muted-foreground", - "content": "1h ago", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "u6E6Z", - "name": "Note Item", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 4, - "padding": [ - 14, - 16 - ], - "children": [ - { - "type": "frame", - "id": "ZjCz3", - "name": "note2Row", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "mxCzu", - "name": "leafGroup", - "width": "fill_container", - "gap": 6, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "INenY", - "name": "note2Title", - "fill": "$--foreground", - "content": "Sample note 2", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "gz6qS", - "name": "leafIco", - "width": 14, - "height": 14, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "fill": "$--accent-green" - } - ] - } - ] - }, - { - "type": "text", - "id": "s141z", - "name": "note2Snip", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "SvGnt", - "name": "note2Time", - "fill": "$--muted-foreground", - "content": "1h ago", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "1GwHB", - "name": "Events Group", - "width": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "fp4xI", - "name": "Events Header", - "width": "fill_container", - "height": 32, - "fill": "$--muted", - "padding": [ - 0, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "MNNuU", - "name": "evLeft", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "BNxZp", - "name": "evLabel", - "fill": "$--muted-foreground", - "content": "EVENTS", - "fontFamily": "IBM Plex Mono", - "fontSize": 11 - }, - { - "type": "text", - "id": "qcEvw", - "name": "evCount", - "fill": "$--muted-foreground", - "content": "2", - "fontFamily": "IBM Plex Sans", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "WCyfc", - "name": "evRight", - "gap": 10, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "SpCoO", - "name": "evFilter", - "width": 12, - "height": 12, - "iconFontName": "funnel", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "G1DCl", - "name": "evPlus", - "width": 12, - "height": 12, - "iconFontName": "plus", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "sAalN", - "name": "evChev", - "width": 12, - "height": 12, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "k7CjA", - "name": "Note Item 2", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 4, - "padding": [ - 14, - 16 - ], - "children": [ - { - "type": "frame", - "id": "og5Gz", - "name": "note3Row", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "ttBdk", - "name": "calGroup", - "width": "fill_container", - "gap": 6, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "KI8Bf", - "name": "note3Title", - "fill": "$--foreground", - "content": "Meeting with Grant", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "LdRjU", - "name": "calIco", - "width": 14, - "height": 14, - "iconFontName": "calendar", - "iconFontFamily": "lucide", - "fill": "$--accent-yellow" - } - ] - } - ] - }, - { - "type": "text", - "id": "FfPXa", - "name": "note3Snip", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "BHh4Z", - "name": "note3Time", - "fill": "$--muted-foreground", - "content": "Yesterday", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "AQ51u", - "name": "Note Item 2", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 4, - "padding": [ - 14, - 16 - ], - "children": [ - { - "type": "frame", - "id": "SHgK3", - "name": "note3Row", - "width": "fill_container", - "gap": 8, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "3rIet", - "name": "calGroup", - "width": "fill_container", - "gap": 6, - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dCwzu", - "name": "note3Title", - "fill": "$--foreground", - "content": "Meeting with Matteo", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "l8O2I", - "name": "calIco", - "width": 14, - "height": 14, - "iconFontName": "calendar", - "iconFontFamily": "lucide", - "fill": "$--accent-yellow" - } - ] - } - ] - }, - { - "type": "text", - "id": "1L4oo", - "name": "note3Snip", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Discussed Q1 goals and hiring priorities with the engineering team leads...", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "3oBam", - "name": "note3Time", - "fill": "$--muted-foreground", - "content": "Yesterday", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "MeqjO", - "name": "Resize Handle 2", - "fill": "$--border", - "width": 1, - "height": "fill_container" - }, - { - "type": "frame", - "id": "zAbPt", - "name": "Panel: Editor", - "clip": true, - "width": "fill_container", - "height": "fill_container", - "fill": "$--background", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "NdYcO", - "name": "Tab Bar", - "width": "fill_container", - "height": 45, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "nVUGr", - "name": "Tab Active", - "height": "fill_container", - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$--border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "kBpGX", - "name": "tab1Txt", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "Bb2AE", - "name": "tab1Close", - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "GYeyL", - "name": "Tab Inactive", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "kZ1bn", - "name": "tab2Txt", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "RwyYI", - "name": "tab2Close", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "sbpmq", - "name": "tabSpacer", - "width": "fill_container", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - } - }, - { - "type": "frame", - "id": "WF97k", - "name": "tabControls", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1, - "left": 1 - }, - "fill": "$--border" - }, - "gap": 12, - "padding": [ - 0, - 12 - ], - "justifyContent": "space_around", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "rfSoS", - "name": "iconPlus", - "width": 16, - "height": 16, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "t0u6z", - "name": "iconSplit", - "width": 16, - "height": 16, - "iconFontName": "columns", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "kbe1P", - "name": "iconExpand", - "width": 16, - "height": 16, - "iconFontName": "arrows-out-simple", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "rTdKS", - "name": "Editor Body", - "width": "fill_container", - "height": "fill_container", - "children": [ - { - "type": "frame", - "id": "NfyTF", - "name": "Editor Left", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "hvoFh", - "name": "Info Bar", - "width": "fill_container", - "height": 45, - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "bTP0I", - "name": "infoLeft", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Msj7v", - "name": "breadcrumbType", - "fill": "$--muted-foreground", - "content": "Project", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "wqdMG", - "name": "breadcrumbSep", - "fill": "$--muted-foreground", - "content": "›", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "FzENd", - "name": "breadcrumbName", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "pvTmc", - "name": "dotSep", - "fill": "$--muted-foreground", - "content": "·", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "9ga1R", - "name": "modifiedTxt", - "fill": "$--accent-yellow", - "content": "M", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "3bzDp", - "name": "infoRight", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "9Ctb0", - "name": "iconSearch", - "width": 16, - "height": 16, - "iconFontName": "magnifying-glass", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "csHzz", - "name": "iconSearch", - "width": 16, - "height": 16, - "iconFontName": "git-branch", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "2s6Of", - "name": "iconSearch", - "width": 16, - "height": 16, - "iconFontName": "cursor-text", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "JVSlj", - "name": "iconAI", - "width": 16, - "height": 16, - "iconFontName": "sparkle", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "k3AiV", - "name": "iconMore", - "width": 16, - "height": 16, - "iconFontName": "dots-three", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "vvETz", - "name": "Editor Content", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": [ - 32, - 64 - ], - "children": [ - { - "type": "text", - "id": "b6up3", - "name": "editorP1", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Personal knowledge and life management desktop app, built with Tauri v2 + React + TypeScript + CodeMirror 6. It reads a vault of markdown files with YAML frontmatter and presents them in a four-panel UI inspired by Bear Notes.", - "lineHeight": 1.6, - "fontFamily": "Inter", - "fontSize": 16, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "a2S43", - "name": "editorH2", - "fill": "$--foreground", - "content": "Architecture", - "lineHeight": 1.3, - "fontFamily": "Inter", - "fontSize": 24, - "fontWeight": "600" - }, - { - "type": "text", - "id": "wgvQa", - "name": "editorP2", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "The app uses a four-panel layout: Sidebar for navigation, NoteList for browsing, Editor for content, and Inspector for metadata. All data lives in markdown files with YAML frontmatter, git-versioned.", - "lineHeight": 1.6, - "fontFamily": "Inter", - "fontSize": 16, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "GGP97", - "name": "Inspector", - "clip": true, - "width": 260, - "height": "fill_container", - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "left": 1 - }, - "fill": "$--border" - }, - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "FbHy7", - "name": "Inspector Header", - "width": "fill_container", - "height": 45, - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "gap": 8, - "padding": [ - 0, - 12 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "sA7Dx", - "name": "leftGroup", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "0ccF1", - "name": "propIcon", - "width": 16, - "height": 16, - "iconFontName": "sliders-horizontal", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "T2vTZ", - "name": "inspTitle", - "fill": "$--muted-foreground", - "content": "Properties", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "600" - } - ] - }, - { - "type": "icon_font", - "id": "NQOhZ", - "name": "sidebarIcon", - "width": 16, - "height": 16, - "iconFontName": "x", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "LYFki", - "name": "Inspector Body", - "clip": true, - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "gap": 16, - "padding": 12, - "children": [ - { - "type": "frame", - "id": "8g61y", - "name": "Properties Section", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "frame", - "id": "VhH4P", - "name": "addPropBtn", - "width": "fill_container", - "cornerRadius": 6, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "padding": [ - 6, - 12 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Q9z8F", - "name": "addPropTxt", - "fill": "$--muted-foreground", - "content": "+ Add property", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "6PwTH", - "name": "propType", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "Vt2BC", - "name": "propTypeLbl", - "fill": "$--muted-foreground", - "content": "TYPE", - "fontFamily": "IBM Plex Mono", - "fontSize": 10, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "uvBiY", - "name": "propTypeVal", - "fill": "$--foreground", - "content": "Project", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "FDbay", - "name": "propStatus", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "e426F", - "name": "propStatusLbl", - "fill": "$--muted-foreground", - "content": "STATUS", - "fontFamily": "IBM Plex Mono", - "fontSize": 10, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "o2rZM", - "name": "propStatusBadge", - "fill": "$--accent-green-light", - "cornerRadius": 16, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "transparent" - }, - "gap": 8, - "padding": [ - 1, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "QM7L3", - "name": "Badge Text", - "fill": "$--accent-green", - "content": "ACTIVE", - "lineHeight": 1.33, - "textAlign": "center", - "textAlignVertical": "middle", - "fontFamily": "IBM Plex Mono", - "fontSize": 10, - "fontWeight": "600", - "letterSpacing": 1.2 - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "NmRLv", - "name": "Relationships Section", - "width": "fill_container", - "layout": "vertical", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "WFVAr", - "name": "relGroup1", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "0N729", - "name": "relGrp1Title", - "fill": "$--muted-foreground", - "content": "BELONGS TO", - "fontFamily": "IBM Plex Mono", - "fontSize": 10 - }, - { - "type": "frame", - "id": "zLl8F", - "name": "relLaputaBtn", - "width": "fill_container", - "fill": "$--accent-green-light", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "kw9vC", - "name": "laputaTxt", - "fill": "$--accent-green", - "content": "Laputa", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "RFvoz", - "name": "topicIcon", - "opacity": 0.5, - "width": 14, - "height": 14, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "fill": "$--accent-green" - } - ] - }, - { - "type": "frame", - "id": "ybi8Q", - "name": "relLaputaBtn", - "width": "fill_container", - "fill": "$--accent-green-light", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "VNcmt", - "name": "laputaTxt", - "fill": "$--accent-green", - "content": "Building", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "UVPwc", - "name": "topicIcon", - "opacity": 0.5, - "width": 14, - "height": 14, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "fill": "$--accent-green" - } - ] - }, - { - "type": "frame", - "id": "L6knW", - "name": "linkExisting", - "width": "fill_container", - "cornerRadius": 6, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "padding": [ - 6, - 10 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "jwU3Z", - "name": "laputaTxt", - "fill": "$--muted-foreground", - "content": "+ Link existing", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "laPFL", - "name": "relGroup2", - "width": "fill_container", - "layout": "vertical", - "gap": 4, - "children": [ - { - "type": "text", - "id": "LOXUL", - "name": "relGrp2Title", - "fill": "$--muted-foreground", - "content": "RELATED TO", - "fontFamily": "IBM Plex Mono", - "fontSize": 10 - }, - { - "type": "frame", - "id": "qLTYD", - "name": "relMigrationBtn", - "width": "fill_container", - "fill": "$--accent-red-light", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "GBk2u", - "name": "migrationTxt", - "fill": "$--accent-red", - "content": "Shadcn Migration", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "Sy14T", - "name": "expIcon", - "opacity": 0.5, - "width": 14, - "height": 14, - "iconFontName": "flask", - "iconFontFamily": "phosphor", - "fill": "$--accent-red" - } - ] - }, - { - "type": "frame", - "id": "u8ijV", - "name": "linkExisting", - "width": "fill_container", - "cornerRadius": 6, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "padding": [ - 6, - 10 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "PUXx5", - "name": "laputaTxt", - "fill": "$--muted-foreground", - "content": "+ Link existing", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "6PUnO", - "name": "Backlinks Section", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "frame", - "id": "PllIu", - "name": "blTitle", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ZbgbI", - "name": "blTitleTxt", - "rotation": -0.5285936385085725, - "fill": "$--muted-foreground", - "content": "BACKLINKS", - "fontFamily": "IBM Plex Mono", - "fontSize": 10 - } - ] - }, - { - "type": "text", - "id": "eRoDO", - "name": "blItem1", - "fill": "$--primary", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "u1olR", - "name": "blItem2", - "fill": "$--primary", - "content": "Meeting with Grant", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "oUd9s", - "name": "blItem3", - "fill": "$--primary", - "content": "Q1 Planning", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "yf0wj", - "name": "History Section", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "text", - "id": "dG7rj", - "name": "histTitle", - "fill": "$--muted-foreground", - "content": "HISTORY", - "fontFamily": "IBM Plex Mono", - "fontSize": 10 - }, - { - "type": "frame", - "id": "z2Mdy", - "name": "histItem1", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "left": 2 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 0, - 0, - 0, - 10 - ], - "children": [ - { - "type": "text", - "id": "AsiWz", - "name": "histItem1Hash", - "fill": "$--accent-blue", - "content": "a089f44 · feat: migrate to shadcn/ui", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "BdVhi", - "name": "histItem1Date", - "fill": "$--muted-foreground", - "content": "Feb 16, 2026", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "piJNC", - "name": "histItem2", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "left": 2 - }, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 0, - 0, - 0, - 10 - ], - "children": [ - { - "type": "text", - "id": "0PWoX", - "name": "histItem2Hash", - "fill": "$--accent-blue", - "content": "5a4b4ac · feat: emoji favicon", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "xySNW", - "name": "histItem2Date", - "fill": "$--muted-foreground", - "content": "Feb 15, 2026", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "normal" - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "x1AHT", - "name": "lightStatusBar", - "width": "fill_container", - "height": 30, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "top": 1 - }, - "fill": "$--border" - }, - "padding": [ - 0, - 8 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "e2UzJ", - "name": "Status Left", - "height": "fill_container", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "mlD58", - "name": "versionIcon", - "width": 14, - "height": 14, - "iconFontName": "box", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "hRBRa", - "name": "versionText", - "fill": "$--muted-foreground", - "content": "v0.4.2", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "500" - }, - { - "type": "text", - "id": "bFwrw", - "name": "sep1", - "fill": "$--border", - "content": "|", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "ey3Gr", - "name": "branchIcon", - "width": 14, - "height": 14, - "iconFontName": "git-branch", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "Kz0sS", - "name": "branchText", - "fill": "$--muted-foreground", - "content": "main", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "6IY1E", - "name": "sep2", - "fill": "$--border", - "content": "|", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "IjEG1", - "name": "syncIcon", - "width": 13, - "height": 13, - "iconFontName": "refresh-cw", - "iconFontFamily": "lucide", - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "srxkr", - "name": "syncText", - "fill": "$--muted-foreground", - "content": "Synced 2m ago", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "4jgQF", - "name": "Status Right", - "height": "fill_container", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "3RPmA", - "name": "aiIcon", - "width": 13, - "height": 13, - "iconFontName": "sparkles", - "iconFontFamily": "lucide", - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "t0NOA", - "name": "aiText", - "fill": "$--muted-foreground", - "content": "Claude Sonnet 4", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "16V7i", - "name": "sep3", - "fill": "$--border", - "content": "|", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "PXVrd", - "name": "notesCount", - "width": 13, - "height": 13, - "iconFontName": "file-text", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "2FxCi", - "name": "notesText", - "fill": "$--muted-foreground", - "content": "1,247 notes", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "pB6ds", - "name": "sep4", - "fill": "$--border", - "content": "|", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "fRHKs", - "name": "bellIcon", - "width": 13, - "height": 13, - "iconFontName": "bell", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "2sEBS", - "name": "settingsIcon", - "width": 13, - "height": 13, - "iconFontName": "settings", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "mOf4J", - "x": 0, - "y": 4457, - "name": "Color Palette — shadcn/ui Theme (Light)", - "theme": { - "Mode": "Light" - }, - "width": 1440, - "fill": "$--background", - "layout": "vertical", - "gap": 32, - "padding": 40, - "children": [ - { - "type": "text", - "id": "rmJdn", - "name": "cTitle", - "fill": "$--foreground", - "content": "Color Palette — shadcn/ui Theme Variables (Light)", - "fontFamily": "Inter", - "fontSize": 28, - "fontWeight": "700", - "letterSpacing": -0.5 - }, - { - "type": "text", - "id": "V79Zu", - "name": "cSub", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "All colors from src/index.css. Variables support light/dark mode via .dark class.", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Xbdzq", - "name": "primLbl", - "fill": "$--foreground", - "content": "Primary Colors", - "fontFamily": "Inter", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "NyoC7", - "name": "primRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "Inb1x", - "name": "sw1", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "HRsVC", - "name": "sw1b", - "fill": "$--background", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "jV89s", - "name": "sw1n", - "fill": "$--foreground", - "content": "--background", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "qOUUY", - "name": "sw1v", - "fill": "$--muted-foreground", - "content": "L: #FFFFFF / D: #0f0f1a", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "QytAQ", - "name": "sw2", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "TMuHH", - "name": "sw2b", - "fill": "$--foreground", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "k9qK4", - "name": "sw2n", - "fill": "$--foreground", - "content": "--foreground", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "BfEn7", - "name": "sw2v", - "fill": "$--muted-foreground", - "content": "L: #37352F / D: #e0e0e0", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "gJZtB", - "name": "sw3", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "RRsQg", - "name": "sw3b", - "fill": "$--primary", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "CtJe4", - "name": "sw3n", - "fill": "$--foreground", - "content": "--primary", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "1iFr6", - "name": "sw3v", - "fill": "$--muted-foreground", - "content": "#155DFF", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "mbvua", - "name": "sw4", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "fajNZ", - "name": "sw4b", - "fill": "$--primary-foreground", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "wVJ7z", - "name": "sw4n", - "fill": "$--foreground", - "content": "--primary-foreground", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "Oum5Q", - "name": "sw4v", - "fill": "$--muted-foreground", - "content": "L: #FFFFFF / D: #ffffff", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "UvI4d", - "name": "accLbl", - "fill": "$--foreground", - "content": "Accent & Semantic Colors", - "fontFamily": "Inter", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "jOmo7", - "name": "accRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "uFXJ3", - "name": "a1", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "NRr0w", - "name": "a1b", - "fill": "$--accent-blue", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "ECVqk", - "name": "a1n", - "fill": "$--foreground", - "content": "--accent-blue", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "csKEt", - "name": "a2", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "5IiT2", - "name": "a2b", - "fill": "$--accent-green", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "aCPba", - "name": "a2n", - "fill": "$--foreground", - "content": "--accent-green", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "XbY7C", - "name": "a3", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "I9qCz", - "name": "a3b", - "fill": "$--accent-yellow", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "DfZVh", - "name": "a3n", - "fill": "$--foreground", - "content": "--accent-yellow", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "nROw3", - "name": "a4", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "IcIoP", - "name": "a4b", - "fill": "$--accent-red", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "eGgz6", - "name": "a4n", - "fill": "$--foreground", - "content": "--destructive", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "J95fv", - "name": "a5", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "o03fQ", - "name": "a5b", - "fill": "$--accent-purple", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "H9VWy", - "name": "a5n", - "fill": "$--foreground", - "content": "--accent-purple", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "text", - "id": "GcYle", - "name": "lightLightLbl", - "fill": "$--foreground", - "content": "Accent Light Backgrounds", - "fontFamily": "Inter", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "Ju2xp", - "name": "accLightRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "5dnn5", - "name": "al1", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "7kcqW", - "name": "ll1b", - "fill": "$--accent-blue-light", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "dBCbF", - "name": "ll1n", - "fill": "$--foreground", - "content": "--accent-blue-light", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "W0t0j", - "name": "al2", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "1vepp", - "name": "ll2b", - "fill": "$--accent-green-light", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "6kUyf", - "name": "ll2n", - "fill": "$--foreground", - "content": "--accent-green-light", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "zyV1j", - "name": "al3", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "yUDBN", - "name": "ll3b", - "fill": "$--accent-yellow-light", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "dmfZ4", - "name": "ll3n", - "fill": "$--foreground", - "content": "--accent-yellow-light", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "yGmmo", - "name": "al4", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "eLu8o", - "name": "ll4b", - "fill": "$--accent-red-light", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "PVLwR", - "name": "ll4n", - "fill": "$--foreground", - "content": "--accent-red-light", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "0BO2b", - "name": "al5", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "6FBws", - "name": "ll5b", - "fill": "$--accent-purple-light", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "i2DfV", - "name": "ll5n", - "fill": "$--foreground", - "content": "--accent-purple-light", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "text", - "id": "JFocf", - "name": "surfLbl", - "fill": "$--foreground", - "content": "Surface & Border Colors", - "fontFamily": "Inter", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "YAJLW", - "name": "surfRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "JHS3j", - "name": "s1", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "9Bj41", - "name": "s1b", - "fill": "$--card", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "wn4ua", - "name": "s1n", - "fill": "$--foreground", - "content": "--card", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Fyvfd", - "name": "s2", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "UFLw5", - "name": "s2b", - "fill": "$--sidebar", - "width": "fill_container", - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--sidebar-border" - } - }, - { - "type": "text", - "id": "gngfL", - "name": "s2n", - "fill": "$--foreground", - "content": "--sidebar", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "zbyEJ", - "name": "s3", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "WnmQD", - "name": "s3b", - "fill": "$--secondary", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "wnkxR", - "name": "s3n", - "fill": "$--foreground", - "content": "--secondary", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "Z2FuK", - "name": "s4", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "lNPnc", - "name": "s4b", - "fill": "$--border", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "x9aeh", - "name": "s4n", - "fill": "$--foreground", - "content": "--border / --input", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "TDDQ0", - "name": "s5", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "MwHOe", - "name": "s5b", - "fill": "$--muted-foreground", - "width": "fill_container", - "height": 60 - }, - { - "type": "text", - "id": "dHZj5", - "name": "s5n", - "fill": "$--foreground", - "content": "--muted-foreground", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "HZonq", - "x": 0, - "y": 5252, - "name": "Typography & Spacing Specs (Light)", - "theme": { - "Mode": "Light" - }, - "width": 1440, - "fill": "$--background", - "layout": "vertical", - "gap": 32, - "padding": 40, - "children": [ - { - "type": "text", - "id": "nGLlU", - "name": "tTitle", - "fill": "$--foreground", - "content": "Typography Scale (Light)", - "fontFamily": "Inter", - "fontSize": 28, - "fontWeight": "700", - "letterSpacing": -0.5 - }, - { - "type": "text", - "id": "gkQqO", - "name": "tSub", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Fonts: Inter, IBM Plex Mono. Base: 14px. System fallback: -apple-system, BlinkMacSystemFont, sans-serif.", - "lineHeight": 1.5, - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "QL9fK", - "name": "t1", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "px1l7", - "name": "t1s", - "fill": "$--foreground", - "content": "Heading 1", - "lineHeight": 1.2, - "fontFamily": "Inter", - "fontSize": 32, - "fontWeight": "700" - }, - { - "type": "text", - "id": "3UWKu", - "name": "t1d", - "fill": "$--muted-foreground", - "content": "32px / Bold / lh 1.2 — Editor H1", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Yjhit", - "name": "t2", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "iFzl0", - "name": "t2s", - "fill": "$--foreground", - "content": "Heading 2", - "lineHeight": 1.3, - "fontFamily": "Inter", - "fontSize": 24, - "fontWeight": "600" - }, - { - "type": "text", - "id": "cF55I", - "name": "t2d", - "fill": "$--muted-foreground", - "content": "24px / Semibold / lh 1.3 — Editor H2", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "bBHMa", - "name": "t3", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "kpSyr", - "name": "t3s", - "fill": "$--foreground", - "content": "App Title", - "fontFamily": "Inter", - "fontSize": 17, - "fontWeight": "700", - "letterSpacing": -0.3 - }, - { - "type": "text", - "id": "xUuNz", - "name": "t3d", - "fill": "$--muted-foreground", - "content": "17px / Bold / ls -0.3 — Sidebar header", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "Lsh7F", - "name": "t4", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "vTRSs", - "name": "t4s", - "fill": "$--foreground", - "content": "Body Text", - "lineHeight": 1.6, - "fontFamily": "Inter", - "fontSize": 16, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "fKa3p", - "name": "t4d", - "fill": "$--muted-foreground", - "content": "16px / Regular / lh 1.6 — Editor paragraphs", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "rpOTz", - "name": "t5", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "VXY3Z", - "name": "t5s", - "fill": "$--foreground", - "content": "UI Label / Button", - "lineHeight": 1.43, - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "500" - }, - { - "type": "text", - "id": "F6GQz", - "name": "t5d", - "fill": "$--muted-foreground", - "content": "14px / Medium / lh 1.43 — Buttons, NoteList header, Inspector labels", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "H6Rgt", - "name": "t6", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "xWvbj", - "name": "t6s", - "fill": "$--foreground", - "content": "Sidebar Item", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "text", - "id": "bvBBm", - "name": "t6d", - "fill": "$--muted-foreground", - "content": "13px / Medium — Sidebar nav items, filter items, search", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "GrFAq", - "name": "t7", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "vY8j4", - "name": "t7s", - "fill": "$--muted-foreground", - "content": "SECTION HEADER", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 0.5 - }, - { - "type": "text", - "id": "okws6", - "name": "t7d", - "fill": "$--muted-foreground", - "content": "11px / Semibold / ls 0.5 — Sidebar sections, type pills", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "awxls", - "name": "t8", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "mD3f5", - "name": "t8s", - "fill": "$--foreground", - "content": "ALL-CAPS LABEL", - "fontFamily": "IBM Plex Mono", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1.2 - }, - { - "type": "text", - "id": "jFpLw", - "name": "t8d", - "fill": "$--muted-foreground", - "content": "11px / Semibold / ls 1.2 / IBM Plex Mono — Section labels, metadata tags", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "ToLzL", - "name": "t9", - "width": "fill_container", - "gap": 24, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "LEsxW", - "name": "t9s", - "fill": "$--muted-foreground", - "content": "OVERLINE TEXT", - "fontFamily": "IBM Plex Mono", - "fontSize": 10, - "fontWeight": "500", - "letterSpacing": 1.5 - }, - { - "type": "text", - "id": "HQ3Df", - "name": "t9d", - "fill": "$--muted-foreground", - "content": "10px / Medium / ls 1.5 / IBM Plex Mono — Overlines, category labels, timestamps", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "rectangle", - "id": "3tiJ7", - "name": "div1", - "fill": "$--border", - "width": "fill_container", - "height": 1 - }, - { - "type": "text", - "id": "b2Mt9", - "name": "spTitle", - "fill": "$--foreground", - "content": "Spacing & Layout Reference", - "fontFamily": "Inter", - "fontSize": 28, - "fontWeight": "700", - "letterSpacing": -0.5 - }, - { - "type": "frame", - "id": "o6ETJ", - "name": "pnlRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "HhbOn", - "name": "p1", - "width": "fill_container", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "children": [ - { - "type": "text", - "id": "YBekR", - "name": "p1t", - "fill": "$--foreground", - "content": "Sidebar: 250px", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "dT8Xe", - "name": "p1d", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "bg: --sidebar | padding: 8px container, 12px 16px header, 6px 16px items", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "aYkMZ", - "name": "p2", - "width": "fill_container", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "children": [ - { - "type": "text", - "id": "Eycne", - "name": "p2t", - "fill": "$--foreground", - "content": "NoteList: 300px", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "lyTZN", - "name": "p2d", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "bg: --card | padding: 14px 16px header, 8px 12px search/pills, 10px 16px items", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "E6G3g", - "name": "p3", - "width": "fill_container", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "children": [ - { - "type": "text", - "id": "Xy5Gl", - "name": "p3t", - "fill": "$--foreground", - "content": "Editor: flexible", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "y4svr", - "name": "p3d", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "bg: --background | padding: 32px 64px content, 7px 14px tabs, gap: 16px", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "RBPav", - "name": "p4", - "width": "fill_container", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 6, - "padding": 16, - "children": [ - { - "type": "text", - "id": "xKUWC", - "name": "p4t", - "fill": "$--foreground", - "content": "Inspector: 280px", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "u81W5", - "name": "p4d", - "fill": "$--muted-foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "bg: --sidebar | padding: 14px 12px header, 12px body, 16px section gap, 8px prop gap", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "text", - "id": "VvZyF", - "name": "radLbl", - "fill": "$--foreground", - "content": "Border Radius", - "fontFamily": "Inter", - "fontSize": 18, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "OwJH7", - "name": "radRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "DHrzV", - "name": "r1", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "rectangle", - "cornerRadius": 4, - "id": "V35oi", - "name": "r1b", - "fill": "$--secondary", - "width": 80, - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "HVQpq", - "name": "r1n", - "fill": "$--foreground", - "content": "4px (sm) — chips", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "wp350", - "name": "r2", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "rectangle", - "cornerRadius": 6, - "id": "E031z", - "name": "r2b", - "fill": "$--secondary", - "width": 80, - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "rDLff", - "name": "r2n", - "fill": "$--foreground", - "content": "6px (md) — buttons, inputs", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "d6tJt", - "name": "r3", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "rectangle", - "cornerRadius": 8, - "id": "PNkS4", - "name": "r3b", - "fill": "$--secondary", - "width": 80, - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "rZGXb", - "name": "r3n", - "fill": "$--foreground", - "content": "8px (lg) — cards, dialogs", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "UAZ8u", - "name": "r4", - "width": "fill_container", - "layout": "vertical", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "rectangle", - "cornerRadius": 16, - "id": "wgMVG", - "name": "r4b", - "fill": "$--secondary", - "width": 80, - "height": 60, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - } - }, - { - "type": "text", - "id": "zw3RY", - "name": "r4n", - "fill": "$--foreground", - "content": "16px — badges", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "rectangle", - "id": "kIrXE", - "name": "div2", - "fill": "$--border", - "width": "fill_container", - "height": 1 - }, - { - "type": "text", - "id": "FYw8k", - "name": "compTitle", - "fill": "$--foreground", - "content": "shadcn/ui Component Inventory", - "fontFamily": "Inter", - "fontSize": 28, - "fontWeight": "700", - "letterSpacing": -0.5 - }, - { - "type": "frame", - "id": "7Q1Fi", - "name": "compRow", - "width": "fill_container", - "gap": 16, - "children": [ - { - "type": "frame", - "id": "XfUwj", - "name": "cg1", - "width": "fill_container", - "fill": "$--card", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 12, - "padding": 16, - "children": [ - { - "type": "text", - "id": "ly7m0", - "name": "cg1t", - "fill": "$--accent-green", - "content": "In Use", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "Re89a", - "name": "cg1r1", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Button — 5 variants (Default, Secondary, Outline, Ghost, Destructive)", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "ILbjW", - "name": "cg1r2", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Input — Default text input with label group", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "eurqS", - "name": "cg1r3", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Dialog — Modal overlay (CreateNote, Commit)", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "AZyZP", - "name": "cg1r4", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Badge — 4 variants (Default, Secondary, Outline, Destructive)", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "WtehQ", - "name": "cg2", - "width": "fill_container", - "fill": "$--card", - "cornerRadius": 8, - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--border" - }, - "layout": "vertical", - "gap": 12, - "padding": 16, - "children": [ - { - "type": "text", - "id": "KaMZ9", - "name": "cg2t", - "fill": "$--accent-yellow", - "content": "Available (Not Yet Used)", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - }, - { - "type": "text", - "id": "F8wam", - "name": "cg2r1", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "DropdownMenu — Context / dropdown menus", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "Nl1aV", - "name": "cg2r2", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Tabs — Tab navigation component", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "0sBwH", - "name": "cg2r3", - "fill": "$--foreground", - "textGrowth": "fixed-width", - "width": "fill_container", - "content": "Tooltip, Select, Card, Separator, ScrollArea", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "trSB1", - "x": 1600, - "y": 3385, - "name": "Trash — Sidebar Filter", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 260, - "height": 400, - "fill": "$--sidebar", - "layout": "vertical", - "gap": 0, - "padding": [ - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "trFAll", - "name": "filterAll", - "width": "fill_container", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "trIAll", - "name": "iconAll", - "width": 16, - "height": 16, - "iconFontName": "file-text", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "trTAll", - "name": "txtAll", - "fill": "$--foreground", - "content": "All Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "trFFav", - "name": "filterFav", - "width": "fill_container", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "trIFav", - "name": "iconFav", - "width": 16, - "height": 16, - "iconFontName": "star", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "trTFav", - "name": "txtFav", - "fill": "$--foreground", - "content": "Favorites", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "trFArc", - "name": "filterArchive", - "width": "fill_container", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "trIArc", - "name": "iconArchive", - "width": 16, - "height": 16, - "iconFontName": "archive", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--foreground" - }, - { - "type": "text", - "id": "trTArc", - "name": "txtArchive", - "fill": "$--foreground", - "content": "Archive", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "trBArc", - "name": "badgeArc", - "height": 20, - "fill": "$--muted", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trBTArc", - "fill": "$--muted-foreground", - "content": "2", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "trFTr", - "name": "filterTrash", - "width": "fill_container", - "fill": "#ef444418", - "cornerRadius": 6, - "gap": 8, - "padding": [ - 6, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "trITr", - "name": "iconTrash", - "width": 16, - "height": 16, - "iconFontName": "trash", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--destructive" - }, - { - "type": "text", - "id": "trTTr", - "name": "txtTrash", - "fill": "$--destructive", - "content": "Trash", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "600" - }, - { - "type": "frame", - "id": "trBTr", - "name": "badgeTrash", - "height": 20, - "fill": "$--destructive", - "cornerRadius": 9999, - "padding": [ - 0, - 6 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trBTTr", - "fill": "#ffffff", - "content": "3", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "trNL1", - "x": 1600, - "y": 3815, - "name": "Trash — Note List View", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 340, - "height": 360, - "fill": "$--card", - "layout": "vertical", - "gap": 0, - "children": [ - { - "type": "frame", - "id": "trNLH", - "name": "header", - "width": "fill_container", - "height": 45, - "padding": [ - 0, - 16 - ], - "alignItems": "center", - "justifyContent": "space_between", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "children": [ - { - "type": "text", - "id": "trNLT", - "fill": "$--foreground", - "content": "Trash", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "trN1", - "name": "trashedNote1", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "padding": [ - 14, - 16 - ], - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "children": [ - { - "type": "frame", - "id": "trN1H", - "name": "titleRow", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trN1T", - "fill": "$--foreground", - "content": "Old Draft Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "trN1B", - "name": "trashedBadge", - "height": 16, - "fill": "#ef444418", - "cornerRadius": 4, - "padding": [ - 1, - 4 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trN1BT", - "fill": "$--destructive", - "content": "TRASHED", - "fontFamily": "Inter", - "fontSize": 9, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "text", - "id": "trN1S", - "fill": "$--muted-foreground", - "content": "Some draft content that is no longer needed...", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "400" - }, - { - "type": "text", - "id": "trN1D", - "fill": "$--muted-foreground", - "content": "5d ago", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "400" - } - ] - }, - { - "type": "frame", - "id": "trN2", - "name": "trashedNote2Warning", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "padding": [ - 14, - 16 - ], - "fill": "#ef44440a", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "children": [ - { - "type": "frame", - "id": "trN2H", - "name": "titleRow", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trN2T", - "fill": "$--foreground", - "content": "Deprecated API Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "trN2B", - "name": "warningBadge", - "height": 16, - "fill": "$--destructive", - "cornerRadius": 4, - "padding": [ - 1, - 4 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trN2BT", - "fill": "#ffffff", - "content": "30+ DAYS", - "fontFamily": "Inter", - "fontSize": 9, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "text", - "id": "trN2S", - "fill": "$--muted-foreground", - "content": "Old API documentation that was replaced...", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "400" - }, - { - "type": "text", - "id": "trN2D", - "fill": "$--destructive", - "content": "Trashed 35d ago — will be permanently deleted", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "trRI1", - "x": 1970, - "y": 3385, - "name": "Trash — Relationship Indicator", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 300, - "height": 200, - "fill": "$--background", - "layout": "vertical", - "gap": 8, - "padding": [ - 16, - 16 - ], - "children": [ - { - "type": "text", - "id": "trRIL", - "fill": "$--muted-foreground", - "content": "BELONGS TO", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600", - "letterSpacing": 0.5 - }, - { - "type": "frame", - "id": "trRN", - "name": "normalRef", - "width": "fill_container", - "fill": "$--accent-blue-light", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "gap": 6, - "alignItems": "center", - "justifyContent": "space_between", - "children": [ - { - "type": "text", - "id": "trRNT", - "fill": "$--accent-blue", - "content": "Build Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "trRNI", - "width": 14, - "height": 14, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-blue" - } - ] - }, - { - "type": "frame", - "id": "trRT", - "name": "trashedRef", - "width": "fill_container", - "fill": "$--muted", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "gap": 6, - "alignItems": "center", - "justifyContent": "space_between", - "opacity": 0.7, - "children": [ - { - "type": "frame", - "id": "trRTL", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "trRTTI", - "width": 12, - "height": 12, - "iconFontName": "trash", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "trRTT", - "fill": "$--muted-foreground", - "content": "Old Draft Notes", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "trRTTX", - "fill": "$--muted-foreground", - "content": "(trashed)", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "400" - } - ] - }, - { - "type": "icon_font", - "id": "trRTI", - "width": 14, - "height": 14, - "iconFontName": "file-text", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "trRA", - "name": "archivedRef", - "width": "fill_container", - "fill": "$--muted", - "cornerRadius": 6, - "padding": [ - 6, - 10 - ], - "gap": 6, - "alignItems": "center", - "justifyContent": "space_between", - "opacity": 0.7, - "children": [ - { - "type": "frame", - "id": "trRAL", - "gap": 4, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "trRAT", - "fill": "$--muted-foreground", - "content": "Website Redesign", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "trRATX", - "fill": "$--muted-foreground", - "content": "(archived)", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "400" - } - ] - }, - { - "type": "icon_font", - "id": "trRAI", - "width": 14, - "height": 14, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "trW30", - "x": 1970, - "y": 3615, - "name": "Trash — 30-Day Auto-Delete Warning", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 340, - "height": 120, - "fill": "$--background", - "layout": "vertical", - "gap": 8, - "padding": [ - 16, - 16 - ], - "children": [ - { - "type": "text", - "id": "trW3L", - "fill": "$--muted-foreground", - "content": "Warning banner shown at top of trash view:", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "500" - }, - { - "type": "frame", - "id": "trW3B", - "name": "warningBanner", - "width": "fill_container", - "fill": "#ef44440f", - "cornerRadius": 8, - "padding": [ - 10, - 12 - ], - "gap": 8, - "alignItems": "center", - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "#ef444430" - }, - "children": [ - { - "type": "icon_font", - "id": "trW3I", - "width": 16, - "height": 16, - "iconFontName": "warning", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--destructive" - }, - { - "type": "frame", - "id": "trW3T", - "layout": "vertical", - "gap": 2, - "children": [ - { - "type": "text", - "id": "trW3T1", - "fill": "$--destructive", - "content": "Notes in trash for 30+ days will be permanently deleted", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "600" - }, - { - "type": "text", - "id": "trW3T2", - "fill": "$--muted-foreground", - "content": "1 note is past the 30-day retention period", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "400" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "dt0", - "name": "Draggable Tabs — Default State", - "width": 800, - "height": 120, - "layout": "vertical", - "fill": "$--sidebar", - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dt1", - "name": "frameLabel", - "content": "Default: tabs are draggable (grab cursor on hover)", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 8, - 12 - ] - }, - { - "type": "frame", - "id": "dt2", - "name": "Tab Bar Default", - "width": "fill_container", - "height": 45, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dt3", - "name": "Tab Active", - "height": "fill_container", - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$--border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt4", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "dt5", - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt6", - "name": "Tab Inactive", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt7", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dt8", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt9", - "name": "Tab Inactive 2", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dta", - "fill": "$--muted-foreground", - "content": "Weekly Review", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dtb", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dtc", - "name": "Tab Inactive 3", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dtd", - "fill": "$--muted-foreground", - "content": "Workout Log", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dte", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dtf", - "name": "tabSpacer", - "width": "fill_container", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - } - }, - { - "type": "frame", - "id": "dtg", - "name": "tabControls", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1, - "left": 1 - }, - "fill": "$--border" - }, - "gap": 12, - "padding": [ - 0, - 12 - ], - "justifyContent": "space_around", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dth", - "width": 16, - "height": 16, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "text", - "id": "dti", - "name": "cursorNote", - "content": "cursor: grab → grabbing during drag", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 4, - 12 - ] - } - ] - }, - { - "type": "frame", - "id": "dtj", - "name": "Draggable Tabs — Dragging (Tab Being Moved)", - "width": 800, - "height": 120, - "layout": "vertical", - "fill": "$--sidebar", - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dtk", - "name": "frameLabel2", - "content": "Dragging: \"Portfolio Rewrite\" is being dragged left (opacity 0.5, blue drop indicator)", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 8, - 12 - ] - }, - { - "type": "frame", - "id": "dtl", - "name": "Tab Bar Dragging", - "width": "fill_container", - "height": 45, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "alignItems": "center", - "children": [ - { - "type": "rectangle", - "id": "dtm", - "name": "Drop Indicator", - "width": 2, - "height": 30, - "fill": "$--primary", - "cornerRadius": 1 - }, - { - "type": "frame", - "id": "dtn", - "name": "Tab Active", - "height": "fill_container", - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$--border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dto", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "dtp", - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dtq", - "name": "Tab Dragging (ghost)", - "height": "fill_container", - "opacity": 0.5, - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dtr", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dts", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dtt", - "name": "Tab Inactive 2", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dtu", - "fill": "$--muted-foreground", - "content": "Weekly Review", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "dtv", - "name": "Tab Inactive 3", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dtw", - "fill": "$--muted-foreground", - "content": "Workout Log", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "dtx", - "name": "tabSpacer", - "width": "fill_container", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - } - }, - { - "type": "frame", - "id": "dty", - "name": "tabControls", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1, - "left": 1 - }, - "fill": "$--border" - }, - "gap": 12, - "padding": [ - 0, - 12 - ], - "justifyContent": "space_around", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dtz", - "width": 16, - "height": 16, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "text", - "id": "dt10", - "name": "dragNote", - "content": "Drop indicator: 2px $--primary bar shows insertion point. Dragged tab has opacity: 0.5.", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 4, - 12 - ] - } - ] - }, - { - "type": "frame", - "id": "dt11", - "name": "Draggable Tabs — After Drop (Reordered)", - "width": 800, - "height": 120, - "layout": "vertical", - "fill": "$--sidebar", - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dt12", - "name": "frameLabel3", - "content": "After drop: \"Portfolio Rewrite\" moved before \"Laputa App\". Order persisted to localStorage.", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 8, - 12 - ] - }, - { - "type": "frame", - "id": "dt13", - "name": "Tab Bar Reordered", - "width": "fill_container", - "height": 45, - "fill": "$--sidebar", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dt14", - "name": "Tab Inactive (moved)", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt15", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dt16", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt17", - "name": "Tab Active", - "height": "fill_container", - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "right": 1 - }, - "fill": "$--border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt18", - "fill": "$--foreground", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "icon_font", - "id": "dt19", - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt1a", - "name": "Tab Inactive 2", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt1b", - "fill": "$--muted-foreground", - "content": "Weekly Review", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dt1c", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt1d", - "name": "Tab Inactive 3", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "right": 1, - "bottom": 1 - }, - "fill": "$--sidebar-border" - }, - "gap": 6, - "padding": [ - 0, - 14 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dt1e", - "fill": "$--muted-foreground", - "content": "Workout Log", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "icon_font", - "id": "dt1f", - "opacity": 0, - "width": 14, - "height": 14, - "iconFontName": "x", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dt1g", - "name": "tabSpacer", - "width": "fill_container", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - } - }, - { - "type": "frame", - "id": "dt1h", - "name": "tabControls", - "height": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1, - "left": 1 - }, - "fill": "$--border" - }, - "gap": 12, - "padding": [ - 0, - 12 - ], - "justifyContent": "space_around", - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dt1i", - "width": 16, - "height": 16, - "iconFontName": "plus", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "text", - "id": "dt1j", - "name": "persistNote", - "content": "localStorage key: \"laputa-tab-order\" stores path array. Restored on next session.", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "normal", - "fill": "$--muted-foreground", - "padding": [ - 4, - 12 - ] - } - ] - }, - { - "type": "frame", - "id": "dsg01a", - "name": "Sidebar — Drag Handles Visible", - "x": 68, - "y": 6400, - "width": 330, - "height": 680, - "fill": "$--background", - "layout": "vertical", - "padding": [ - 16 - ], - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dsg01b", - "name": "frame1Title", - "content": "Drag handles appear on section headers", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600", - "fill": "$--foreground" - }, - { - "type": "text", - "id": "dsg01c", - "name": "frame1Desc", - "content": "Grip icon shown left of section icon. Cursor changes to grab on hover.", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground" - }, - { - "type": "frame", - "id": "dsg01d", - "height": 12 - }, - { - "type": "frame", - "id": "dsg01e", - "name": "sidebarDefault", - "width": 250, - "height": 600, - "fill": "$--sidebar", - "layout": "vertical", - "clip": true, - "children": [ - { - "type": "frame", - "id": "dsg01f", - "name": "filters", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "padding": [ - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg01g", - "name": "allNotesRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg01h", - "width": 18, - "height": 18, - "iconFontName": "file-text", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg01i", - "fill": "$--foreground", - "content": "All Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg01j", - "name": "favRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg01k", - "width": 18, - "height": 18, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg01l", - "fill": "$--muted-foreground", - "content": "Favorites", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg01m", - "name": "sectionsWrap", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "dsg00a", - "name": "projGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6, - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg005", - "name": "projHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg001", - "name": "projLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg000", - "name": "projDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg002", - "name": "projIcon", - "width": 18, - "height": 18, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "dsg003", - "name": "projLabel", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg004", - "name": "projChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dsg006", - "name": "projItem0", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "fill": "$--accent-red-light", - "children": [ - { - "type": "text", - "id": "dsg007", - "name": "projItemTxt0", - "fill": "$--accent-red", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg008", - "name": "projItem1", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dsg009", - "name": "projItemTxt1", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg00h", - "name": "respGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg00g", - "name": "respHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg00c", - "name": "respLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg00b", - "name": "respDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg00d", - "name": "respIcon", - "width": 18, - "height": 18, - "iconFontName": "medal", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg00e", - "name": "respLabel", - "fill": "$--foreground", - "content": "Responsibilities", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg00f", - "name": "respChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg00o", - "name": "procGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg00n", - "name": "procHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg00j", - "name": "procLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg00i", - "name": "procDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg00k", - "name": "procIcon", - "width": 18, - "height": 18, - "iconFontName": "arrows-clockwise", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg00l", - "name": "procLabel", - "fill": "$--foreground", - "content": "Procedures", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg00m", - "name": "procChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg00v", - "name": "peopleGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg00u", - "name": "peopleHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg00q", - "name": "peopleLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg00p", - "name": "peopleDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg00r", - "name": "peopleIcon", - "width": 18, - "height": 18, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg00s", - "name": "peopleLabel", - "fill": "$--foreground", - "content": "People", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg00t", - "name": "peopleChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg012", - "name": "eventsGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg011", - "name": "eventsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg00x", - "name": "eventsLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg00w", - "name": "eventsDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg00y", - "name": "eventsIcon", - "width": 18, - "height": 18, - "iconFontName": "cardholder", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg00z", - "name": "eventsLabel", - "fill": "$--foreground", - "content": "Events", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg010", - "name": "eventsChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg019", - "name": "topicsGroup", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg018", - "name": "topicsHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg014", - "name": "topicsLeft", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg013", - "name": "topicsDrag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg015", - "name": "topicsIcon", - "width": 18, - "height": 18, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "dsg016", - "name": "topicsLabel", - "fill": "$--foreground", - "content": "Topics", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg017", - "name": "topicsChev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg02w", - "name": "Sidebar — Section Being Dragged", - "x": 420, - "y": 6400, - "width": 330, - "height": 680, - "fill": "$--background", - "layout": "vertical", - "padding": [ - 16 - ], - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dsg02x", - "name": "frame2Title", - "content": "Dragging \"People\" above \"Responsibilities\"", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600", - "fill": "$--foreground" - }, - { - "type": "text", - "id": "dsg02y", - "name": "frame2Desc", - "content": "Blue drop indicator line shows insertion point. Dragged section floats with blue border.", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground" - }, - { - "type": "frame", - "id": "dsg02z", - "height": 12 - }, - { - "type": "frame", - "id": "dsg030", - "name": "sidebarDragging", - "width": 250, - "height": 600, - "fill": "$--sidebar", - "layout": "vertical", - "clip": true, - "children": [ - { - "type": "frame", - "id": "dsg031", - "name": "filters", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "padding": [ - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg032", - "name": "allNotesRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg033", - "width": 18, - "height": 18, - "iconFontName": "file-text", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg034", - "fill": "$--foreground", - "content": "All Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg035", - "name": "favRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg036", - "width": 18, - "height": 18, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg037", - "fill": "$--muted-foreground", - "content": "Favorites", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg038", - "name": "sectionsWrap", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "dsg01x", - "name": "proj2Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6, - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg01s", - "name": "proj2Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg01o", - "name": "proj2Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg01n", - "name": "proj2Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg01p", - "name": "proj2Icon", - "width": 18, - "height": 18, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "dsg01q", - "name": "proj2Label", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg01r", - "name": "proj2Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dsg01t", - "name": "proj2Item0", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "fill": "$--accent-red-light", - "children": [ - { - "type": "text", - "id": "dsg01u", - "name": "proj2ItemTxt0", - "fill": "$--accent-red", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg01v", - "name": "proj2Item1", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dsg01w", - "name": "proj2ItemTxt1", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg01y", - "name": "dropIndicator", - "width": "fill_container", - "height": 2, - "fill": "$--accent-blue", - "cornerRadius": 1 - }, - { - "type": "frame", - "id": "dsg025", - "name": "resp2Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg024", - "name": "resp2Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg020", - "name": "resp2Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg01z", - "name": "resp2Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg021", - "name": "resp2Icon", - "width": 18, - "height": 18, - "iconFontName": "medal", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg022", - "name": "resp2Label", - "fill": "$--foreground", - "content": "Responsibilities", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg023", - "name": "resp2Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg02c", - "name": "proc2Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg02b", - "name": "proc2Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg027", - "name": "proc2Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg026", - "name": "proc2Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg028", - "name": "proc2Icon", - "width": 18, - "height": 18, - "iconFontName": "arrows-clockwise", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg029", - "name": "proc2Label", - "fill": "$--foreground", - "content": "Procedures", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg02a", - "name": "proc2Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg02j", - "name": "events2Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg02i", - "name": "events2Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg02e", - "name": "events2Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg02d", - "name": "events2Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg02f", - "name": "events2Icon", - "width": 18, - "height": 18, - "iconFontName": "cardholder", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg02g", - "name": "events2Label", - "fill": "$--foreground", - "content": "Events", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg02h", - "name": "events2Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg02q", - "name": "topics2Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg02p", - "name": "topics2Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg02l", - "name": "topics2Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg02k", - "name": "topics2Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg02m", - "name": "topics2Icon", - "width": 18, - "height": 18, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "dsg02n", - "name": "topics2Label", - "fill": "$--foreground", - "content": "Topics", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg02o", - "name": "topics2Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg02r", - "name": "draggedSection", - "x": 8, - "y": 160, - "width": 234, - "fill": "$--sidebar", - "cornerRadius": 6, - "stroke": { - "align": "outside", - "thickness": 1, - "fill": { - "type": "color", - "color": "$--accent-blue" - } - }, - "opacity": 0.9, - "layout": "vertical", - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg02s", - "name": "draggedHeader", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg02t", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--accent-blue", - "opacity": 0.8 - }, - { - "type": "icon_font", - "id": "dsg02u", - "width": 18, - "height": 18, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg02v", - "fill": "$--foreground", - "content": "People", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg04j", - "name": "Sidebar — After Reorder (People Moved Up)", - "x": 772, - "y": 6400, - "width": 330, - "height": 680, - "fill": "$--background", - "layout": "vertical", - "padding": [ - 16 - ], - "theme": { - "Mode": "Light" - }, - "children": [ - { - "type": "text", - "id": "dsg04k", - "name": "frame3Title", - "content": "After drop — People now second section", - "fontFamily": "Inter", - "fontSize": 14, - "fontWeight": "600", - "fill": "$--foreground" - }, - { - "type": "text", - "id": "dsg04l", - "name": "frame3Desc", - "content": "Order persisted as \"order\" property in each Type document frontmatter (e.g. order: 2).", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "normal", - "fill": "$--muted-foreground" - }, - { - "type": "frame", - "id": "dsg04m", - "height": 12 - }, - { - "type": "frame", - "id": "dsg04n", - "name": "sidebarReordered", - "width": 250, - "height": 600, - "fill": "$--sidebar", - "layout": "vertical", - "clip": true, - "children": [ - { - "type": "frame", - "id": "dsg04o", - "name": "filters", - "width": "fill_container", - "layout": "vertical", - "gap": 2, - "padding": [ - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg04p", - "name": "allNotesRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg04q", - "width": 18, - "height": 18, - "iconFontName": "file-text", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg04r", - "fill": "$--foreground", - "content": "All Notes", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg04s", - "name": "favRow", - "width": "fill_container", - "cornerRadius": 4, - "padding": [ - 6, - 16 - ], - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg04t", - "width": 18, - "height": 18, - "iconFontName": "star", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "dsg04u", - "fill": "$--muted-foreground", - "content": "Favorites", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg04v", - "name": "sectionsWrap", - "width": "fill_container", - "height": "fill_container", - "layout": "vertical", - "children": [ - { - "type": "frame", - "id": "dsg03j", - "name": "proj3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6, - 8, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg03e", - "name": "proj3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg03a", - "name": "proj3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg039", - "name": "proj3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg03b", - "name": "proj3Icon", - "width": 18, - "height": 18, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "dsg03c", - "name": "proj3Label", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg03d", - "name": "proj3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-down", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "dsg03f", - "name": "proj3Item0", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "fill": "$--accent-red-light", - "children": [ - { - "type": "text", - "id": "dsg03g", - "name": "proj3ItemTxt0", - "fill": "$--accent-red", - "content": "Laputa App", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "frame", - "id": "dsg03h", - "name": "proj3Item1", - "width": "fill_container", - "cornerRadius": 6, - "padding": [ - 6, - 16, - 6, - 28 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "dsg03i", - "name": "proj3ItemTxt1", - "fill": "$--muted-foreground", - "content": "Portfolio Rewrite", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "normal" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg03q", - "name": "people3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg03p", - "name": "people3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg03l", - "name": "people3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg03k", - "name": "people3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg03m", - "name": "people3Icon", - "width": 18, - "height": 18, - "iconFontName": "leaf", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg03n", - "name": "people3Label", - "fill": "$--foreground", - "content": "People", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg03o", - "name": "people3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg03x", - "name": "resp3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg03w", - "name": "resp3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg03s", - "name": "resp3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg03r", - "name": "resp3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg03t", - "name": "resp3Icon", - "width": 18, - "height": 18, - "iconFontName": "medal", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg03u", - "name": "resp3Label", - "fill": "$--foreground", - "content": "Responsibilities", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg03v", - "name": "resp3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg044", - "name": "proc3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg043", - "name": "proc3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg03z", - "name": "proc3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg03y", - "name": "proc3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg040", - "name": "proc3Icon", - "width": 18, - "height": 18, - "iconFontName": "arrows-clockwise", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-purple" - }, - { - "type": "text", - "id": "dsg041", - "name": "proc3Label", - "fill": "$--foreground", - "content": "Procedures", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg042", - "name": "proc3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg04b", - "name": "events3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg04a", - "name": "events3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg046", - "name": "events3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg045", - "name": "events3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg047", - "name": "events3Icon", - "width": 18, - "height": 18, - "iconFontName": "cardholder", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-yellow" - }, - { - "type": "text", - "id": "dsg048", - "name": "events3Label", - "fill": "$--foreground", - "content": "Events", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg049", - "name": "events3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "dsg04i", - "name": "topics3Group", - "width": "fill_container", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": { - "type": "color", - "color": "$--border", - "enabled": false - } - }, - "layout": "vertical", - "gap": 2, - "padding": [ - 4, - 6 - ], - "children": [ - { - "type": "frame", - "id": "dsg04h", - "name": "topics3Header", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "dsg04d", - "name": "topics3Left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "dsg04c", - "name": "topics3Drag", - "width": 14, - "height": 14, - "iconFontName": "grip-vertical", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground", - "opacity": 0.5 - }, - { - "type": "icon_font", - "id": "dsg04e", - "name": "topics3Icon", - "width": 18, - "height": 18, - "iconFontName": "tag", - "iconFontFamily": "phosphor", - "weight": 700, - "fill": "$--accent-green" - }, - { - "type": "text", - "id": "dsg04f", - "name": "topics3Label", - "fill": "$--foreground", - "content": "Topics", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "dsg04g", - "name": "topics3Chev", - "width": 14, - "height": 14, - "iconFontName": "chevron-right", - "iconFontFamily": "lucide", - "fill": "$--muted-foreground" - } - ] - } - ] - } - ] - } - ] - } - ] - }, - { - "type": "frame", - "id": "csB01", - "x": 0, - "y": 7140, - "name": "Sections Header — Before (old design)", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 280, - "height": 120, - "fill": "$--sidebar", - "layout": "vertical", - "gap": 8, - "padding": [ - 16, - 12 - ], - "children": [ - { - "type": "text", - "id": "csB02", - "name": "frameLabel", - "fill": "$--muted-foreground", - "content": "BEFORE — Old Design", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "csB03", - "name": "customizeBtn", - "width": "fill_container", - "cornerRadius": 4, - "gap": 6, - "padding": [ - 4, - 16 - ], - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "csB04", - "name": "slidersIcon", - "width": 14, - "height": 14, - "iconFontName": "sliders-horizontal", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "text", - "id": "csB05", - "name": "customizeLabel", - "fill": "$--muted-foreground", - "content": "Customize sections", - "fontFamily": "Inter", - "fontSize": 12 - } - ] - }, - { - "type": "frame", - "id": "csB06", - "name": "sectionRow", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "csB07", - "name": "left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "csB08", - "name": "projIcon", - "width": 16, - "height": 16, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "csB09", - "name": "projLabel", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "csB10", - "name": "chevron", - "width": 12, - "height": 12, - "iconFontName": "caret-right", - "iconFontFamily": "phosphor", - "fill": "$--foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "csA01", - "x": 340, - "y": 7140, - "name": "Sections Header — After (new design)", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 280, - "height": 120, - "fill": "$--sidebar", - "layout": "vertical", - "gap": 8, - "padding": [ - 16, - 12 - ], - "children": [ - { - "type": "text", - "id": "csA02", - "name": "frameLabel", - "fill": "$--muted-foreground", - "content": "AFTER — New Design", - "fontFamily": "Inter", - "fontSize": 10, - "fontWeight": "600", - "letterSpacing": 1 - }, - { - "type": "frame", - "id": "csA03", - "name": "sectionsHeader", - "width": "fill_container", - "padding": [ - 4, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "csA04", - "name": "sectionsLabel", - "fill": "$--muted-foreground", - "content": "SECTIONS", - "fontFamily": "Inter", - "fontSize": 11, - "fontWeight": "600", - "letterSpacing": 1.2 - }, - { - "type": "icon_font", - "id": "csA05", - "name": "settingsIcon", - "width": 14, - "height": 14, - "iconFontName": "sliders-horizontal", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - }, - { - "type": "frame", - "id": "csA06", - "name": "sectionRow", - "width": "fill_container", - "cornerRadius": 4, - "gap": 8, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "csA07", - "name": "left", - "gap": 8, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "csA08", - "name": "projIcon", - "width": 16, - "height": 16, - "iconFontName": "wrench", - "iconFontFamily": "phosphor", - "fill": "$--accent-red" - }, - { - "type": "text", - "id": "csA09", - "name": "projLabel", - "fill": "$--foreground", - "content": "Projects", - "fontFamily": "Inter", - "fontSize": 13, - "fontWeight": "500" - } - ] - }, - { - "type": "icon_font", - "id": "csA10", - "name": "chevron", - "width": 12, - "height": 12, - "iconFontName": "caret-right", - "iconFontFamily": "phosphor", - "fill": "$--foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "archBtnNorm", - "x": 68, - "y": 5200, - "name": "Archive Notes — Breadcrumb button (normal note)", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 800, - "height": 45, - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "anInfoL", - "name": "infoLeft", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "anType", - "name": "breadcrumbType", - "fill": "$--muted-foreground", - "content": "Note", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "anSep", - "name": "breadcrumbSep", - "fill": "$--muted-foreground", - "content": "›", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "anName", - "name": "breadcrumbName", - "fill": "$--foreground", - "content": "My Active Note", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "anDot", - "name": "dotSep", - "fill": "$--muted-foreground", - "content": "·", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "anWords", - "name": "wordCount", - "fill": "$--muted-foreground", - "content": "1,234 words", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - } - ] - }, - { - "type": "frame", - "id": "anInfoR", - "name": "infoRight", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "anISearch", - "width": 16, - "height": 16, - "iconFontName": "magnifying-glass", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "anIGit", - "width": 16, - "height": 16, - "iconFontName": "git-branch", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "anICursor", - "width": 16, - "height": 16, - "iconFontName": "cursor-text", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "anIAI", - "width": 16, - "height": 16, - "iconFontName": "sparkle", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "frame", - "id": "anArchiveBtn", - "name": "archiveButton", - "gap": 4, - "alignItems": "center", - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--primary" - }, - "cornerRadius": 4, - "padding": [ - 2, - 2 - ], - "children": [ - { - "type": "icon_font", - "id": "anIArchive", - "width": 16, - "height": 16, - "iconFontName": "archive", - "iconFontFamily": "phosphor", - "fill": "$--primary" - } - ] - }, - { - "type": "icon_font", - "id": "anITrash", - "width": 16, - "height": 16, - "iconFontName": "trash", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "anIMore", - "width": 16, - "height": 16, - "iconFontName": "dots-three", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "archBtnArc", - "x": 68, - "y": 5300, - "name": "Archive Notes — Breadcrumb button (archived note, shows Unarchive)", - "theme": { - "Mode": "Light" - }, - "clip": true, - "width": 800, - "height": 45, - "fill": "$--background", - "stroke": { - "align": "inside", - "thickness": { - "bottom": 1 - }, - "fill": "$--border" - }, - "padding": [ - 6, - 16 - ], - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "frame", - "id": "auInfoL", - "name": "infoLeft", - "gap": 6, - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "auType", - "name": "breadcrumbType", - "fill": "$--muted-foreground", - "content": "Note", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "auSep", - "name": "breadcrumbSep", - "fill": "$--muted-foreground", - "content": "›", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "auName", - "name": "breadcrumbName", - "fill": "$--foreground", - "content": "My Archived Note", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "500" - }, - { - "type": "text", - "id": "auDot", - "name": "dotSep", - "fill": "$--muted-foreground", - "content": "·", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "text", - "id": "auWords", - "name": "wordCount", - "fill": "$--muted-foreground", - "content": "567 words", - "fontFamily": "Inter", - "fontSize": 12, - "fontWeight": "normal" - }, - { - "type": "frame", - "id": "auBadge", - "name": "archivedBadge", - "height": 16, - "fill": "#2563eb1a", - "cornerRadius": 4, - "padding": [ - 1, - 4 - ], - "justifyContent": "center", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "auBadgeTxt", - "fill": "$--primary", - "content": "ARCHIVED", - "fontFamily": "Inter", - "fontSize": 9, - "fontWeight": "500" - } - ] - } - ] - }, - { - "type": "frame", - "id": "auInfoR", - "name": "infoRight", - "gap": 12, - "alignItems": "center", - "children": [ - { - "type": "icon_font", - "id": "auISearch", - "width": 16, - "height": 16, - "iconFontName": "magnifying-glass", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "auIGit", - "width": 16, - "height": 16, - "iconFontName": "git-branch", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "auICursor", - "width": 16, - "height": 16, - "iconFontName": "cursor-text", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "auIAI", - "width": 16, - "height": 16, - "iconFontName": "sparkle", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "frame", - "id": "auUnarchiveBtn", - "name": "unarchiveButton", - "gap": 4, - "alignItems": "center", - "stroke": { - "align": "inside", - "thickness": 1, - "fill": "$--primary" - }, - "cornerRadius": 4, - "padding": [ - 2, - 2 - ], - "children": [ - { - "type": "icon_font", - "id": "auIUnarchive", - "width": 16, - "height": 16, - "iconFontName": "arrow-u-up-left", - "iconFontFamily": "phosphor", - "fill": "$--primary" - } - ] - }, - { - "type": "icon_font", - "id": "auITrash", - "width": 16, - "height": 16, - "iconFontName": "trash", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - }, - { - "type": "icon_font", - "id": "auIMore", - "width": 16, - "height": 16, - "iconFontName": "dots-three", - "iconFontFamily": "phosphor", - "fill": "$--muted-foreground" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ghCL1", - "x": 0, - "y": 7320, - "name": "Git History — Commit List", - "width": 300, - "height": "fit_content(600)", - "fill": "$--background", - "cornerRadius": "$--radius-lg", - "stroke": { - "fill": "$--border", - "thickness": 1 - }, - "layout": "vertical", - "gap": 16, - "padding": 12, - "children": [ - { - "type": "text", - "id": "ghCL1h", - "content": "HISTORY", - "fill": "$--muted-foreground", - "fontSize": 10, - "fontWeight": "600", - "letterSpacing": 1.2 - }, - { - "type": "frame", - "id": "ghC1", - "layout": "vertical", - "width": "fill_container", - "gap": 2, - "padding": [ - 0, - 0, - 0, - 10 - ], - "stroke": { - "fill": "$--border", - "thickness": { - "left": 2 - } - }, - "children": [ - { - "type": "frame", - "id": "ghC1r", - "layout": "horizontal", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ghC1h", - "content": "a1b2c3d", - "fill": "$--primary", - "fontSize": 11, - "fontWeight": "500", - "underline": true - }, - { - "type": "text", - "id": "ghC1d", - "content": "2d ago", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - }, - { - "type": "text", - "id": "ghC1m", - "content": "Update grow-newsletter with latest changes", - "fill": "$--secondary-foreground", - "fontSize": 12, - "textGrowth": "fixed-width", - "width": "fill_container" - }, - { - "type": "text", - "id": "ghC1a", - "content": "Luca Rossi", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - }, - { - "type": "frame", - "id": "ghC2", - "layout": "vertical", - "width": "fill_container", - "gap": 2, - "padding": [ - 0, - 0, - 0, - 10 - ], - "stroke": { - "fill": "$--border", - "thickness": { - "left": 2 - } - }, - "children": [ - { - "type": "frame", - "id": "ghC2r", - "layout": "horizontal", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ghC2h", - "content": "e4f5g6h", - "fill": "$--primary", - "fontSize": 11, - "fontWeight": "500", - "underline": true - }, - { - "type": "text", - "id": "ghC2d", - "content": "5d ago", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - }, - { - "type": "text", - "id": "ghC2m", - "content": "Add new section to grow-newsletter", - "fill": "$--secondary-foreground", - "fontSize": 12, - "textGrowth": "fixed-width", - "width": "fill_container" - }, - { - "type": "text", - "id": "ghC2a", - "content": "Luca Rossi", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - }, - { - "type": "frame", - "id": "ghC3", - "layout": "vertical", - "width": "fill_container", - "gap": 2, - "padding": [ - 0, - 0, - 0, - 10 - ], - "stroke": { - "fill": "$--border", - "thickness": { - "left": 2 - } - }, - "children": [ - { - "type": "frame", - "id": "ghC3r", - "layout": "horizontal", - "width": "fill_container", - "justifyContent": "space_between", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ghC3h", - "content": "i7j8k9l", - "fill": "$--primary", - "fontSize": 11, - "fontWeight": "500", - "underline": true - }, - { - "type": "text", - "id": "ghC3d", - "content": "12d ago", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - }, - { - "type": "text", - "id": "ghC3m", - "content": "Create grow-newsletter", - "fill": "$--secondary-foreground", - "fontSize": 12, - "textGrowth": "fixed-width", - "width": "fill_container" - }, - { - "type": "text", - "id": "ghC3a", - "content": "Luca Rossi", - "fill": "$--muted-foreground", - "fontSize": 10 - } - ] - } - ] - }, - { - "type": "frame", - "id": "ghDO1", - "x": 380, - "y": 7320, - "name": "Git History — Diff Open", - "width": 600, - "height": "fit_content(500)", - "fill": "$--background", - "cornerRadius": "$--radius-lg", - "stroke": { - "fill": "$--border", - "thickness": 1 - }, - "layout": "vertical", - "gap": 0, - "padding": 0, - "children": [ - { - "type": "frame", - "id": "ghDObc", - "layout": "horizontal", - "width": "fill_container", - "height": 36, - "padding": [ - 0, - 12 - ], - "gap": 8, - "alignItems": "center", - "fill": "$--muted", - "stroke": { - "fill": "$--border", - "thickness": { - "bottom": 1 - } - }, - "children": [ - { - "type": "text", - "id": "ghDObcP", - "content": "responsibility / grow-newsletter.md", - "fill": "$--muted-foreground", - "fontSize": 12 - }, - { - "type": "frame", - "id": "ghDObcS", - "width": "fill_container", - "height": 1 - }, - { - "type": "frame", - "id": "ghDObcB", - "layout": "horizontal", - "padding": [ - 2, - 8 - ], - "cornerRadius": "$--radius-sm", - "fill": "$--primary", - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ghDObcBt", - "content": "Diff: a1b2c3d", - "fill": "$--primary-foreground", - "fontSize": 10, - "fontWeight": "600" - } - ] - } - ] - }, - { - "type": "frame", - "id": "ghDOb", - "layout": "vertical", - "width": "fill_container", - "padding": 0, - "gap": 0, - "children": [ - { - "type": "frame", - "id": "ghDOl1", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "fill": "$--muted", - "children": [ - { - "type": "text", - "id": "ghDOl1n", - "content": "1", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl1t", - "content": "diff --git a/grow-newsletter.md b/grow-newsletter.md", - "fill": "$--muted-foreground", - "fontSize": 11, - "fontWeight": "600" - } - ] - }, - { - "type": "frame", - "id": "ghDOl2", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "fill": "#2196F30D", - "children": [ - { - "type": "text", - "id": "ghDOl2n", - "content": "2", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl2t", - "content": "@@ -5,3 +5,5 @@", - "fill": "$--primary", - "fontSize": 11, - "fontStyle": "italic" - } - ] - }, - { - "type": "frame", - "id": "ghDOl3", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "children": [ - { - "type": "text", - "id": "ghDOl3n", - "content": "3", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl3t", - "content": " # Grow Newsletter", - "fill": "$--secondary-foreground", - "fontSize": 11 - } - ] - }, - { - "type": "frame", - "id": "ghDOl4", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "fill": "#f4433614", - "children": [ - { - "type": "text", - "id": "ghDOl4n", - "content": "4", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl4t", - "content": "-Old paragraph from before a1b2c3d.", - "fill": "#f44336", - "fontSize": 11 - } - ] - }, - { - "type": "frame", - "id": "ghDOl5", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "fill": "#4caf5014", - "children": [ - { - "type": "text", - "id": "ghDOl5n", - "content": "5", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl5t", - "content": "+Updated paragraph at commit a1b2c3d.", - "fill": "#4caf50", - "fontSize": 11 - } - ] - }, - { - "type": "frame", - "id": "ghDOl6", - "layout": "horizontal", - "width": "fill_container", - "height": 22, - "padding": [ - 0, - 8 - ], - "alignItems": "center", - "fill": "#4caf5014", - "children": [ - { - "type": "text", - "id": "ghDOl6n", - "content": "6", - "fill": "$--muted-foreground", - "fontSize": 11, - "textGrowth": "fixed-width", - "width": 30, - "textAlign": "right" - }, - { - "type": "text", - "id": "ghDOl6t", - "content": "+New content added in this commit.", - "fill": "#4caf50", - "fontSize": 11 - } - ] - } - ] - } - ] - } - ], "themes": { "Mode": [ "Dark" ] }, "variables": { - "--accent": { - "type": "color", - "value": [ - { - "value": "#EBEBEA" - }, - { - "value": "#252545", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-blue": { - "type": "color", - "value": [ - { - "value": "#2383E2" - }, - { - "value": "#4a9eff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#155DFF" - }, - { - "value": "#155DFF", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-foreground": { - "type": "color", - "value": [ - { - "value": "#37352F" - }, - { - "value": "#ffffff", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-green": { - "type": "color", - "value": [ - { - "value": "#0F7B6C" - }, - { - "value": "#4caf50", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#00B38B" - }, - { - "value": "#00B38B", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-orange": { - "type": "color", - "value": [ - { - "value": "#D9730D" - }, - { - "value": "#ff9800", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-purple": { - "type": "color", - "value": [ - { - "value": "#9065B0" - }, - { - "value": "#9c72ff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#A932FF" - }, - { - "value": "#A932FF", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-red": { - "type": "color", - "value": [ - { - "value": "#E03E3E" - }, - { - "value": "#f44336", - "theme": { - "Mode": "Dark" - } - } - ] - }, "--background": { "type": "color", "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#0f0f1a", - "theme": { - "Mode": "Dark" - } - } + { "value": "#FFFFFF" }, + { "value": "#191919", "theme": { "Mode": "Dark" } } ] }, - "--black": { - "type": "color", - "value": "#000000" - }, - "--border": { - "type": "color", - "value": [ - { - "value": "#E9E9E7" - }, - { - "value": "#2a2a4a", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--card": { - "type": "color", - "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#16162a", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--card-foreground": { - "type": "color", - "value": [ - { - "value": "#37352F" - }, - { - "value": "#e0e0e0", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--destructive": { - "type": "color", - "value": [ - { - "value": "#E03E3E" - }, - { - "value": "#f44336", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--destructive-foreground": { - "type": "color", - "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#ffffff", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--font-primary": { - "type": "string", - "value": [ - { - "value": "Inter" - }, - { - "value": "-apple-system, BlinkMacSystemFont, Inter, sans-serif" - }, - { - "value": "Inter" - } - ] - }, - "--font-system": { - "type": "string", - "value": "-apple-system, BlinkMacSystemFont, sans-serif" - }, "--foreground": { "type": "color", "value": [ - { - "value": "#37352F" - }, - { - "value": "#e0e0e0", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--input": { - "type": "color", - "value": [ - { - "value": "#E9E9E7" - }, - { - "value": "#2a2a4a", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--muted": { - "type": "color", - "value": [ - { - "value": "#F0F0EF" - }, - { - "value": "#1e1e3a", - "theme": { - "Mode": "Dark" - } - } + { "value": "#37352F" }, + { "value": "#ffffffcf", "theme": { "Mode": "Dark" } } ] }, "--muted-foreground": { "type": "color", "value": [ - { - "value": "#787774" - }, - { - "value": "#888888", - "theme": { - "Mode": "Dark" - } - } + { "value": "#787774" }, + { "value": "#ffffff71", "theme": { "Mode": "Dark" } } ] }, "--popover": { "type": "color", "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#1e1e3a", - "theme": { - "Mode": "Dark" - } - } + { "value": "#FFFFFF" }, + { "value": "#252525", "theme": { "Mode": "Dark" } } ] }, "--popover-foreground": { "type": "color", "value": [ - { - "value": "#37352F" - }, - { - "value": "#e0e0e0", - "theme": { - "Mode": "Dark" - } - } + { "value": "#37352F" }, + { "value": "#ffffffcf", "theme": { "Mode": "Dark" } } ] }, - "--primary": { + "--border": { "type": "color", "value": [ - { - "value": "#2383E2" - }, - { - "value": "#4a9eff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#155DFF" - }, - { - "value": "#155DFF", - "theme": { - "Mode": "Dark" - } - } + { "value": "#E9E9E7" }, + { "value": "#ffffff18", "theme": { "Mode": "Dark" } } ] }, - "--primary-foreground": { + "--accent-blue": { "type": "color", "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#ffffff", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--radius-lg": { - "type": "number", - "value": 8 - }, - "--radius-md": { - "type": "number", - "value": 6 - }, - "--radius-sm": { - "type": "number", - "value": 4 - }, - "--ring": { - "type": "color", - "value": [ - { - "value": "#2383E2" - }, - { - "value": "#4a9eff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#155DFF" - }, - { - "value": "#155DFF", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--secondary": { - "type": "color", - "value": [ - { - "value": "#EBEBEA" - }, - { - "value": "#2a2a4a", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--secondary-foreground": { - "type": "color", - "value": [ - { - "value": "#37352F" - }, - { - "value": "#e0e0e0", - "theme": { - "Mode": "Dark" - } - } + { "value": "#2383E2" }, + { "value": "#4a9eff", "theme": { "Mode": "Dark" } } ] }, "--sidebar": { "type": "color", "value": [ - { - "value": "#F7F6F3" - }, - { - "value": "#1a1a2e", - "theme": { - "Mode": "Dark" - } - } + { "value": "#F7F7F5" }, + { "value": "#202020", "theme": { "Mode": "Dark" } } ] }, - "--sidebar-accent": { + "--muted": { "type": "color", "value": [ - { - "value": "#EBEBEA" - }, - { - "value": "#252545", - "theme": { - "Mode": "Dark" - } - } + { "value": "#F1F1EF" }, + { "value": "#ffffff0e", "theme": { "Mode": "Dark" } } ] }, - "--sidebar-accent-foreground": { - "type": "color", - "value": [ - { - "value": "#37352F" - }, - { - "value": "#ffffff", - "theme": { - "Mode": "Dark" - } - } - ] + "--font-primary": { + "type": "font", + "value": [{ "value": "Inter" }] }, - "--sidebar-border": { - "type": "color", - "value": [ - { - "value": "#E9E9E7" - }, - { - "value": "#2a2a4a", - "theme": { - "Mode": "Dark" - } - } - ] + "--radius-sm": { + "type": "number", + "value": [{ "value": 4 }] }, - "--sidebar-foreground": { - "type": "color", - "value": [ - { - "value": "#37352F" - }, - { - "value": "#e0e0e0", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--sidebar-primary": { - "type": "color", - "value": [ - { - "value": "#2383E2" - }, - { - "value": "#4a9eff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#155DFF" - }, - { - "value": "#155DFF", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--sidebar-primary-foreground": { - "type": "color", - "value": [ - { - "value": "#FFFFFF" - }, - { - "value": "#ffffff", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--sidebar-ring": { - "type": "color", - "value": [ - { - "value": "#2383E2" - }, - { - "value": "#4a9eff", - "theme": { - "Mode": "Dark" - } - }, - { - "value": "#155DFF" - }, - { - "value": "#155DFF", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--white": { - "type": "color", - "value": "#ffffff" - }, - "--accent-yellow": { - "type": "color", - "value": [ - { - "value": "#F0B100" - }, - { - "value": "#F0B100", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-blue-light": { - "type": "color", - "value": [ - { - "value": "#155DFF14" - }, - { - "value": "#155DFF20", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-green-light": { - "type": "color", - "value": [ - { - "value": "#00B38B14" - }, - { - "value": "#00B38B20", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-purple-light": { - "type": "color", - "value": [ - { - "value": "#A932FF14" - }, - { - "value": "#A932FF20", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-red-light": { - "type": "color", - "value": [ - { - "value": "#E03E3E14" - }, - { - "value": "#f4433620", - "theme": { - "Mode": "Dark" - } - } - ] - }, - "--accent-yellow-light": { - "type": "color", - "value": [ - { - "value": "#F0B10014" - }, - { - "value": "#F0B10020", - "theme": { - "Mode": "Dark" - } - } - ] + "--radius-md": { + "type": "number", + "value": [{ "value": 6 }] } }, - "fonts": [ + "children": [ { - "name": "GT Pressura Trial", - "url": "GT-Pressura-Regular-Trial.otf" + "type": "frame", + "id": "srtDD", + "x": 0, + "y": 0, + "name": "Sort Dropdown — Direction Arrows", + "clip": true, + "width": 260, + "height": 280, + "fill": "$--popover", + "cornerRadius": "$--radius-md", + "stroke": { + "align": "outside", + "thickness": 1, + "fill": "$--border" + }, + "layout": "vertical", + "padding": [8, 0], + "children": [ + { + "type": "frame", + "id": "srtH1", + "name": "dropdownHeader", + "width": "fill_container", + "height": 28, + "padding": [0, 12], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtHL", + "name": "headerLabel", + "content": "Sort by", + "fontSize": 11, + "fontWeight": 600, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary", + "textTransform": "uppercase", + "letterSpacing": 0.5 + } + ] + }, + { + "type": "frame", + "id": "srtR1", + "name": "row-modified", + "width": "fill_container", + "height": 36, + "padding": [0, 12], + "alignItems": "center", + "fill": "$--muted", + "children": [ + { + "type": "text", + "id": "srtT1", + "name": "label-modified", + "content": "Modified", + "fontSize": 13, + "fontWeight": 500, + "fill": "$--popover-foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "frame", + "id": "srtA1", + "name": "arrows-modified", + "gap": 2, + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtU1", + "name": "arrow-up-active", + "content": "↑", + "fontSize": 13, + "fontWeight": 700, + "fill": "$--accent-blue" + }, + { + "type": "text", + "id": "srtD1", + "name": "arrow-down", + "content": "↓", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtR2", + "name": "row-title", + "width": "fill_container", + "height": 36, + "padding": [0, 12], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtT2", + "name": "label-title", + "content": "Title", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--popover-foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "frame", + "id": "srtA2", + "name": "arrows-title", + "gap": 2, + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtU2", + "name": "arrow-up", + "content": "↑", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + }, + { + "type": "text", + "id": "srtD2", + "name": "arrow-down", + "content": "↓", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtR3", + "name": "row-created", + "width": "fill_container", + "height": 36, + "padding": [0, 12], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtT3", + "name": "label-created", + "content": "Created", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--popover-foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "frame", + "id": "srtA3", + "name": "arrows-created", + "gap": 2, + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtU3", + "name": "arrow-up", + "content": "↑", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + }, + { + "type": "text", + "id": "srtD3", + "name": "arrow-down", + "content": "↓", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtR4", + "name": "row-type", + "width": "fill_container", + "height": 36, + "padding": [0, 12], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtT4", + "name": "label-type", + "content": "Type", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--popover-foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "frame", + "id": "srtA4", + "name": "arrows-type", + "gap": 2, + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtU4", + "name": "arrow-up", + "content": "↑", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + }, + { + "type": "text", + "id": "srtD4", + "name": "arrow-down", + "content": "↓", + "fontSize": 13, + "fontWeight": 400, + "fill": "$--muted-foreground" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtSP", + "name": "separator", + "width": "fill_container", + "height": 1, + "fill": "$--border" + }, + { + "type": "frame", + "id": "srtAN", + "name": "annotation", + "width": "fill_container", + "padding": [6, 12], + "children": [ + { + "type": "text", + "id": "srtAT", + "name": "annotation-text", + "content": "Click ↑↓ to toggle direction. Blue = active.", + "fontSize": 11, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtBN", + "x": 300, + "y": 0, + "name": "Sort Button — With Direction Indicator", + "clip": true, + "width": 400, + "height": 200, + "fill": "$--background", + "cornerRadius": "$--radius-md", + "stroke": { + "align": "outside", + "thickness": 1, + "fill": "$--border" + }, + "layout": "vertical", + "padding": [16, 16], + "gap": 16, + "children": [ + { + "type": "frame", + "id": "srtBH", + "name": "noteListHeader", + "width": "fill_container", + "height": 36, + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtBC", + "name": "noteCount", + "content": "42 notes", + "fontSize": 12, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "frame", + "id": "srtBB", + "name": "sortButton", + "padding": [4, 8], + "cornerRadius": "$--radius-sm", + "fill": "$--muted", + "alignItems": "center", + "gap": 4, + "children": [ + { + "type": "text", + "id": "srtBL", + "name": "sortLabel", + "content": "Modified", + "fontSize": 12, + "fontWeight": 500, + "fill": "$--foreground", + "fontFamily": "$--font-primary" + }, + { + "type": "text", + "id": "srtBA", + "name": "directionArrow", + "content": "↓", + "fontSize": 12, + "fontWeight": 600, + "fill": "$--accent-blue" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtSP2", + "name": "divider", + "width": "fill_container", + "height": 1, + "fill": "$--border" + }, + { + "type": "frame", + "id": "srtEX", + "name": "exampleNotes", + "width": "fill_container", + "layout": "vertical", + "gap": 2, + "children": [ + { + "type": "frame", + "id": "srtN1", + "name": "noteRow1", + "width": "fill_container", + "height": 32, + "padding": [0, 8], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtNT1", + "name": "noteTitle1", + "content": "Meeting Notes — Feb 22", + "fontSize": 13, + "fill": "$--foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "text", + "id": "srtND1", + "name": "noteDate1", + "content": "2 min ago", + "fontSize": 11, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary" + } + ] + }, + { + "type": "frame", + "id": "srtN2", + "name": "noteRow2", + "width": "fill_container", + "height": 32, + "padding": [0, 8], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtNT2", + "name": "noteTitle2", + "content": "Project Roadmap", + "fontSize": 13, + "fill": "$--foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "text", + "id": "srtND2", + "name": "noteDate2", + "content": "1 hr ago", + "fontSize": 11, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary" + } + ] + }, + { + "type": "frame", + "id": "srtN3", + "name": "noteRow3", + "width": "fill_container", + "height": 32, + "padding": [0, 8], + "alignItems": "center", + "children": [ + { + "type": "text", + "id": "srtNT3", + "name": "noteTitle3", + "content": "Weekly Review", + "fontSize": 13, + "fill": "$--foreground", + "fontFamily": "$--font-primary", + "width": "fill_container" + }, + { + "type": "text", + "id": "srtND3", + "name": "noteDate3", + "content": "Yesterday", + "fontSize": 11, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary" + } + ] + } + ] + }, + { + "type": "frame", + "id": "srtAN2", + "name": "annotation", + "width": "fill_container", + "padding": [6, 0], + "children": [ + { + "type": "text", + "id": "srtAT2", + "name": "annotation-text", + "content": "Sort button shows property + direction arrow. Click to open dropdown.", + "fontSize": 11, + "fill": "$--muted-foreground", + "fontFamily": "$--font-primary" + } + ] + } + ] } ] } \ No newline at end of file