davidl/tolaria
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
ca507f67962157fae716faee98d69754cacda4e2
tolaria/ui-design.pen
lucaronin 8a17421000 chore: update ui-design.pen
2026-04-01 11:14:57 +02:00

14919 lines
503 KiB
Plaintext
Raw Blame History

{
"version": "2.9",
"children": [
{
"type": "frame",
"id": "sec1_hdr",
"x": 0,
"y": 0,
"name": "1 — Foundations",
"theme": {
"Mode": "Light"
},
"width": 1440,
"height": 60,
"fill": "$--foreground",
"padding": [
0,
60
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "sec1_hdr_lbl",
"fill": "$--background",
"content": "1 — FOUNDATIONS",
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "700",
"letterSpacing": 2
}
]
},
{
"type": "frame",
"id": "mOf4J",
"x": 0,
"y": 100,
"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": 1004,
"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": "ds_spacing",
"x": 0,
"y": 2369,
"name": "Spacing Scale",
"theme": {
"Mode": "Light"
},
"width": 700,
"fill": "$--background",
"layout": "vertical",
"gap": 24,
"padding": 40,
"children": [
{
"type": "text",
"id": "ds_sp_title",
"fill": "$--foreground",
"content": "Spacing Scale",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "600"
},
{
"type": "text",
"id": "ds_sp_sub",
"fill": "$--muted-foreground",
"content": "Consistent spacing tokens used throughout the app.",
"lineHeight": 1.5,
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "sp_xs",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_xs_box",
"fill": "$--primary",
"width": 4,
"height": 24
},
{
"type": "text",
"id": "sp_xs_lbl",
"fill": "$--foreground",
"content": "--spacing-xs: 4px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_sm",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_sm_box",
"fill": "$--primary",
"width": 8,
"height": 24
},
{
"type": "text",
"id": "sp_sm_lbl",
"fill": "$--foreground",
"content": "--spacing-sm: 8px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_md",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_md_box",
"fill": "$--primary",
"width": 12,
"height": 24
},
{
"type": "text",
"id": "sp_md_lbl",
"fill": "$--foreground",
"content": "--spacing-md: 12px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_lg",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_lg_box",
"fill": "$--primary",
"width": 16,
"height": 24
},
{
"type": "text",
"id": "sp_lg_lbl",
"fill": "$--foreground",
"content": "--spacing-lg: 16px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_xl",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_xl_box",
"fill": "$--primary",
"width": 24,
"height": 24
},
{
"type": "text",
"id": "sp_xl_lbl",
"fill": "$--foreground",
"content": "--spacing-xl: 24px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_2xl",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_2xl_box",
"fill": "$--primary",
"width": 32,
"height": 24
},
{
"type": "text",
"id": "sp_2xl_lbl",
"fill": "$--foreground",
"content": "--spacing-2xl: 32px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "sp_3xl",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": 2,
"id": "sp_3xl_box",
"fill": "$--primary",
"width": 40,
"height": 24
},
{
"type": "text",
"id": "sp_3xl_lbl",
"fill": "$--foreground",
"content": "--spacing-3xl: 40px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ds_heights",
"x": 740,
"y": 2369,
"name": "Height Variables",
"theme": {
"Mode": "Light"
},
"width": 700,
"fill": "$--background",
"layout": "vertical",
"gap": 24,
"padding": 40,
"children": [
{
"type": "text",
"id": "ds_ht_title",
"fill": "$--foreground",
"content": "Height Variables",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "600"
},
{
"type": "text",
"id": "ds_ht_sub",
"fill": "$--muted-foreground",
"content": "Fixed heights for key layout regions.",
"lineHeight": 1.5,
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ht_titlebar",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_titlebar_bar",
"fill": "$--sidebar",
"width": 120,
"height": 38,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_titlebar_lbl",
"fill": "$--foreground",
"content": "--height-titlebar: 38px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ht_tabbar",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_tabbar_bar",
"fill": "$--sidebar",
"width": 120,
"height": 45,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_tabbar_lbl",
"fill": "$--foreground",
"content": "--height-tabbar: 45px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ht_breadcrumb",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_breadcrumb_bar",
"fill": "$--background",
"width": 120,
"height": 45,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_breadcrumb_lbl",
"fill": "$--foreground",
"content": "--height-breadcrumb: 45px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ht_statusbar",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_statusbar_bar",
"fill": "$--sidebar",
"width": 120,
"height": 30,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_statusbar_lbl",
"fill": "$--foreground",
"content": "--height-statusbar: 30px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ht_modal_header",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_modal_header_bar",
"fill": "$--background",
"width": 120,
"height": 56,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_modal_header_lbl",
"fill": "$--foreground",
"content": "--height-modal-header: 56px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ht_inspector_header",
"width": "fill_container",
"gap": 16,
"alignItems": "center",
"children": [
{
"type": "rectangle",
"cornerRadius": "$--radius-sm",
"id": "ht_inspector_header_bar",
"fill": "$--background",
"width": 120,
"height": 36,
"stroke": {
"thickness": 1,
"fill": "$--border"
}
},
{
"type": "text",
"id": "ht_inspector_header_lbl",
"fill": "$--foreground",
"content": "--height-inspector-header: 36px",
"fontFamily": "IBM Plex Mono",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ds_shadows",
"x": 0,
"y": 2951,
"name": "Shadows",
"theme": {
"Mode": "Light"
},
"width": 700,
"fill": "$--background",
"layout": "vertical",
"gap": 32,
"padding": 40,
"children": [
{
"type": "text",
"id": "ds_sh_title",
"fill": "$--foreground",
"content": "Shadows",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "600"
},
{
"type": "text",
"id": "ds_sh_sub",
"fill": "$--muted-foreground",
"content": "Elevation levels for cards, modals, and popovers.",
"lineHeight": 1.5,
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "sh_sm",
"width": "fill_container",
"gap": 24,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "sh_sm_box",
"width": 120,
"height": 80,
"fill": "$--card",
"cornerRadius": "$--radius-lg",
"effect": {
"type": "shadow",
"shadowType": "outer",
"color": "#0000000D",
"offset": {
"x": 0,
"y": 1
},
"blur": 2
}
},
{
"type": "frame",
"id": "sh_sm_info",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "sh_sm_name",
"fill": "$--foreground",
"content": "Shadow SM",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "text",
"id": "sh_sm_desc",
"fill": "$--muted-foreground",
"content": "0 1px 2px rgba(0,0,0,0.05)",
"fontFamily": "IBM Plex Mono",
"fontSize": 11,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "sh_md",
"width": "fill_container",
"gap": 24,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "sh_md_box",
"width": 120,
"height": 80,
"fill": "$--card",
"cornerRadius": "$--radius-lg",
"effect": {
"type": "shadow",
"shadowType": "outer",
"color": "#00000012",
"offset": {
"x": 0,
"y": 4
},
"blur": 6
}
},
{
"type": "frame",
"id": "sh_md_info",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "sh_md_name",
"fill": "$--foreground",
"content": "Shadow MD",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "text",
"id": "sh_md_desc",
"fill": "$--muted-foreground",
"content": "0 4px 6px rgba(0,0,0,0.07)",
"fontFamily": "IBM Plex Mono",
"fontSize": 11,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "sh_lg",
"width": "fill_container",
"gap": 24,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "sh_lg_box",
"width": 120,
"height": 80,
"fill": "$--card",
"cornerRadius": "$--radius-lg",
"effect": {
"type": "shadow",
"shadowType": "outer",
"color": "#0000001A",
"offset": {
"x": 0,
"y": 10
},
"blur": 15
}
},
{
"type": "frame",
"id": "sh_lg_info",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "text",
"id": "sh_lg_name",
"fill": "$--foreground",
"content": "Shadow LG",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "text",
"id": "sh_lg_desc",
"fill": "$--muted-foreground",
"content": "0 10px 15px rgba(0,0,0,0.1)",
"fontFamily": "IBM Plex Mono",
"fontSize": 11,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "sec2_hdr",
"x": 0,
"y": 3543,
"name": "2 — Components",
"theme": {
"Mode": "Light"
},
"width": 1440,
"height": 60,
"fill": "$--foreground",
"padding": [
0,
60
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "sec2_hdr_lbl",
"fill": "$--background",
"content": "2 — COMPONENTS",
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "700",
"letterSpacing": 2
}
]
},
{
"type": "text",
"id": "sub_atoms",
"x": -100,
"y": 3633,
"theme": {
"Mode": "Light"
},
"fill": "$--muted-foreground",
"content": "ATOMS",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600",
"letterSpacing": 1
},
{
"type": "frame",
"id": "comp_StatusDot",
"x": 0,
"y": 3660,
"name": "component/StatusDot",
"theme": {
"Mode": "Light"
},
"reusable": true,
"children": [
{
"type": "ellipse",
"id": "StatusDot_dot",
"fill": "$--accent-orange",
"width": 6,
"height": 6
}
]
},
{
"type": "frame",
"id": "comp_Separator",
"x": 100,
"y": 3660,
"name": "component/Separator",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(200)",
"height": 1,
"fill": "$--border"
},
{
"type": "frame",
"id": "comp_Badge",
"x": 400,
"y": 3660,
"name": "component/Badge",
"theme": {
"Mode": "Light"
},
"reusable": true,
"fill": "$--accent-blue-light",
"cornerRadius": 12,
"padding": [
2,
8
],
"children": [
{
"type": "text",
"id": "Badge_label",
"fill": "$--accent-blue",
"content": "Badge",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "comp_ButtonPrimary",
"x": 0,
"y": 3700,
"name": "component/Button/Primary",
"theme": {
"Mode": "Light"
},
"reusable": true,
"height": 36,
"fill": "$--primary",
"cornerRadius": "$--radius-md",
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "BtnPri_label",
"fill": "$--primary-foreground",
"content": "Button",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "sec3_hdr",
"x": 0,
"y": 5000,
"name": "3 — Full Layouts",
"theme": {
"Mode": "Light"
},
"width": 1440,
"height": 60,
"fill": "$--foreground",
"padding": [
0,
60
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "sec3_hdr_lbl",
"fill": "$--background",
"content": "3 — FULL LAYOUTS",
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "700",
"letterSpacing": 2
}
]
},
{
"type": "frame",
"id": "comp_ButtonSecondary",
"x": 200,
"y": 3700,
"name": "component/Button/Secondary",
"theme": {
"Mode": "Light"
},
"reusable": true,
"height": 36,
"fill": "$--secondary",
"cornerRadius": "$--radius-md",
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "BtnSec_label",
"fill": "$--secondary-foreground",
"content": "Button",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "comp_ButtonGhost",
"x": 400,
"y": 3700,
"name": "component/Button/Ghost",
"theme": {
"Mode": "Light"
},
"reusable": true,
"height": 36,
"cornerRadius": "$--radius-md",
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "BtnGho_label",
"fill": "$--foreground",
"content": "Button",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "comp_Input",
"x": 0,
"y": 3750,
"name": "component/Input",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": 240,
"height": 36,
"fill": "$--background",
"cornerRadius": "$--radius-md",
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--input"
},
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "Input_placeholder",
"fill": "$--muted-foreground",
"content": "Placeholder...",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "comp_IconButton",
"x": 300,
"y": 3750,
"name": "component/IconButton",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": 28,
"height": 28,
"cornerRadius": "$--radius-sm",
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "IconBtn_icon",
"width": 16,
"height": 16,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
},
{
"type": "text",
"id": "sub_molecules",
"x": -145,
"y": 3810,
"theme": {
"Mode": "Light"
},
"fill": "$--muted-foreground",
"content": "MOLECULES",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600",
"letterSpacing": 1
},
{
"type": "frame",
"id": "comp_CommandPaletteItem",
"x": 550,
"y": 4010,
"name": "component/CommandPaletteItem",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(460)",
"height": 40,
"cornerRadius": "$--radius-md",
"gap": 12,
"padding": [
0,
16
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "CPI_icon",
"width": 16,
"height": 16,
"iconFontName": "file-text",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "frame",
"id": "CPI_content",
"width": "fill_container",
"layout": "vertical",
"gap": 2,
"children": [
{
"type": "text",
"id": "CPI_title",
"fill": "$--foreground",
"content": "Command Name",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "text",
"id": "CPI_shortcut",
"fill": "$--muted-foreground",
"content": "⌘K",
"fontFamily": "IBM Plex Mono",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "HGjqA",
"x": 0,
"y": 5100,
"name": "Full Layout",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 1440,
"height": 900,
"fill": "$--background",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "YCRX1",
"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": "Eoho0",
"name": "trafficLights",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "gquvn",
"name": "closeBtn",
"fill": "$--traffic-red",
"width": 12,
"height": 12
},
{
"type": "ellipse",
"id": "OCr9S",
"name": "minimizeBtn",
"fill": "$--traffic-yellow",
"width": 12,
"height": 12
},
{
"type": "ellipse",
"id": "RObvD",
"name": "maximizeBtn",
"fill": "$--traffic-green",
"width": 12,
"height": 12
}
]
}
]
},
{
"type": "frame",
"id": "G346h",
"name": "Content",
"width": "fill_container",
"height": "fill_container",
"children": [
{
"type": "frame",
"id": "sXONu",
"name": "sbRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 250,
"height": "fill_container",
"fill": "$--sidebar",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--sidebar-border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "6XWoI",
"name": "Filters",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"layout": "vertical",
"gap": 1,
"padding": [
8,
8,
16,
8
],
"children": [
{
"id": "Adt7o",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"fill": "$--accent-blue-light",
"name": "f1",
"height": "fit_content",
"x": 8,
"y": 8,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "tray-fill",
"fill": "$--primary"
},
"gzPe9": {
"content": "Inbox",
"fill": "$--primary",
"fontWeight": "600",
"x": 26
},
"v96mi": {
"fill": "$--primary",
"width": "fit_content",
"x": 193,
"y": 6
},
"5hore": {
"content": "24",
"fill": "$--primary-foreground",
"x": 6,
"y": 4
}
}
},
{
"id": "Iydl4",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f2",
"height": "fit_content",
"x": 8,
"y": 41,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "cardholder"
},
"gzPe9": {
"content": "All Notes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "6",
"x": 6,
"y": 4
}
}
},
{
"id": "ZOoXW",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f3",
"height": "fit_content",
"x": 8,
"y": 74,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "trash"
},
"gzPe9": {
"content": "Archive",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "2",
"x": 6,
"y": 4
}
}
},
{
"id": "tZnon",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f4",
"height": "fit_content",
"x": 8,
"y": 107,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "git-branch"
},
"gzPe9": {
"content": "Changes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "3",
"x": 6,
"y": 4
}
}
}
]
},
{
"type": "frame",
"id": "moSnd",
"name": "Sections",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
8,
0
],
"children": [
{
"type": "frame",
"id": "6WO0x",
"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": [
{
"id": "a1uoj",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s1",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "wrench",
"fill": "$--accent-red"
},
"TB6OW": {
"content": "Projects",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-down",
"x": 208,
"y": 8
}
}
},
{
"type": "frame",
"id": "gqehb",
"name": "projItem1",
"width": "fill_container",
"fill": "$--accent-red-light",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "r0fdT",
"name": "proj1Txt",
"fill": "$--accent-red",
"content": "Laputa App",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "Bo0yl",
"name": "projItem2",
"width": "fill_container",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "KZTj7",
"name": "proj2Txt",
"fill": "$--muted-foreground",
"content": "Portfolio Rewrite",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "vBQEA",
"name": "projItem3",
"width": "fill_container",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ap4Oo",
"name": "proj3Txt",
"fill": "$--muted-foreground",
"content": "AI Habit Tracker",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "78uPE",
"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": [
{
"id": "39Vyr",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s2",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "medal",
"fill": "$--accent-purple"
},
"TB6OW": {
"content": "Responsibilities",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "Jp74g",
"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": [
{
"id": "1sDOm",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s3",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "arrows-clockwise",
"fill": "$--accent-purple"
},
"TB6OW": {
"content": "Procedures",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "KUQZr",
"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": [
{
"id": "Ssx4P",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s4",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "users",
"fill": "$--accent-yellow"
},
"TB6OW": {
"content": "People",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "uKXTs",
"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": [
{
"id": "aqMYC",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s5",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "calendar-blank",
"fill": "$--accent-yellow"
},
"TB6OW": {
"content": "Events",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "gwuHB",
"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": [
{
"id": "VdQCY",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s6",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "tag",
"fill": "$--accent-green"
},
"TB6OW": {
"content": "Topics",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "oRaOh",
"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": [
{
"id": "Nrcw4",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s7",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "leaf",
"fill": "$--accent-green"
},
"TB6OW": {
"content": "Notes",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
},
{
"type": "frame",
"id": "iHbwB",
"name": "eventsHeader",
"width": "fill_container",
"cornerRadius": 4,
"gap": 8,
"padding": [
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "1Nnj1",
"name": "leftEvents",
"gap": 8,
"padding": [
8,
0
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "8r9iD",
"name": "eventsIcon",
"width": 18,
"height": 18,
"iconFontName": "plus",
"iconFontFamily": "phosphor",
"weight": 700,
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "uH8wP",
"name": "eventsLbl",
"fill": "$--muted-foreground",
"content": "Create new type",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "x6ej7",
"name": "Commit Area",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"layout": "vertical",
"padding": 12,
"children": [
{
"type": "frame",
"id": "Q2Qse",
"name": "commitBtn",
"width": "fill_container",
"fill": "$--primary",
"cornerRadius": 6,
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "PB7LZ",
"name": "commitIcon",
"width": 14,
"height": 14,
"iconFontName": "git-commit-horizontal",
"iconFontFamily": "lucide",
"fill": "$--primary-foreground"
},
{
"type": "text",
"id": "x4LQB",
"name": "commitTxt",
"fill": "$--primary-foreground",
"content": "Commit & Push",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
},
{
"type": "frame",
"id": "QoHxC",
"name": "commitBadge",
"height": 18,
"fill": "$--white-overlay",
"cornerRadius": 9,
"padding": [
0,
5
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "UGPa6",
"name": "commitBadgeTxt",
"fill": "$--white",
"content": "3",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600"
}
]
}
]
}
]
}
]
},
{
"type": "rectangle",
"id": "ZX2Ep",
"name": "Resize Handle",
"fill": "$--border",
"width": 1,
"height": "fill_container"
},
{
"type": "frame",
"id": "kg64a",
"name": "nlRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 300,
"height": "fill_container",
"fill": "$--card",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "g1Xx8",
"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": "E2PMl",
"name": "nlTitle",
"fill": "$--foreground",
"content": "Laputa App",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "frame",
"id": "Nicze",
"name": "nlActions",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "4flgj",
"name": "searchIcon",
"width": 16,
"height": 16,
"iconFontName": "magnifying-glass",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "bjE7B",
"name": "plusIcon",
"width": 16,
"height": 16,
"iconFontName": "plus",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "frame",
"id": "dAve2",
"name": "Note Items",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "7EI7z",
"name": "Backlinks Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "s7pSH",
"name": "Note Item Selected",
"width": "fill_container",
"fill": "$--accent-red-light",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"children": [
{
"type": "rectangle",
"id": "Tw96Y",
"name": "leftAccent",
"fill": "$--accent-red",
"width": 3,
"height": "fill_container"
},
{
"id": "LL68d",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "#00000000"
},
"gap": 6,
"name": "nsel",
"height": "fit_content",
"x": 3,
"y": 0,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Laputa App",
"fontWeight": "600"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "wrench",
"fill": "$--accent-red",
"x": 251,
"y": 1
},
"vm86r": {
"content": "Personal knowledge and life management desktop app...",
"width": "fill_container",
"x": 16,
"y": 36
}
}
}
]
}
]
},
{
"type": "frame",
"id": "T0Hb7",
"name": "Related Notes Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "dGaln",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h1",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Related Notes"
},
"Yh4xV": {
"content": "2",
"x": 80
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "gXVkg",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n1",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Portfolio Rewrite"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Redesigning portfolio site with modern stack and updated visual language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "m12d1",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n2",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Sample note 2"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
},
{
"type": "frame",
"id": "cvZGr",
"name": "Events Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "Ranhf",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h2",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Events"
},
"Yh4xV": {
"content": "2",
"x": 42
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "CR1KI",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n3",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Grant"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "q0onl",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n4",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Matteo"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
}
]
},
{
"type": "frame",
"id": "jmDLa",
"name": "Filter Pills Bar",
"width": "fill_container",
"fill": {
"type": "gradient",
"gradientType": "linear",
"enabled": true,
"rotation": 0,
"size": {
"height": 1
},
"colors": [
{
"color": "#FFFFFF00",
"position": 0
},
{
"color": "#FFFFFFEE",
"position": 0.3
},
{
"color": "#FFFFFFFF",
"position": 1
}
]
},
"gap": 8,
"padding": [
12,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "B58ZN",
"name": "Pill Week",
"fill": "$--accent-blue-light",
"cornerRadius": 9999,
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "Le2xa",
"name": "label",
"fill": "$--primary",
"content": "Week",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "DLM4M",
"name": "count",
"opacity": 0.7,
"fill": "$--primary",
"content": "12",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "QjCQw",
"name": "Pill Quarter",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "snyrx",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Quarter",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "xNwu8",
"name": "count",
"fill": "$--muted-foreground",
"content": "34",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "T8iNb",
"name": "Pill Year",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "EoZI3",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Year",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "Ikw48",
"name": "count",
"fill": "$--muted-foreground",
"content": "86",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
}
]
}
]
},
{
"type": "rectangle",
"id": "at42h",
"name": "Resize Handle 2",
"fill": "$--border",
"width": 1,
"height": "fill_container"
},
{
"type": "frame",
"id": "suVcE",
"name": "Panel: Editor",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"fill": "$--background",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "fmpg5",
"name": "Editor Body",
"width": "fill_container",
"height": "fill_container",
"children": [
{
"type": "frame",
"id": "GXuX5",
"name": "edRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"children": [
{
"id": "owWlH",
"type": "ref",
"ref": "ABj4R",
"width": "fill_container",
"name": "ib",
"y": 0,
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
}
},
"descendants": {
"tahyf": {
"x": 16,
"y": 22.5
},
"LxtfH": {
"width": "fit_content",
"height": "fit_content",
"x": 484,
"y": 14.5
},
"S0HhS": {
"x": 28
},
"RMnGX": {
"x": 56
},
"Roqzk": {
"x": 84
},
"QWemM": {
"x": 112
}
}
},
{
"type": "frame",
"id": "CNdHe",
"name": "Editor Content",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 16,
"padding": [
32,
64
],
"children": [
{
"type": "frame",
"id": "OqYDF",
"name": "titleRow",
"width": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "VKJX1",
"name": "noteH1",
"fill": "$--foreground",
"content": "🗓️ Laputa App",
"lineHeight": 1.2,
"fontFamily": "Inter Tight",
"fontSize": 36,
"fontWeight": "700"
}
]
},
{
"type": "rectangle",
"id": "2OfYK",
"name": "titleSeparator",
"fill": "$--border",
"width": "fill_container",
"height": 1
},
{
"type": "text",
"id": "p25wy",
"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": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "KMqPj",
"name": "editorH2",
"fill": "$--foreground",
"content": "Architecture",
"lineHeight": 1.3,
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "600"
},
{
"type": "text",
"id": "3o3gt",
"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": 15,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "mxEx0",
"name": "insRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 260,
"height": "fill_container",
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"left": 1
},
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "DFthW",
"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": "AfG5c",
"name": "leftGroup",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "U2m2E",
"name": "propIcon",
"width": 16,
"height": 16,
"iconFontName": "sliders",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "OVXRQ",
"name": "inspTitle",
"fill": "$--muted-foreground",
"content": "Properties",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "600"
}
]
},
{
"type": "icon_font",
"id": "DaUvC",
"name": "sidebarIcon",
"width": 16,
"height": 16,
"iconFontName": "x",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "65WNg",
"name": "Inspector Body",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
12,
0
],
"children": [
{
"type": "frame",
"id": "dhE7n",
"name": "Section Group 1",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
0,
12,
20,
12
],
"children": [
{
"type": "frame",
"id": "TdPVi",
"name": "Properties Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"id": "0Dx4R",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p1",
"height": "fit_content",
"x": 0,
"y": 0,
"descendants": {
"SS4ef": {
"content": "Type",
"y": 3
},
"lKjFb": {
"type": "frame",
"id": "M0hAz",
"name": "newChip",
"fill": "$--accent-red-light",
"cornerRadius": 4,
"gap": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "g3MKg",
"name": "chipIco",
"width": 12,
"height": 12,
"iconFontName": "wrench",
"iconFontFamily": "phosphor",
"fill": "$--accent-red"
},
{
"type": "text",
"id": "I6AZ7",
"name": "chipTxt",
"fill": "$--accent-red",
"content": "Project",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "gaem6",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p2",
"height": "fit_content",
"x": 0,
"y": 29,
"descendants": {
"SS4ef": {
"content": "Status",
"y": 3
},
"lKjFb": {
"type": "frame",
"id": "6LXwV",
"name": "statusChip",
"fill": "$--accent-green-light",
"cornerRadius": 4,
"gap": 6,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "xPlRa",
"name": "statusDot",
"fill": "$--accent-green",
"width": 6,
"height": 6
},
{
"type": "text",
"id": "YVwUM",
"name": "statusTxt",
"fill": "$--accent-green",
"content": "Active",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "K8j7m",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p3",
"height": "fit_content",
"x": 0,
"y": 58,
"descendants": {
"SS4ef": {
"content": "Date",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 142
},
"38JOz": {
"content": "Mar 23, 2026",
"x": 8,
"y": 3
}
}
},
{
"id": "W2ddA",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p4",
"height": "fit_content",
"x": 0,
"y": 87,
"descendants": {
"SS4ef": {
"content": "URL",
"y": 3
},
"lKjFb": {
"fill": "transparent",
"width": "fit_content",
"height": "fit_content",
"x": 131
},
"38JOz": {
"content": "acme.dev/docs",
"fill": "$--primary",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "LICOf",
"name": "propArchived",
"width": "fill_container",
"height": 21,
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "7NoVl",
"name": "propArchivedLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "QNZYV",
"name": "archivedTxt",
"fill": "$--muted-foreground",
"content": "Archived",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "yC8oO",
"name": "propArchivedToggle",
"width": 15,
"height": 15,
"fill": "$--background",
"cornerRadius": 3,
"stroke": {
"align": "inside",
"thickness": 1.5,
"fill": "$--border"
}
}
]
},
{
"type": "frame",
"id": "oeTN7",
"name": "propTags",
"width": "fill_container",
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "espYX",
"name": "propTagsLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "fE8Ci",
"name": "tagsTxt",
"fill": "$--muted-foreground",
"content": "Tags",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "NU5Hy",
"name": "propTagsChips",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "TVhVX",
"name": "tagChip1",
"fill": "$--accent-purple-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "pazIy",
"name": "tag1txt",
"fill": "$--accent-purple",
"content": "v2",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "KHA4r",
"name": "tagChip2",
"fill": "$--accent-orange-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "XrZgQ",
"name": "tag2txt",
"fill": "$--accent-orange",
"content": "docs",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
]
}
]
},
{
"id": "Ziiwa",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p5",
"height": "fit_content",
"x": 0,
"y": 174,
"descendants": {
"SS4ef": {
"content": "Author",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 192
},
"38JOz": {
"content": "Luca",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "NPt9L",
"name": "addPropRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "CbnWB",
"name": "addIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "nkTdr",
"name": "addTxt",
"opacity": 0.5,
"rotation": -0.43548563406852797,
"fill": "$--muted-foreground",
"content": "Add property",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ebmG7",
"name": "Relationships Section",
"width": "fill_container",
"layout": "vertical",
"gap": 16,
"children": [
{
"type": "frame",
"id": "cQrBv",
"name": "relGroup1",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "XB87G",
"name": "relGrp1Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "QwKXS",
"name": "belongsIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "W4Dkw",
"name": "belongsTxt",
"fill": "$--muted-foreground",
"content": "Belongs to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "9X0Of",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r1",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Laputa",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"id": "KRI2c",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r2",
"height": "fit_content",
"x": 0,
"y": 50,
"descendants": {
"OTLK6": {
"content": "Building",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "ZymwB",
"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": "j7K2C",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "sa21a",
"name": "relGroup2",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "AMBrj",
"name": "relGrp2Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "8Qgyf",
"name": "relatedIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "JKpHv",
"name": "relatedTxt",
"fill": "$--muted-foreground",
"content": "Related to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "U8dBf",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"fill": "$--accent-red-light",
"name": "r3",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Shadcn Migration",
"fill": "$--accent-red",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "flask",
"fill": "$--accent-red",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "DoMDz",
"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": "0c3FL",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "aJxyl",
"name": "addRelRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "v2Taw",
"name": "addRelIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "g6CqN",
"name": "addRelTxt",
"opacity": 0.5,
"fill": "$--muted-foreground",
"content": "Add relationship",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"id": "euAlL",
"type": "ref",
"ref": "comp_Separator",
"name": "sep1",
"width": "fill_container",
"x": 0,
"y": 502.577211185393
},
{
"type": "frame",
"id": "xQOQu",
"name": "Section Group 2",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12
],
"children": [
{
"type": "frame",
"id": "kNPfM",
"name": "Backlinks Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "s6enj",
"name": "blTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "fIGDr",
"name": "blTitleTxt",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "gRi8d",
"name": "blIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-down-left",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "y7qWL",
"name": "blTxt",
"fill": "$--muted-foreground",
"content": "Backlinks",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "text",
"id": "G2YoR",
"name": "blItem1",
"fill": "$--primary",
"content": "Portfolio Rewrite",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "45DYM",
"name": "blItem2",
"fill": "$--primary",
"content": "Meeting with Grant",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "gozsE",
"name": "blItem3",
"fill": "$--primary",
"content": "Q1 Planning",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"id": "xs6er",
"type": "ref",
"ref": "comp_Separator",
"name": "sep2",
"width": "fill_container",
"x": 0,
"y": 627.577211185393
},
{
"type": "frame",
"id": "911LP",
"name": "Section Group 3",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12,
0,
12
],
"children": [
{
"type": "frame",
"id": "YzDqX",
"name": "History Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "oglDy",
"name": "histTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "76jjZ",
"name": "histIco",
"width": 12,
"height": 12,
"iconFontName": "clock-counter-clockwise",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "zOdWG",
"name": "histTxt",
"fill": "$--muted-foreground",
"content": "History",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ati3l",
"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": "85GOy",
"name": "histItem1Hash",
"fill": "$--accent-blue",
"content": "a089f44 · feat: migrate to shadcn/ui",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "XeIaw",
"name": "histItem1Date",
"fill": "$--muted-foreground",
"content": "Feb 16, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wLtzW",
"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": "lwvz5",
"name": "histItem2Hash",
"fill": "$--accent-blue",
"content": "5a4b4ac · feat: emoji favicon",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "XdIN3",
"name": "histItem2Date",
"fill": "$--muted-foreground",
"content": "Feb 15, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "Vzpxw",
"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": "j9Z1R",
"name": "Status Left",
"height": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "CK3yB",
"name": "versionIcon",
"width": 14,
"height": 14,
"iconFontName": "box",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "TVv4s",
"name": "versionText",
"fill": "$--muted-foreground",
"content": "v0.4.2",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "500"
},
{
"type": "text",
"id": "xIZO3",
"name": "sep1",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "51IE0",
"name": "branchIcon",
"width": 14,
"height": 14,
"iconFontName": "git-branch",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "ZTFnJ",
"name": "branchText",
"fill": "$--muted-foreground",
"content": "main",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "VxnS4",
"name": "sep2",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "NvcOz",
"name": "syncIcon",
"width": 13,
"height": 13,
"iconFontName": "refresh-cw",
"iconFontFamily": "lucide",
"fill": "$--accent-green"
},
{
"type": "text",
"id": "noitj",
"name": "syncText",
"fill": "$--muted-foreground",
"content": "Synced 2m ago",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "3CsbD",
"name": "Status Right",
"height": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "NcaRa",
"name": "aiIcon",
"width": 13,
"height": 13,
"iconFontName": "sparkles",
"iconFontFamily": "lucide",
"fill": "$--accent-purple"
},
{
"type": "text",
"id": "cqybL",
"name": "aiText",
"fill": "$--muted-foreground",
"content": "Claude Sonnet 4",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "h7Rgs",
"name": "sep3",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "7kbAi",
"name": "notesCount",
"width": 13,
"height": 13,
"iconFontName": "file-text",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "GNqBk",
"name": "notesText",
"fill": "$--muted-foreground",
"content": "1,247 notes",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "lSPMZ",
"name": "sep4",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "z2xrF",
"name": "bellIcon",
"width": 13,
"height": 13,
"iconFontName": "bell",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "SSnLP",
"name": "settingsIcon",
"width": 13,
"height": 13,
"iconFontName": "settings",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
}
]
}
]
},
{
"type": "text",
"id": "fg_modals_and_settings",
"x": 0,
"y": 6176,
"theme": {
"Mode": "Light"
},
"fill": "$--muted-foreground",
"content": "MODALS & SETTINGS",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600",
"letterSpacing": 1
},
{
"type": "frame",
"id": "iogBH",
"x": 0,
"y": 6206,
"name": "Settings Panel — Modal",
"theme": {
"Mode": "Light"
},
"width": 520,
"fill": "$--background",
"cornerRadius": 12,
"stroke": {
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "61XqC",
"name": "Header",
"width": "fill_container",
"height": 56,
"stroke": {
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "2IAX7",
"name": "Title",
"fill": "$--foreground",
"content": "Settings",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600"
},
{
"type": "icon_font",
"id": "kIGy9",
"name": "Close Icon",
"width": 16,
"height": 16,
"iconFontName": "x",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "Jk6ga",
"name": "Body",
"width": "fill_container",
"layout": "vertical",
"gap": 24,
"padding": 24,
"children": [
{
"type": "text",
"id": "efWNx",
"name": "Section Label",
"fill": "$--foreground",
"content": "AI Provider Keys",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "600"
},
{
"type": "text",
"id": "wYQL5",
"name": "Section Description",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "API keys are stored locally on your device. Never sent to our servers.",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "lo4r8",
"name": "Anthropic Key Row",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "WogRV",
"name": "anthropicLabel",
"fill": "$--foreground",
"content": "Anthropic",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "frame",
"id": "GUELn",
"name": "Input",
"width": "fill_container",
"height": 36,
"fill": "$--background",
"cornerRadius": "$--radius-md",
"stroke": {
"thickness": 1,
"fill": "$--border"
},
"gap": 8,
"padding": [
0,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "NjLRf",
"name": "anthropicValue",
"fill": "$--foreground",
"content": "sk-ant-•••••••••••••k4Rm",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "kBDAI",
"name": "anthropicClear",
"width": 14,
"height": 14,
"iconFontName": "x",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "frame",
"id": "qaTjV",
"name": "OpenAI Key Row",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "etofy",
"name": "openaiLabel",
"fill": "$--foreground",
"content": "OpenAI",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "frame",
"id": "BKXuT",
"name": "Input Empty",
"width": "fill_container",
"height": 36,
"fill": "$--background",
"cornerRadius": "$--radius-md",
"stroke": {
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "EHi9A",
"name": "openaiPlaceholder",
"fill": "$--muted-foreground",
"content": "sk-...",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ZM8dg",
"name": "Google Key Row",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "qzpsp",
"name": "googleLabel",
"fill": "$--foreground",
"content": "Google AI",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "frame",
"id": "pRsLr",
"name": "Input Empty",
"width": "fill_container",
"height": 36,
"fill": "$--background",
"cornerRadius": "$--radius-md",
"stroke": {
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "KAqg2",
"name": "googlePlaceholder",
"fill": "$--muted-foreground",
"content": "AIza...",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "be7TS",
"name": "Footer",
"width": "fill_container",
"height": 56,
"stroke": {
"thickness": {
"top": 1
},
"fill": "$--border"
},
"gap": 12,
"padding": [
0,
24
],
"justifyContent": "end",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "LAIeB",
"name": "footerHint",
"fill": "$--muted-foreground",
"content": "Cmd+, to open settings",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "DR2VW",
"name": "Spacer",
"width": "fill_container",
"height": 1
},
{
"type": "frame",
"id": "u9fBE",
"name": "Save Button",
"height": 32,
"fill": "$--primary",
"cornerRadius": "$--radius-md",
"padding": [
0,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "yRYWq",
"name": "saveBtnLabel",
"fill": "$--primary-foreground",
"content": "Save",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv01",
"x": 560,
"y": 6206,
"name": "GitHub Vault — Modal empty state",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 560,
"height": 480,
"fill": "$--background",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghv01-hdr",
"name": "Header",
"width": "fill_container",
"height": 56,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-title",
"name": "title",
"fill": "$--foreground",
"content": "Connect GitHub Repo",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv01-close",
"name": "closeBtn",
"width": 24,
"height": 24,
"cornerRadius": 4,
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-x",
"fill": "$--muted-foreground",
"content": "X",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv01-tabs",
"name": "TabBar",
"width": "fill_container",
"height": 44,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "end",
"children": [
{
"type": "frame",
"id": "ghv01-tab-clone",
"name": "Tab: Clone Existing",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 2
},
"fill": "$--accent-blue"
},
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-tab-clone-lbl",
"fill": "$--foreground",
"content": "Clone Existing",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv01-tab-create",
"name": "Tab: Create New",
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-tab-create-lbl",
"fill": "$--muted-foreground",
"content": "Create New",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv01-body",
"name": "Body: Empty State",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 16,
"padding": [
32,
24
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv01-icon",
"name": "githubIcon",
"width": 48,
"height": 48,
"fill": "$--accent",
"cornerRadius": 24,
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-gh",
"fill": "$--muted-foreground",
"content": "GH",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "normal"
}
]
},
{
"type": "text",
"id": "ghv01-heading",
"fill": "$--foreground",
"content": "Clone an existing GitHub repository",
"textAlign": "center",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghv01-desc",
"fill": "$--muted-foreground",
"content": "Search your repos or paste a URL to clone a GitHub repo as a vault.",
"textAlign": "center",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv01-search",
"name": "SearchInput",
"width": 400,
"height": 40,
"fill": "$--input",
"cornerRadius": 8,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-placeholder",
"fill": "$--muted-foreground",
"content": "Search repos or paste URL...",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv01-footer",
"name": "Footer",
"width": "fill_container",
"height": 56,
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv01-hint",
"fill": "$--muted-foreground",
"content": "Connected as @lucaong",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv01-btns",
"name": "buttons",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv01-cancel",
"name": "cancelBtn",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv01-cancel-lbl",
"fill": "$--foreground",
"content": "Cancel",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv02",
"x": 1160,
"y": 6206,
"name": "GitHub Vault — Clone repo list",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 560,
"height": 540,
"fill": "$--background",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghv02-hdr",
"name": "Header",
"width": "fill_container",
"height": 56,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-title",
"fill": "$--foreground",
"content": "Connect GitHub Repo",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv02-close",
"name": "closeBtn",
"width": 24,
"height": 24,
"cornerRadius": 4,
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-x",
"fill": "$--muted-foreground",
"content": "X",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv02-tabs",
"name": "TabBar",
"width": "fill_container",
"height": 44,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "end",
"children": [
{
"type": "frame",
"id": "ghv02-tab-clone",
"name": "Tab: Clone Existing (active)",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 2
},
"fill": "$--accent-blue"
},
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-tab-clone-lbl",
"fill": "$--foreground",
"content": "Clone Existing",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv02-tab-create",
"name": "Tab: Create New",
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-tab-create-lbl",
"fill": "$--muted-foreground",
"content": "Create New",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv02-body",
"name": "Body: Repo List",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 12,
"padding": [
16,
24
],
"children": [
{
"type": "frame",
"id": "ghv02-search",
"name": "SearchInput (filled)",
"width": "fill_container",
"height": 40,
"fill": "$--input",
"cornerRadius": 8,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--ring"
},
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-search-val",
"fill": "$--foreground",
"content": "laputa",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv02-list",
"name": "RepoList",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 2,
"children": [
{
"type": "frame",
"id": "ghv02-repo1",
"name": "RepoItem: selected",
"width": "fill_container",
"height": 56,
"fill": "$--accent",
"cornerRadius": 6,
"layout": "vertical",
"gap": 4,
"padding": [
8,
12
],
"justifyContent": "center",
"children": [
{
"type": "frame",
"id": "ghv02-repo1-row",
"name": "topRow",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-repo1-name",
"fill": "$--foreground",
"content": "lucaong/laputa-vault",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv02-repo1-badge",
"name": "privateBadge",
"cornerRadius": 4,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
2,
6
],
"children": [
{
"type": "text",
"id": "ghv02-repo1-priv",
"fill": "$--muted-foreground",
"content": "Private",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "text",
"id": "ghv02-repo1-desc",
"fill": "$--muted-foreground",
"content": "Personal knowledge vault — markdown + YAML frontmatter",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv02-repo2",
"name": "RepoItem: unselected",
"width": "fill_container",
"height": 56,
"cornerRadius": 6,
"layout": "vertical",
"gap": 4,
"padding": [
8,
12
],
"justifyContent": "center",
"children": [
{
"type": "frame",
"id": "ghv02-repo2-row",
"name": "topRow",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-repo2-name",
"fill": "$--foreground",
"content": "lucaong/laputa-app",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv02-repo2-badge",
"name": "publicBadge",
"cornerRadius": 4,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
2,
6
],
"children": [
{
"type": "text",
"id": "ghv02-repo2-pub",
"fill": "$--muted-foreground",
"content": "Public",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "text",
"id": "ghv02-repo2-desc",
"fill": "$--muted-foreground",
"content": "Laputa desktop app — Tauri + React + CodeMirror 6",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv02-repo3",
"name": "RepoItem: unselected 2",
"width": "fill_container",
"height": 56,
"cornerRadius": 6,
"layout": "vertical",
"gap": 4,
"padding": [
8,
12
],
"justifyContent": "center",
"children": [
{
"type": "frame",
"id": "ghv02-repo3-row",
"name": "topRow",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-repo3-name",
"fill": "$--foreground",
"content": "lucaong/dotfiles",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "text",
"id": "ghv02-repo3-desc",
"fill": "$--muted-foreground",
"content": "My macOS dotfiles and config",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv02-path",
"name": "LocalPathPicker",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "ghv02-path-lbl",
"fill": "$--foreground",
"content": "Clone to:",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv02-path-input",
"name": "pathInput",
"width": "fill_container",
"height": 36,
"fill": "$--input",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-path-val",
"fill": "$--foreground",
"content": "~/Vaults/laputa-vault",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv02-footer",
"name": "Footer",
"width": "fill_container",
"height": 56,
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv02-hint",
"fill": "$--muted-foreground",
"content": "3 repos found",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv02-btns",
"name": "buttons",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv02-cancel",
"name": "cancelBtn",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv02-cancel-lbl",
"fill": "$--foreground",
"content": "Cancel",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv02-clone-btn",
"name": "cloneBtn",
"fill": "$--primary",
"cornerRadius": 6,
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv02-clone-lbl",
"fill": "$--background",
"content": "Clone & Open",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv03",
"x": 0,
"y": 6786,
"name": "GitHub Vault — Create new repo",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 560,
"height": 440,
"fill": "$--background",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghv03-hdr",
"name": "Header",
"width": "fill_container",
"height": 56,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-title",
"fill": "$--foreground",
"content": "Connect GitHub Repo",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv03-close",
"name": "closeBtn",
"width": 24,
"height": 24,
"cornerRadius": 4,
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-x",
"fill": "$--muted-foreground",
"content": "X",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv03-tabs",
"name": "TabBar",
"width": "fill_container",
"height": 44,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "end",
"children": [
{
"type": "frame",
"id": "ghv03-tab-clone",
"name": "Tab: Clone Existing",
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-tab-clone-lbl",
"fill": "$--muted-foreground",
"content": "Clone Existing",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv03-tab-create",
"name": "Tab: Create New (active)",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 2
},
"fill": "$--accent-blue"
},
"padding": [
8,
16
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-tab-create-lbl",
"fill": "$--foreground",
"content": "Create New",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "ghv03-body",
"name": "Body: Create Form",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": 24,
"children": [
{
"type": "frame",
"id": "ghv03-name-field",
"name": "RepoNameField",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "ghv03-name-lbl",
"fill": "$--foreground",
"content": "Repository name",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv03-name-input",
"name": "nameInput",
"width": "fill_container",
"height": 40,
"fill": "$--input",
"cornerRadius": 8,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-name-val",
"fill": "$--foreground",
"content": "my-vault",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "text",
"id": "ghv03-name-hint",
"fill": "$--muted-foreground",
"content": "github.com/lucaong/my-vault",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv03-vis-field",
"name": "VisibilityToggle",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "text",
"id": "ghv03-vis-lbl",
"fill": "$--foreground",
"content": "Visibility",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv03-vis-opts",
"name": "options",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv03-opt-priv",
"name": "PrivateOption (selected)",
"fill": "$--accent",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--accent-blue"
},
"gap": 6,
"padding": [
6,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-opt-priv-icon",
"fill": "$--accent-blue",
"content": "Lock",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghv03-opt-priv-lbl",
"fill": "$--foreground",
"content": "Private",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv03-opt-pub",
"name": "PublicOption",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"gap": 6,
"padding": [
6,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-opt-pub-icon",
"fill": "$--muted-foreground",
"content": "Globe",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghv03-opt-pub-lbl",
"fill": "$--muted-foreground",
"content": "Public",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv03-path-field",
"name": "LocalPathField",
"width": "fill_container",
"layout": "vertical",
"gap": 6,
"children": [
{
"type": "text",
"id": "ghv03-path-lbl",
"fill": "$--foreground",
"content": "Clone to:",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv03-path-input",
"name": "pathInput",
"width": "fill_container",
"height": 36,
"fill": "$--input",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
0,
10
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv03-path-val",
"fill": "$--foreground",
"content": "~/Vaults/my-vault",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv03-footer",
"name": "Footer",
"width": "fill_container",
"height": 56,
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"justifyContent": "end",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv03-btns",
"name": "buttons",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv03-cancel",
"name": "cancelBtn",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv03-cancel-lbl",
"fill": "$--foreground",
"content": "Cancel",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv03-create-btn",
"name": "createBtn",
"fill": "$--primary",
"cornerRadius": 6,
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv03-create-lbl",
"fill": "$--background",
"content": "Create & Clone",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "ghv04",
"x": 600,
"y": 6786,
"name": "GitHub Vault — Clone in progress",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 560,
"height": 320,
"fill": "$--background",
"cornerRadius": 12,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghv04-hdr",
"name": "Header",
"width": "fill_container",
"height": 56,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghv04-title",
"fill": "$--foreground",
"content": "Cloning Repository...",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghv04-body",
"name": "Body: Progress",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
32,
24
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv04-spinner",
"name": "spinner",
"width": 40,
"height": 40,
"cornerRadius": 20,
"stroke": {
"align": "inside",
"thickness": 3,
"fill": "$--accent-blue"
}
},
{
"type": "text",
"id": "ghv04-status",
"fill": "$--foreground",
"content": "Cloning lucaong/laputa-vault...",
"textAlign": "center",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghv04-sub",
"fill": "$--muted-foreground",
"content": "Receiving objects: 67% (1,234/1,842)",
"textAlign": "center",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghv04-bar-bg",
"name": "progressBarBg",
"width": 360,
"height": 4,
"fill": "$--accent",
"cornerRadius": 2,
"children": [
{
"type": "frame",
"id": "ghv04-bar-fill",
"name": "progressBarFill",
"width": 241,
"height": 4,
"fill": "$--accent-blue",
"cornerRadius": 2
}
]
}
]
},
{
"type": "frame",
"id": "ghv04-footer",
"name": "Footer",
"width": "fill_container",
"height": 56,
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"padding": [
0,
24
],
"justifyContent": "end",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ghv04-cancel",
"name": "cancelBtn",
"cornerRadius": 6,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "$--border"
},
"padding": [
6,
16
],
"children": [
{
"type": "text",
"id": "ghv04-cancel-lbl",
"fill": "$--foreground",
"content": "Cancel",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "text",
"id": "fg_editor_and_wikilinks",
"x": 0,
"y": 7266,
"theme": {
"Mode": "Light"
},
"fill": "$--muted-foreground",
"content": "EDITOR & WIKILINKS",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600",
"letterSpacing": 1
},
{
"type": "frame",
"id": "wlc01",
"x": 0,
"y": 7296,
"name": "Wikilink Colors — Editor View (Light)",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 760,
"height": 440,
"fill": "$--background",
"layout": "vertical",
"gap": 12,
"padding": [
32,
40
],
"children": [
{
"type": "text",
"id": "wlc02",
"fill": "$--foreground",
"content": "Build Laputa App",
"fontFamily": "Inter",
"fontSize": 28,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc03",
"fill": "$--foreground",
"content": "Wiki-Links",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "wlc10",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc10a",
"fill": "$--foreground",
"content": "See ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc10b",
"fill": "$--accent-red",
"content": "Stock Screener — EMA200 Wick Bounce",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc10c",
"fill": "$--foreground",
"content": " for the experiment approach.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wlc11",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc11a",
"fill": "$--foreground",
"content": "Contact ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc11b",
"fill": "$--accent-yellow",
"content": "Matteo Cellini",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc11c",
"fill": "$--foreground",
"content": " for sponsorship data.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wlc12",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc12a",
"fill": "$--foreground",
"content": "Link to ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc12b",
"fill": "$--accent-purple",
"content": "Grow Newsletter",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc12c",
"fill": "$--foreground",
"content": " responsibility.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wlc13",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc13a",
"fill": "$--foreground",
"content": "Check ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc13b",
"fill": "$--accent-green",
"content": "Software Development",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc13c",
"fill": "$--foreground",
"content": " for tech notes.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wlc14",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc14a",
"fill": "$--foreground",
"content": "See ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc14b",
"fill": "$--accent-yellow",
"content": "Laputa App Design Session",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc14c",
"fill": "$--foreground",
"content": " event recap.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "wlc15",
"name": "Legend",
"width": "fill_container",
"gap": 16,
"padding": [
12,
0,
0,
0
],
"children": [
{
"type": "text",
"id": "wlc15a",
"fill": "$--accent-red",
"content": "Experiment",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc15b",
"fill": "$--accent-yellow",
"content": "Person / Event",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc15c",
"fill": "$--accent-purple",
"content": "Responsibility",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc15d",
"fill": "$--accent-green",
"content": "Topic",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "wlc20",
"x": 800,
"y": 7296,
"name": "Wikilink Colors — Broken Link State",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 500,
"height": 200,
"fill": "$--background",
"layout": "vertical",
"gap": 12,
"padding": [
32,
40
],
"children": [
{
"type": "text",
"id": "wlc21",
"fill": "$--foreground",
"content": "Broken Wikilink",
"fontFamily": "Inter",
"fontSize": 20,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "wlc22",
"width": "fill_container",
"children": [
{
"type": "text",
"id": "wlc22a",
"fill": "$--foreground",
"content": "Also see ",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc22b",
"opacity": 0.7,
"fill": "$--muted-foreground",
"content": "Non-Existent Note",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wlc22c",
"fill": "$--foreground",
"content": " which is a broken link.",
"fontFamily": "Inter",
"fontSize": 15,
"fontWeight": "normal"
}
]
},
{
"type": "text",
"id": "wlc23",
"fill": "$--muted-foreground",
"content": "Broken links show muted color + dashed underline + reduced opacity",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal",
"fontStyle": "italic"
}
]
},
{
"type": "frame",
"id": "ghDO1",
"x": 0,
"y": 7776,
"name": "Git History — Diff Open",
"theme": {
"Mode": "Light"
},
"width": 600,
"fill": "$--background",
"cornerRadius": "$--radius-lg",
"stroke": {
"thickness": 1,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghDObc",
"width": "fill_container",
"height": 36,
"fill": "$--muted",
"stroke": {
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"gap": 8,
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDObcP",
"fill": "$--muted-foreground",
"content": "responsibility / grow-newsletter.md",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "ghDObcS",
"width": "fill_container",
"height": 1
},
{
"type": "frame",
"id": "ghDObcB",
"fill": "$--primary",
"cornerRadius": "$--radius-sm",
"padding": [
2,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDObcBt",
"fill": "$--primary-foreground",
"content": "Diff: a1b2c3d",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600"
}
]
}
]
},
{
"type": "frame",
"id": "ghDOb",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ghDOl1",
"width": "fill_container",
"height": 22,
"fill": "$--muted",
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl1n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "1",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl1t",
"fill": "$--muted-foreground",
"content": "diff --git a/grow-newsletter.md b/grow-newsletter.md",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "ghDOl2",
"width": "fill_container",
"height": 22,
"fill": "$--accent-blue-light",
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl2n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "2",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl2t",
"fill": "$--primary",
"content": "@@ -5,3 +5,5 @@",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal",
"fontStyle": "italic"
}
]
},
{
"type": "frame",
"id": "ghDOl3",
"width": "fill_container",
"height": 22,
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl3n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "3",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl3t",
"fill": "$--secondary-foreground",
"content": " # Grow Newsletter",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghDOl4",
"width": "fill_container",
"height": 22,
"fill": "$--accent-red-light",
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl4n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "4",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl4t",
"fill": "$--accent-red",
"content": "-Old paragraph from before a1b2c3d.",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghDOl5",
"width": "fill_container",
"height": 22,
"fill": "$--accent-green-light",
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl5n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "5",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl5t",
"fill": "$--accent-green",
"content": "+Updated paragraph at commit a1b2c3d.",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "ghDOl6",
"width": "fill_container",
"height": 22,
"fill": "$--accent-green-light",
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "ghDOl6n",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": 30,
"content": "6",
"textAlign": "right",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "ghDOl6t",
"fill": "$--accent-green",
"content": "+New content added in this commit.",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "gCzh9",
"x": 1540,
"y": 100,
"name": "Live Theme Editing Flow",
"width": 900,
"fill": "#F0F0EF",
"gap": 24,
"padding": 24,
"children": [
{
"type": "frame",
"id": "8ydja",
"name": "Editor — Theme JSON",
"width": 400,
"fill": "#FFFFFF",
"cornerRadius": 8,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "#E9E9E7"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "N13BE",
"width": "fill_container",
"height": 36,
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "#E9E9E7"
},
"gap": 8,
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "4oLSt",
"width": 14,
"height": 14,
"iconFontName": "file",
"iconFontFamily": "lucide",
"fill": "#787774"
},
{
"type": "text",
"id": "Gi6aI",
"fill": "#37352F",
"content": "_themes/default.json",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "AC7Br",
"width": "fill_container",
"layout": "vertical",
"gap": 2,
"padding": 16,
"children": [
{
"type": "text",
"id": "Pz8Re",
"fill": "#37352F",
"content": "{",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "p0Vnb",
"fill": "#37352F",
"content": " \"name\": \"Default\",",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "k8XCj",
"fill": "#37352F",
"content": " \"colors\": {",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "r4nRd",
"fill": "#155DFF",
"content": " \"background\": \"#FFFFFF\",",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "600"
},
{
"type": "text",
"id": "JtI7a",
"fill": "#37352F",
"content": " \"sidebar-background\": \"#F7F6F3\",",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "GM82z",
"fill": "#37352F",
"content": " \"accent\": \"#155DFF\"",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "SXRp9",
"fill": "#37352F",
"content": " }",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "lRFwV",
"fill": "#37352F",
"content": "}",
"fontFamily": "IBM Plex Mono",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "oaOJu",
"name": "Arrow",
"width": 40,
"layout": "vertical",
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "MxjOf",
"width": 24,
"height": 24,
"iconFontName": "arrow-right",
"iconFontFamily": "lucide",
"fill": "#787774"
},
{
"type": "text",
"id": "wLG4i",
"fill": "#787774",
"content": "~300ms",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "epg5P",
"name": "App Preview",
"width": 380,
"fill": "#FFFFFF",
"cornerRadius": 8,
"stroke": {
"align": "inside",
"thickness": 1,
"fill": "#E9E9E7"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "L1Ea8",
"width": "fill_container",
"height": 28,
"fill": "#F7F6F3",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "#E9E9E7"
},
"gap": 6,
"padding": [
0,
8
],
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "FRy4o",
"fill": "#FF5F57",
"width": 8,
"height": 8
},
{
"type": "ellipse",
"id": "DwZXd",
"fill": "#FEBC2E",
"width": 8,
"height": 8
},
{
"type": "ellipse",
"id": "9E62n",
"fill": "#28C840",
"width": 8,
"height": 8
}
]
},
{
"type": "frame",
"id": "OmvKe",
"width": "fill_container",
"height": 260,
"children": [
{
"type": "frame",
"id": "uFDos",
"width": 80,
"height": "fill_container",
"fill": "#F7F6F3",
"stroke": {
"align": "inside",
"thickness": {
"right": 1
},
"fill": "#E9E9E7"
},
"layout": "vertical",
"gap": 4,
"padding": [
8,
6
],
"children": [
{
"type": "frame",
"id": "2lVUm",
"width": "fill_container",
"height": 20,
"fill": "#EBEBEA",
"cornerRadius": 4
},
{
"type": "frame",
"id": "9Wh45",
"width": "fill_container",
"height": 20,
"cornerRadius": 4
},
{
"type": "frame",
"id": "SKbH1",
"width": "fill_container",
"height": 20,
"cornerRadius": 4
}
]
},
{
"type": "frame",
"id": "uxY6L",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 8,
"padding": 16,
"children": [
{
"type": "frame",
"id": "xDBG4",
"width": 160,
"height": 12,
"fill": "#37352F",
"cornerRadius": 2
},
{
"type": "frame",
"id": "hO7Sw",
"width": "fill_container",
"height": 8,
"fill": "#F0F0EF",
"cornerRadius": 2
},
{
"type": "frame",
"id": "UabDD",
"width": 220,
"height": 8,
"fill": "#F0F0EF",
"cornerRadius": 2
},
{
"type": "frame",
"id": "yNVho",
"width": 180,
"height": 8,
"fill": "#F0F0EF",
"cornerRadius": 2
}
]
}
]
},
{
"type": "frame",
"id": "UpXiE",
"width": "fill_container",
"height": 28,
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "#E9E9E7"
},
"gap": 6,
"padding": [
0,
12
],
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "Cm1F8",
"fill": "#38A169",
"width": 6,
"height": 6
},
{
"type": "text",
"id": "mNEER",
"fill": "#787774",
"content": "Live — CSS variables update instantly",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "7ckWW",
"x": 0,
"y": 3840,
"name": "component/SidebarFilter",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(250)",
"cornerRadius": 6,
"gap": 8,
"padding": [
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "irI5G",
"name": "leftGroup",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "7I3Jh",
"name": "sfIcon",
"width": 18,
"height": 18,
"iconFontName": "tray-fill",
"iconFontFamily": "phosphor",
"weight": 700,
"fill": "$--foreground"
},
{
"type": "text",
"id": "gzPe9",
"name": "sfLabel",
"fill": "$--foreground",
"content": "Inbox",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "v96mi",
"name": "countBadge",
"height": 20,
"fill": "$--secondary",
"cornerRadius": 9999,
"padding": [
0,
6
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "5hore",
"name": "sfCount",
"fill": "$--muted-foreground",
"content": "24",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600"
}
]
}
]
},
{
"type": "frame",
"id": "YxnFy",
"x": 300,
"y": 3840,
"name": "component/SidebarSection",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(250)",
"cornerRadius": 4,
"gap": 8,
"padding": [
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "sqaEa",
"name": "leftGroup",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "ckRGK",
"name": "ssIcon",
"width": 18,
"height": 18,
"iconFontName": "wrench",
"iconFontFamily": "phosphor",
"weight": 700,
"fill": "$--accent-red"
},
{
"type": "text",
"id": "TB6OW",
"name": "ssLabel",
"fill": "$--foreground",
"content": "Projects",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "icon_font",
"id": "SWlrA",
"name": "ssChev",
"width": 14,
"height": 14,
"iconFontName": "chevron-down",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "CGiVI",
"x": 0,
"y": 3880,
"name": "component/NoteListGroupHeader",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(300)",
"height": 32,
"fill": "$--muted",
"padding": [
0,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "rKzdN",
"name": "leftGroup",
"gap": 6,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "xr1Bv",
"name": "ghLabel",
"fill": "$--muted-foreground",
"content": "Related Notes",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "500"
},
{
"type": "text",
"id": "Yh4xV",
"name": "ghCount",
"fill": "$--muted-foreground",
"content": "2",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "CGSHU",
"name": "rightGroup",
"gap": 10,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "V4aU1",
"name": "ghFilter",
"width": 12,
"height": 12,
"iconFontName": "funnel",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "FcKJx",
"name": "ghPlus",
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "dEkjQ",
"name": "ghChev",
"width": 12,
"height": 12,
"iconFontName": "chevron-down",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "frame",
"id": "2nsLn",
"x": 0,
"y": 3930,
"name": "component/NoteListItem",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(300)",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"layout": "vertical",
"gap": 8,
"padding": [
14,
16
],
"children": [
{
"type": "frame",
"id": "lOrq7",
"name": "titleRow",
"width": "fill_container",
"gap": 8,
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "VlWUT",
"name": "titleGroup",
"width": "fill_container",
"gap": 6,
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "kQ4LK",
"name": "niTitle",
"fill": "$--foreground",
"content": "Note Title",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
},
{
"type": "icon_font",
"id": "pPh0z",
"name": "niIcon",
"width": 14,
"height": 14,
"iconFontName": "leaf",
"iconFontFamily": "phosphor",
"fill": "$--accent-green"
}
]
}
]
},
{
"type": "text",
"id": "vm86r",
"name": "niSnippet",
"fill": "$--muted-foreground",
"textGrowth": "fixed-width",
"width": "fill_container",
"content": "Preview text of the note content goes here...",
"lineHeight": 1.5,
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "2bVOu",
"x": 350,
"y": 3930,
"name": "component/PropertyRow",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(250)",
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "SS4ef",
"name": "prLabel",
"fill": "$--muted-foreground",
"content": "Label",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "frame",
"id": "lKjFb",
"name": "valueChip",
"fill": "$--muted",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "38JOz",
"name": "prVal",
"fill": "$--accent-foreground",
"content": "Value",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
]
},
{
"type": "frame",
"id": "n6iwQ",
"x": 350,
"y": 3960,
"name": "component/RelationshipPill",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(250)",
"fill": "$--accent-green-light",
"cornerRadius": 6,
"padding": [
6,
10
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "OTLK6",
"name": "rpText",
"fill": "$--accent-green",
"content": "Linked Note",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "icon_font",
"id": "s37c7",
"name": "rpIcon",
"opacity": 0.5,
"width": 14,
"height": 14,
"iconFontName": "tag",
"iconFontFamily": "phosphor",
"fill": "$--accent-green"
}
]
},
{
"type": "frame",
"id": "ABj4R",
"x": 0,
"y": 4010,
"name": "component/InfoBar",
"theme": {
"Mode": "Light"
},
"reusable": true,
"width": "fill_container(500)",
"height": 45,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"padding": [
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "tahyf",
"name": "leftGroup",
"width": "fit_content(0)",
"height": "fit_content(0)",
"gap": 6,
"alignItems": "center"
},
{
"type": "frame",
"id": "LxtfH",
"name": "rightGroup",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "07vzo",
"name": "ibSearch",
"width": 16,
"height": 16,
"iconFontName": "magnifying-glass",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "S0HhS",
"name": "ibBranch",
"width": 16,
"height": 16,
"iconFontName": "git-branch",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "RMnGX",
"name": "ibEdit",
"width": 16,
"height": 16,
"iconFontName": "cursor-text",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "Roqzk",
"name": "ibAI",
"width": 16,
"height": 16,
"iconFontName": "sparkle",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "QWemM",
"name": "ibMore",
"width": 16,
"height": 16,
"iconFontName": "dots-three",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "text",
"id": "AFWzn",
"x": -146,
"y": 4080,
"name": "ORGANISMS",
"theme": {
"Mode": "Light"
},
"fill": "$--muted-foreground",
"content": "ORGANISMS",
"fontFamily": "Inter",
"fontSize": 16,
"fontWeight": "600",
"letterSpacing": 1
},
{
"type": "frame",
"id": "egetu",
"x": 0,
"y": 4110,
"name": "organism/Sidebar",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 250,
"height": 630,
"fill": "$--sidebar",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--sidebar-border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "qgLOD",
"name": "Filters",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"layout": "vertical",
"gap": 1,
"padding": [
8,
8,
16,
8
],
"children": [
{
"id": "NWjcu",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"fill": "$--accent-blue-light",
"name": "f1",
"height": "fit_content",
"x": 8,
"y": 8,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "tray-fill",
"fill": "$--primary"
},
"gzPe9": {
"content": "Inbox",
"fill": "$--primary",
"fontWeight": "600",
"x": 26
},
"v96mi": {
"fill": "$--primary",
"width": "fit_content",
"x": 193,
"y": 6
},
"5hore": {
"content": "24",
"fill": "$--primary-foreground",
"x": 6,
"y": 4
}
}
},
{
"id": "eTR1j",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f2",
"height": "fit_content",
"x": 8,
"y": 41,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "cardholder"
},
"gzPe9": {
"content": "All Notes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "6",
"x": 6,
"y": 4
}
}
},
{
"id": "yQUtJ",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f3",
"height": "fit_content",
"x": 8,
"y": 74,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "trash"
},
"gzPe9": {
"content": "Archive",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "2",
"x": 6,
"y": 4
}
}
},
{
"id": "iskQ8",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f4",
"height": "fit_content",
"x": 8,
"y": 107,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "git-branch"
},
"gzPe9": {
"content": "Changes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "3",
"x": 6,
"y": 4
}
}
}
]
},
{
"type": "frame",
"id": "ACoM7",
"name": "Sections",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
8,
0
],
"children": [
{
"type": "frame",
"id": "zv0YL",
"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": [
{
"id": "9qcwY",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s1",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "wrench",
"fill": "$--accent-red"
},
"TB6OW": {
"content": "Projects",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-down",
"x": 208,
"y": 8
}
}
},
{
"type": "frame",
"id": "2QOQc",
"name": "projItem1",
"width": "fill_container",
"fill": "$--accent-red-light",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "I9l7N",
"name": "proj1Txt",
"fill": "$--accent-red",
"content": "Laputa App",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "8vkxG",
"name": "projItem2",
"width": "fill_container",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "msWLo",
"name": "proj2Txt",
"fill": "$--muted-foreground",
"content": "Portfolio Rewrite",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "MmI12",
"name": "projItem3",
"width": "fill_container",
"cornerRadius": 6,
"padding": [
6,
16,
6,
28
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "Bnpbp",
"name": "proj3Txt",
"fill": "$--muted-foreground",
"content": "AI Habit Tracker",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "VuoaL",
"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": [
{
"id": "ZYfNb",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s2",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "medal",
"fill": "$--accent-purple"
},
"TB6OW": {
"content": "Responsibilities",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "fiq6w",
"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": [
{
"id": "zzcZK",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s3",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "arrows-clockwise",
"fill": "$--accent-purple"
},
"TB6OW": {
"content": "Procedures",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "yWBwJ",
"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": [
{
"id": "567KW",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s4",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "users",
"fill": "$--accent-yellow"
},
"TB6OW": {
"content": "People",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "W31uX",
"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": [
{
"id": "B8Tla",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s5",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "calendar-blank",
"fill": "$--accent-yellow"
},
"TB6OW": {
"content": "Events",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "tdxOP",
"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": [
{
"id": "EU7S4",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s6",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "tag",
"fill": "$--accent-green"
},
"TB6OW": {
"content": "Topics",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
},
{
"type": "frame",
"id": "2jsNO",
"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": [
{
"id": "Tmslj",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "s7",
"height": "fit_content",
"x": 6,
"y": 4,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"iconFontName": "leaf",
"fill": "$--accent-green"
},
"TB6OW": {
"content": "Notes",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
},
{
"type": "frame",
"id": "6Q2CU",
"name": "eventsHeader",
"width": "fill_container",
"cornerRadius": 4,
"gap": 8,
"padding": [
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "MSuWv",
"name": "leftEvents",
"gap": 8,
"padding": [
8,
0
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "SlE7g",
"name": "eventsIcon",
"width": 18,
"height": 18,
"iconFontName": "plus",
"iconFontFamily": "phosphor",
"weight": 700,
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "NaEtB",
"name": "eventsLbl",
"fill": "$--muted-foreground",
"content": "Create new type",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "xUnbx",
"name": "Commit Area",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"layout": "vertical",
"padding": 12,
"children": [
{
"type": "frame",
"id": "LWl7a",
"name": "commitBtn",
"width": "fill_container",
"fill": "$--primary",
"cornerRadius": 6,
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "LQt9F",
"name": "commitIcon",
"width": 14,
"height": 14,
"iconFontName": "git-commit-horizontal",
"iconFontFamily": "lucide",
"fill": "$--primary-foreground"
},
{
"type": "text",
"id": "nFrAH",
"name": "commitTxt",
"fill": "$--primary-foreground",
"content": "Commit & Push",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
},
{
"type": "frame",
"id": "5H9LX",
"name": "commitBadge",
"height": 18,
"fill": "$--white-overlay",
"cornerRadius": 9,
"padding": [
0,
5
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "kh7FN",
"name": "commitBadgeTxt",
"fill": "$--white",
"content": "3",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "fKGKs",
"x": 300,
"y": 4110,
"name": "organism/NoteList",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 300,
"height": 600,
"fill": "$--card",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "19epR",
"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": "EVKYQ",
"name": "nlTitle",
"fill": "$--foreground",
"content": "Laputa App",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "frame",
"id": "nmOv0",
"name": "nlActions",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "RhIBP",
"name": "searchIcon",
"width": 16,
"height": 16,
"iconFontName": "magnifying-glass",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "mLZ00",
"name": "plusIcon",
"width": 16,
"height": 16,
"iconFontName": "plus",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "frame",
"id": "xhfY5",
"name": "Note Items",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "9mW4k",
"name": "Backlinks Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "H5Ld0",
"name": "Note Item Selected",
"width": "fill_container",
"fill": "$--accent-red-light",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"children": [
{
"type": "rectangle",
"id": "G7IE8",
"name": "leftAccent",
"fill": "$--accent-red",
"width": 3,
"height": "fill_container"
},
{
"id": "anYem",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "#00000000"
},
"gap": 6,
"name": "nsel",
"height": "fit_content",
"x": 3,
"y": 0,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Laputa App",
"fontWeight": "600"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "wrench",
"fill": "$--accent-red",
"x": 251,
"y": 1
},
"vm86r": {
"content": "Personal knowledge and life management desktop app...",
"width": "fill_container",
"x": 16,
"y": 36
}
}
}
]
}
]
},
{
"type": "frame",
"id": "j0K31",
"name": "Related Notes Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "kfwjU",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h1",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Related Notes"
},
"Yh4xV": {
"content": "2",
"x": 80
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "6NAwq",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n1",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Portfolio Rewrite"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Redesigning portfolio site with modern stack and updated visual language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "s573X",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n2",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Sample note 2"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
},
{
"type": "frame",
"id": "NXnG4",
"name": "Events Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "RYvH6",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h2",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Events"
},
"Yh4xV": {
"content": "2",
"x": 42
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "T2KFL",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n3",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Grant"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "J5wAA",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n4",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Matteo"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
}
]
},
{
"type": "frame",
"id": "Ifl3D",
"name": "Filter Pills Bar",
"width": "fill_container",
"fill": {
"type": "gradient",
"gradientType": "linear",
"enabled": true,
"rotation": 0,
"size": {
"height": 1
},
"colors": [
{
"color": "#FFFFFF00",
"position": 0
},
{
"color": "#FFFFFFEE",
"position": 0.3
},
{
"color": "#FFFFFFFF",
"position": 1
}
]
},
"gap": 8,
"padding": [
12,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "jQN5P",
"name": "Pill Week",
"fill": "$--accent-blue-light",
"cornerRadius": 9999,
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "QKoI4",
"name": "label",
"fill": "$--primary",
"content": "Week",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "GicxE",
"name": "count",
"opacity": 0.7,
"fill": "$--primary",
"content": "12",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "IIHpE",
"name": "Pill Quarter",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "Up4gL",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Quarter",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "2Sjfb",
"name": "count",
"fill": "$--muted-foreground",
"content": "34",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "FMLbv",
"name": "Pill Year",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "DoITo",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Year",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "Dffa4",
"name": "count",
"fill": "$--muted-foreground",
"content": "86",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "111Se",
"x": 650,
"y": 4110,
"name": "organism/Editor",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 500,
"height": 600,
"layout": "vertical",
"children": [
{
"id": "KPYPC",
"type": "ref",
"ref": "ABj4R",
"width": "fill_container",
"name": "ib",
"y": 0,
"descendants": {
"tahyf": {
"x": 16,
"y": 22.5
},
"LxtfH": {
"width": "fit_content",
"height": "fit_content",
"x": 356,
"y": 14.5
},
"S0HhS": {
"x": 28
},
"RMnGX": {
"x": 56
},
"Roqzk": {
"x": 84
},
"QWemM": {
"x": 112
}
}
},
{
"type": "frame",
"id": "F4Dui",
"name": "Editor Content",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 16,
"padding": [
32,
64
],
"children": [
{
"type": "frame",
"id": "KTyHr",
"name": "titleRow",
"width": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "PJ1id",
"name": "noteH1",
"fill": "$--foreground",
"content": "🗓️ Laputa App",
"lineHeight": 1.2,
"fontFamily": "Inter Tight",
"fontSize": 36,
"fontWeight": "700"
}
]
},
{
"type": "rectangle",
"id": "j6zfj",
"name": "titleSeparator",
"fill": "$--border",
"width": "fill_container",
"height": 1
},
{
"type": "text",
"id": "8zTpy",
"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": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "w2kJV",
"name": "editorH2",
"fill": "$--foreground",
"content": "Architecture",
"lineHeight": 1.3,
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "600"
},
{
"type": "text",
"id": "7V2II",
"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": 15,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "cq3Av",
"x": 1200,
"y": 4110,
"name": "organism/Inspector",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 260,
"height": 814,
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"left": 1
},
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "BbUqQ",
"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": "8c34u",
"name": "leftGroup",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "AR1VI",
"name": "propIcon",
"width": 16,
"height": 16,
"iconFontName": "sliders",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "SUcCd",
"name": "inspTitle",
"fill": "$--muted-foreground",
"content": "Properties",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "600"
}
]
},
{
"type": "icon_font",
"id": "dLalj",
"name": "sidebarIcon",
"width": 16,
"height": 16,
"iconFontName": "x",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "pB4RB",
"name": "Inspector Body",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
12,
0
],
"children": [
{
"type": "frame",
"id": "uCPkF",
"name": "Section Group 1",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
0,
12,
20,
12
],
"children": [
{
"type": "frame",
"id": "zqRC4",
"name": "Properties Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"id": "k7ok8",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p1",
"height": "fit_content",
"x": 0,
"y": 0,
"descendants": {
"SS4ef": {
"content": "Type",
"y": 3
},
"lKjFb": {
"type": "frame",
"id": "qy4P9",
"name": "newChip",
"fill": "$--accent-red-light",
"cornerRadius": 4,
"gap": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "m5KI7",
"name": "chipIco",
"width": 12,
"height": 12,
"iconFontName": "wrench",
"iconFontFamily": "phosphor",
"fill": "$--accent-red"
},
{
"type": "text",
"id": "Buytc",
"name": "chipTxt",
"fill": "$--accent-red",
"content": "Project",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "E5QFS",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p2",
"height": "fit_content",
"x": 0,
"y": 29,
"descendants": {
"SS4ef": {
"content": "Status",
"y": 3
},
"lKjFb": {
"type": "frame",
"id": "ywH6n",
"name": "statusChip",
"fill": "$--accent-green-light",
"cornerRadius": 4,
"gap": 6,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "081sf",
"name": "statusDot",
"fill": "$--accent-green",
"width": 6,
"height": 6
},
{
"type": "text",
"id": "axaG5",
"name": "statusTxt",
"fill": "$--accent-green",
"content": "Active",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "GwVIl",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p3",
"height": "fit_content",
"x": 0,
"y": 58,
"descendants": {
"SS4ef": {
"content": "Date",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 142
},
"38JOz": {
"content": "Mar 23, 2026",
"x": 8,
"y": 3
}
}
},
{
"id": "zRK71",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p4",
"height": "fit_content",
"x": 0,
"y": 87,
"descendants": {
"SS4ef": {
"content": "URL",
"y": 3
},
"lKjFb": {
"fill": "transparent",
"width": "fit_content",
"height": "fit_content",
"x": 131
},
"38JOz": {
"content": "acme.dev/docs",
"fill": "$--primary",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "CFBUE",
"name": "propArchived",
"width": "fill_container",
"height": 21,
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "OR4KD",
"name": "propArchivedLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "xoT00",
"name": "archivedTxt",
"fill": "$--muted-foreground",
"content": "Archived",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "stkW3",
"name": "propArchivedToggle",
"width": 15,
"height": 15,
"fill": "$--background",
"cornerRadius": 3,
"stroke": {
"align": "inside",
"thickness": 1.5,
"fill": "$--border"
}
}
]
},
{
"type": "frame",
"id": "52BKa",
"name": "propTags",
"width": "fill_container",
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "6kXVB",
"name": "propTagsLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "r8ci1",
"name": "tagsTxt",
"fill": "$--muted-foreground",
"content": "Tags",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "fop5O",
"name": "propTagsChips",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "nd6Sn",
"name": "tagChip1",
"fill": "$--accent-purple-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "Q5lxH",
"name": "tag1txt",
"fill": "$--accent-purple",
"content": "v2",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "feGnC",
"name": "tagChip2",
"fill": "$--accent-orange-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "s4sb9",
"name": "tag2txt",
"fill": "$--accent-orange",
"content": "docs",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
]
}
]
},
{
"id": "yQtwo",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p5",
"height": "fit_content",
"x": 0,
"y": 174,
"descendants": {
"SS4ef": {
"content": "Author",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 192
},
"38JOz": {
"content": "Luca",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "JjKfC",
"name": "addPropRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "RojBf",
"name": "addIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "3S2Zt",
"name": "addTxt",
"opacity": 0.5,
"rotation": -0.43548563406852797,
"fill": "$--muted-foreground",
"content": "Add property",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "WdQWv",
"name": "Relationships Section",
"width": "fill_container",
"layout": "vertical",
"gap": 16,
"children": [
{
"type": "frame",
"id": "bySX6",
"name": "relGroup1",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "UgsrS",
"name": "relGrp1Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "xwwOp",
"name": "belongsIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "jYIuU",
"name": "belongsTxt",
"fill": "$--muted-foreground",
"content": "Belongs to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "aNsbm",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r1",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Laputa",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"id": "ZyuiR",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r2",
"height": "fit_content",
"x": 0,
"y": 50,
"descendants": {
"OTLK6": {
"content": "Building",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "l1N1e",
"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": "PjQdA",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "o99WC",
"name": "relGroup2",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "QWS2E",
"name": "relGrp2Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "mz5ML",
"name": "relatedIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "Bsayg",
"name": "relatedTxt",
"fill": "$--muted-foreground",
"content": "Related to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "I1IaJ",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"fill": "$--accent-red-light",
"name": "r3",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Shadcn Migration",
"fill": "$--accent-red",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "flask",
"fill": "$--accent-red",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "WC2IL",
"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": "f4Knr",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "7pmjT",
"name": "addRelRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "WrvVT",
"name": "addRelIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "rt2Vh",
"name": "addRelTxt",
"opacity": 0.5,
"fill": "$--muted-foreground",
"content": "Add relationship",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"id": "36Qpm",
"type": "ref",
"ref": "comp_Separator",
"name": "sep1",
"width": "fill_container",
"x": 0,
"y": 502.577211185393
},
{
"type": "frame",
"id": "zedOf",
"name": "Section Group 2",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12
],
"children": [
{
"type": "frame",
"id": "3beOc",
"name": "Backlinks Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "vCnQ9",
"name": "blTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "wuT2e",
"name": "blTitleTxt",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "9PcJK",
"name": "blIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-down-left",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "3hrVq",
"name": "blTxt",
"fill": "$--muted-foreground",
"content": "Backlinks",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "text",
"id": "ra2vD",
"name": "blItem1",
"fill": "$--primary",
"content": "Portfolio Rewrite",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "2JCLY",
"name": "blItem2",
"fill": "$--primary",
"content": "Meeting with Grant",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "GYQDO",
"name": "blItem3",
"fill": "$--primary",
"content": "Q1 Planning",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"id": "aaTRW",
"type": "ref",
"ref": "comp_Separator",
"name": "sep2",
"width": "fill_container",
"x": 0,
"y": 627.577211185393
},
{
"type": "frame",
"id": "jyOGY",
"name": "Section Group 3",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12,
0,
12
],
"children": [
{
"type": "frame",
"id": "SkJkn",
"name": "History Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "9RhOA",
"name": "histTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "MD8P3",
"name": "histIco",
"width": 12,
"height": 12,
"iconFontName": "clock-counter-clockwise",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "TiXHR",
"name": "histTxt",
"fill": "$--muted-foreground",
"content": "History",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "N8sFt",
"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": "82xBA",
"name": "histItem1Hash",
"fill": "$--accent-blue",
"content": "a089f44 · feat: migrate to shadcn/ui",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "wpM0x",
"name": "histItem1Date",
"fill": "$--muted-foreground",
"content": "Feb 16, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "75l81",
"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": "oG3KR",
"name": "histItem2Hash",
"fill": "$--accent-blue",
"content": "5a4b4ac · feat: emoji favicon",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "JSxVy",
"name": "histItem2Date",
"fill": "$--muted-foreground",
"content": "Feb 15, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "8Hjcy",
"x": 1549,
"y": 5100,
"name": "Folder Tree Sidebar",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 1440,
"height": 900,
"fill": "$--background",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "mzmNN",
"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": "S6CDt",
"name": "trafficLights",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "p47YL",
"name": "closeBtn",
"fill": "$--traffic-red",
"width": 12,
"height": 12
},
{
"type": "ellipse",
"id": "2L2cy",
"name": "minimizeBtn",
"fill": "$--traffic-yellow",
"width": 12,
"height": 12
},
{
"type": "ellipse",
"id": "6UXoF",
"name": "maximizeBtn",
"fill": "$--traffic-green",
"width": 12,
"height": 12
}
]
}
]
},
{
"type": "frame",
"id": "VaNIH",
"name": "Content",
"width": "fill_container",
"height": "fill_container",
"children": [
{
"type": "frame",
"id": "XYYGz",
"name": "sbRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 250,
"height": "fill_container",
"fill": "$--sidebar",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--sidebar-border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "a0EuZ",
"name": "Filters",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"layout": "vertical",
"gap": 1,
"padding": [
8,
8,
16,
8
],
"children": [
{
"id": "LWh15",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"fill": "$--accent-blue-light",
"name": "f1",
"height": "fit_content",
"x": 8,
"y": 8,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "tray-fill",
"fill": "$--primary"
},
"gzPe9": {
"content": "Inbox",
"fill": "$--primary",
"fontWeight": "600",
"x": 26
},
"v96mi": {
"fill": "$--primary",
"width": "fit_content",
"x": 193,
"y": 6
},
"5hore": {
"content": "24",
"fill": "$--primary-foreground",
"x": 6,
"y": 4
}
}
},
{
"id": "IqOfM",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f2",
"height": "fit_content",
"x": 8,
"y": 41,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "cardholder"
},
"gzPe9": {
"content": "All Notes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "6",
"x": 6,
"y": 4
}
}
},
{
"id": "SZSqv",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f3",
"height": "fit_content",
"x": 8,
"y": 74,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "trash"
},
"gzPe9": {
"content": "Archive",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "2",
"x": 6,
"y": 4
}
}
},
{
"id": "1S6jQ",
"type": "ref",
"ref": "7ckWW",
"width": "fill_container",
"name": "f4",
"height": "fit_content",
"x": 8,
"y": 107,
"descendants": {
"irI5G": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 7
},
"7I3Jh": {
"iconFontName": "git-branch"
},
"gzPe9": {
"content": "Changes",
"x": 26
},
"v96mi": {
"width": "fit_content",
"x": 199,
"y": 6
},
"5hore": {
"content": "3",
"x": 6,
"y": 4
}
}
}
]
},
{
"type": "frame",
"id": "GoNhn",
"name": "Sections",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
8,
0
],
"children": [
{
"type": "frame",
"id": "D55mW",
"name": "TypesSection",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"layout": "vertical",
"padding": [
0,
0,
4,
0
],
"children": [
{
"type": "frame",
"id": "3My8w",
"name": "TypesHeader",
"width": "fill_container",
"padding": [
6,
14,
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "o7h7N",
"name": "typesLeft",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "epS6N",
"name": "typesChevIcon",
"width": 12,
"height": 12,
"iconFontName": "chevron-down",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "v29gZ",
"name": "typesLabel",
"fill": "$--muted-foreground",
"content": "TYPES",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600",
"letterSpacing": 0.5
}
]
},
{
"type": "icon_font",
"id": "1rsaG",
"name": "typesPlus",
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "qzdMR",
"name": "TypesList",
"width": "fill_container",
"layout": "vertical",
"gap": 2,
"padding": [
2,
6,
4,
6
],
"children": [
{
"id": "akeOZ",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "t1",
"height": "fit_content",
"x": 6,
"y": 2,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"fill": "$--accent-red",
"iconFontName": "wrench"
},
"TB6OW": {
"content": "Projects",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
},
{
"id": "wn1Xe",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "t2",
"height": "fit_content",
"x": 6,
"y": 34,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"fill": "$--accent-yellow",
"iconFontName": "users"
},
"TB6OW": {
"content": "People",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
},
{
"id": "8RWVy",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "t3",
"height": "fit_content",
"x": 6,
"y": 66,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"fill": "$--accent-green",
"iconFontName": "tag"
},
"TB6OW": {
"content": "Topics",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
},
{
"id": "OORHX",
"type": "ref",
"ref": "YxnFy",
"width": "fill_container",
"name": "t4",
"height": "fit_content",
"x": 6,
"y": 98,
"descendants": {
"sqaEa": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 6
},
"ckRGK": {
"fill": "$--accent-green",
"iconFontName": "leaf"
},
"TB6OW": {
"content": "Notes",
"x": 26
},
"SWlrA": {
"iconFontName": "chevron-right",
"x": 208,
"y": 8
}
}
}
]
}
]
},
{
"type": "frame",
"id": "bNxbc",
"name": "FoldersSection",
"width": "fill_container",
"layout": "vertical",
"padding": [
8,
0
],
"children": [
{
"type": "frame",
"id": "YFyEm",
"name": "FolderHeader",
"width": "fill_container",
"padding": [
6,
14,
6,
16
],
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "GoOYA",
"name": "foldersLeft",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "i3yqZ",
"name": "foldersChev",
"width": 12,
"height": 12,
"iconFontName": "chevron-down",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "dsoQP",
"name": "foldersLabel",
"fill": "$--muted-foreground",
"content": "FOLDERS",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600",
"letterSpacing": 0.5
}
]
},
{
"type": "icon_font",
"id": "ZnY0e",
"name": "headerPlus",
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "FtzeF",
"name": "FolderTree",
"width": "fill_container",
"layout": "vertical",
"gap": 2,
"padding": [
2,
6,
8,
14
],
"children": [
{
"type": "frame",
"id": "0dvhE",
"name": "folder-projects",
"width": "fill_container",
"fill": "$--accent-blue-light",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "MlZbr",
"name": "r1chev",
"width": 18,
"height": 18,
"iconFontName": "folder-open-fill",
"iconFontFamily": "phosphor",
"fill": "$--primary"
},
{
"type": "text",
"id": "b1Iuo",
"name": "r1txt",
"fill": "$--primary",
"content": "projects",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "5IMlP",
"name": "projectsChildren",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--border"
},
"padding": [
0,
0,
0,
15
],
"children": [
{
"type": "rectangle",
"id": "EDcem",
"name": "guideLine",
"opacity": 0.3,
"fill": "$--muted-foreground",
"width": 1,
"height": "fill_container"
},
{
"type": "frame",
"id": "JCJJm",
"name": "childrenCol",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "a5wxq",
"name": "folder-laputa-app",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8,
5,
10
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "lvfG6",
"name": "chevA",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "TcyzB",
"name": "txtA",
"fill": "$--foreground",
"content": "laputa-app",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "cKYti",
"name": "folder-portfolio",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8,
5,
10
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "d2cZE",
"name": "chevB",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "yOW5x",
"name": "txtB",
"fill": "$--foreground",
"content": "portfolio-rewrite",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"type": "frame",
"id": "3KpjG",
"name": "folder-areas",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "037iD",
"name": "r2chev",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "9v2pP",
"name": "r2txt",
"fill": "$--foreground",
"content": "areas",
"fontFamily": "Inter",
"fontSize": 13
}
]
},
{
"type": "frame",
"id": "HdPM9",
"name": "folder-resources",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "z06Fw",
"name": "r3chev",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "VUtbZ",
"name": "r3txt",
"fill": "$--foreground",
"content": "resources",
"fontFamily": "Inter",
"fontSize": 13
}
]
},
{
"type": "frame",
"id": "I8Zit",
"name": "folder-journal",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "JA2qM",
"name": "r4chev",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "SstQO",
"name": "r4txt",
"fill": "$--foreground",
"content": "journal",
"fontFamily": "Inter",
"fontSize": 13
}
]
},
{
"type": "frame",
"id": "f7XnF",
"name": "folder-archive",
"width": "fill_container",
"cornerRadius": 5,
"gap": 8,
"padding": [
5,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "rxd69",
"name": "r6chev",
"width": 18,
"height": 18,
"iconFontName": "folder",
"iconFontFamily": "phosphor",
"fill": "$--foreground"
},
{
"type": "text",
"id": "KGVPg",
"name": "r6txt",
"fill": "$--foreground",
"content": "archive",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "V9xQR",
"name": "Commit Area",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": {
"top": 1
},
"fill": "$--border"
},
"layout": "vertical",
"padding": 12,
"children": [
{
"type": "frame",
"id": "liqOR",
"name": "commitBtn",
"width": "fill_container",
"fill": "$--primary",
"cornerRadius": 6,
"gap": 6,
"padding": [
8,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "sPe5s",
"name": "commitIcon",
"width": 14,
"height": 14,
"iconFontName": "git-commit-horizontal",
"iconFontFamily": "lucide",
"fill": "$--primary-foreground"
},
{
"type": "text",
"id": "pZZVy",
"name": "commitTxt",
"fill": "$--primary-foreground",
"content": "Commit & Push",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "500"
},
{
"type": "frame",
"id": "vEGYn",
"name": "commitBadge",
"height": 18,
"fill": "$--white-overlay",
"cornerRadius": 9,
"padding": [
0,
5
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "yOU4E",
"name": "commitBadgeTxt",
"fill": "$--white",
"content": "3",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "600"
}
]
}
]
}
]
}
]
},
{
"type": "rectangle",
"id": "HD9X6",
"name": "Resize Handle",
"fill": "$--border",
"width": 1,
"height": "fill_container"
},
{
"type": "frame",
"id": "gEkuO",
"name": "nlRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 300,
"height": "fill_container",
"fill": "$--card",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "ASdeI",
"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": "lG8Gf",
"name": "nlTitle",
"fill": "$--foreground",
"content": "Laputa App",
"fontFamily": "Inter",
"fontSize": 14,
"fontWeight": "600"
},
{
"type": "frame",
"id": "kduXx",
"name": "nlActions",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "SuxnI",
"name": "searchIcon",
"width": 16,
"height": 16,
"iconFontName": "magnifying-glass",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "uiZ6B",
"name": "plusIcon",
"width": 16,
"height": 16,
"iconFontName": "plus",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
}
]
},
{
"type": "frame",
"id": "U2rm1",
"name": "Note Items",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "dMz40",
"name": "Backlinks Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "VhcPh",
"name": "Note Item Selected",
"width": "fill_container",
"fill": "$--accent-red-light",
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
},
"fill": "$--border"
},
"children": [
{
"type": "rectangle",
"id": "HSk0P",
"name": "leftAccent",
"fill": "$--accent-red",
"width": 3,
"height": "fill_container"
},
{
"id": "5HpfH",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"stroke": {
"align": "inside",
"thickness": 0,
"fill": "#00000000"
},
"gap": 6,
"name": "nsel",
"height": "fit_content",
"x": 3,
"y": 0,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Laputa App",
"fontWeight": "600"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "wrench",
"fill": "$--accent-red",
"x": 251,
"y": 1
},
"vm86r": {
"content": "Personal knowledge and life management desktop app...",
"width": "fill_container",
"x": 16,
"y": 36
}
}
}
]
}
]
},
{
"type": "frame",
"id": "YoTrL",
"name": "Related Notes Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "czNrf",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h1",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Related Notes"
},
"Yh4xV": {
"content": "2",
"x": 80
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "hTq1s",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n1",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Portfolio Rewrite"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Redesigning portfolio site with modern stack and updated visual language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "8rf0u",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n2",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Sample note 2"
},
"pPh0z": {
"iconFontName": "leaf",
"fill": "$--accent-green",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Lorem ipsum dolor sit amet consequetur with modern stack and updated language...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
},
{
"type": "frame",
"id": "0Eqoj",
"name": "Events Group",
"width": "fill_container",
"layout": "vertical",
"children": [
{
"id": "cZPw7",
"type": "ref",
"ref": "CGiVI",
"width": "fill_container",
"name": "h2",
"y": 0,
"descendants": {
"rKzdN": {
"width": "fit_content",
"height": "fit_content",
"x": 16,
"y": 9.5
},
"xr1Bv": {
"content": "Events"
},
"Yh4xV": {
"content": "2",
"x": 42
},
"CGSHU": {
"width": "fit_content",
"height": "fit_content",
"x": 228,
"y": 10
},
"FcKJx": {
"x": 22
},
"dEkjQ": {
"x": 44
}
}
},
{
"id": "tQBDp",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n3",
"height": "fit_content",
"y": 32,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Grant"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
},
{
"id": "lYwoh",
"type": "ref",
"ref": "2nsLn",
"width": "fill_container",
"name": "n4",
"height": "fit_content",
"y": 120,
"descendants": {
"lOrq7": {
"width": "fill_container",
"height": "fit_content",
"x": 16,
"y": 14
},
"VlWUT": {
"width": "fill_container",
"height": "fit_content"
},
"kQ4LK": {
"content": "Meeting with Matteo"
},
"pPh0z": {
"iconFontFamily": "lucide",
"iconFontName": "calendar",
"fill": "$--accent-yellow",
"x": 254,
"y": 1
},
"vm86r": {
"content": "Discussed Q1 goals and hiring priorities with the engineering team leads...",
"width": "fill_container",
"x": 16,
"y": 38
}
}
}
]
}
]
},
{
"type": "frame",
"id": "1NIGv",
"name": "Filter Pills Bar",
"width": "fill_container",
"fill": {
"type": "gradient",
"gradientType": "linear",
"enabled": true,
"rotation": 0,
"size": {
"height": 1
},
"colors": [
{
"color": "#FFFFFF00",
"position": 0
},
{
"color": "#FFFFFFEE",
"position": 0.3
},
{
"color": "#FFFFFFFF",
"position": 1
}
]
},
"gap": 8,
"padding": [
12,
16
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "5bR8y",
"name": "Pill Week",
"fill": "$--accent-blue-light",
"cornerRadius": 9999,
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "HxHj5",
"name": "label",
"fill": "$--primary",
"content": "Week",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "A5UE4",
"name": "count",
"opacity": 0.7,
"fill": "$--primary",
"content": "12",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "iqFUf",
"name": "Pill Quarter",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "kMJqw",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Quarter",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "RODbT",
"name": "count",
"fill": "$--muted-foreground",
"content": "34",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
},
{
"type": "frame",
"id": "7I0m7",
"name": "Pill Year",
"fill": "$--secondary",
"cornerRadius": 9999,
"stroke": {
"thickness": 0
},
"gap": 6,
"padding": [
6,
14
],
"justifyContent": "center",
"alignItems": "center",
"children": [
{
"type": "text",
"id": "9B3ye",
"name": "label",
"fill": "$--secondary-foreground",
"content": "Year",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
},
{
"type": "text",
"id": "JBcjN",
"name": "count",
"fill": "$--muted-foreground",
"content": "86",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "600"
}
]
}
]
}
]
},
{
"type": "rectangle",
"id": "kwcqd",
"name": "Resize Handle 2",
"fill": "$--border",
"width": 1,
"height": "fill_container"
},
{
"type": "frame",
"id": "l7G2Z",
"name": "Panel: Editor",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"fill": "$--background",
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "oocuC",
"name": "Editor Body",
"width": "fill_container",
"height": "fill_container",
"children": [
{
"type": "frame",
"id": "KEJIl",
"name": "edRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"children": [
{
"id": "MQXyV",
"type": "ref",
"ref": "ABj4R",
"width": "fill_container",
"name": "ib",
"y": 0,
"stroke": {
"align": "inside",
"thickness": {
"bottom": 1
}
},
"descendants": {
"tahyf": {
"x": 16,
"y": 22.5
},
"LxtfH": {
"width": "fit_content",
"height": "fit_content",
"x": 484,
"y": 14.5
},
"S0HhS": {
"x": 28
},
"RMnGX": {
"x": 56
},
"Roqzk": {
"x": 84
},
"QWemM": {
"x": 112
}
}
},
{
"type": "frame",
"id": "aGrwk",
"name": "Editor Content",
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"gap": 16,
"padding": [
32,
64
],
"children": [
{
"type": "frame",
"id": "ecG43",
"name": "titleRow",
"width": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "q0oqT",
"name": "noteH1",
"fill": "$--foreground",
"content": "🗓️ Laputa App",
"lineHeight": 1.2,
"fontFamily": "Inter Tight",
"fontSize": 36,
"fontWeight": "700"
}
]
},
{
"type": "rectangle",
"id": "GtFgT",
"name": "titleSeparator",
"fill": "$--border",
"width": "fill_container",
"height": 1
},
{
"type": "text",
"id": "MlwLa",
"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": 15,
"fontWeight": "normal"
},
{
"type": "text",
"id": "RL4Dx",
"name": "editorH2",
"fill": "$--foreground",
"content": "Architecture",
"lineHeight": 1.3,
"fontFamily": "Inter",
"fontSize": 24,
"fontWeight": "600"
},
{
"type": "text",
"id": "6hyVX",
"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": 15,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "SIQfO",
"name": "insRef",
"theme": {
"Mode": "Light"
},
"clip": true,
"width": 260,
"height": "fill_container",
"fill": "$--background",
"stroke": {
"align": "inside",
"thickness": {
"left": 1
},
"fill": "$--border"
},
"layout": "vertical",
"children": [
{
"type": "frame",
"id": "GJO7K",
"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": "5pS5h",
"name": "leftGroup",
"gap": 8,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "oPLj4",
"name": "propIcon",
"width": 16,
"height": 16,
"iconFontName": "sliders",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "u9AYA",
"name": "inspTitle",
"fill": "$--muted-foreground",
"content": "Properties",
"fontFamily": "Inter",
"fontSize": 13,
"fontWeight": "600"
}
]
},
{
"type": "icon_font",
"id": "hTVfq",
"name": "sidebarIcon",
"width": 16,
"height": 16,
"iconFontName": "x",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
}
]
},
{
"type": "frame",
"id": "YQBB5",
"name": "Inspector Body",
"clip": true,
"width": "fill_container",
"height": "fill_container",
"layout": "vertical",
"padding": [
12,
0
],
"children": [
{
"type": "frame",
"id": "uT0iE",
"name": "Section Group 1",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
0,
12,
20,
12
],
"children": [
{
"type": "frame",
"id": "6Laox",
"name": "Properties Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"id": "gnLJk",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p1",
"height": "fit_content",
"x": 0,
"y": 0,
"descendants": {
"SS4ef": {
"content": "Type",
"y": 3,
"fontSize": 12,
"letterSpacing": 0
},
"lKjFb": {
"type": "frame",
"id": "Zncou",
"name": "newChip",
"fill": "$--accent-red-light",
"cornerRadius": 4,
"gap": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "vcxwP",
"name": "chipIco",
"width": 12,
"height": 12,
"iconFontName": "wrench",
"iconFontFamily": "phosphor",
"fill": "$--accent-red"
},
{
"type": "text",
"id": "akdl5",
"name": "chipTxt",
"fill": "$--accent-red",
"content": "Project",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "i8AYj",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p2",
"height": "fit_content",
"x": 0,
"y": 29,
"descendants": {
"SS4ef": {
"content": "Status",
"y": 3
},
"lKjFb": {
"type": "frame",
"id": "eqe9E",
"name": "statusChip",
"fill": "$--accent-green-light",
"cornerRadius": 4,
"gap": 6,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "ellipse",
"id": "hjrL6",
"name": "statusDot",
"fill": "$--accent-green",
"width": 6,
"height": 6
},
{
"type": "text",
"id": "FAztt",
"name": "statusTxt",
"fill": "$--accent-green",
"content": "Active",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
}
},
{
"id": "2aUYf",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p3",
"height": "fit_content",
"x": 0,
"y": 58,
"descendants": {
"SS4ef": {
"content": "Date",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 142
},
"38JOz": {
"content": "Mar 23, 2026",
"x": 8,
"y": 3
}
}
},
{
"id": "QxHTY",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p4",
"height": "fit_content",
"x": 0,
"y": 87,
"descendants": {
"SS4ef": {
"content": "URL",
"y": 3
},
"lKjFb": {
"fill": "transparent",
"width": "fit_content",
"height": "fit_content",
"x": 131
},
"38JOz": {
"content": "acme.dev/docs",
"fill": "$--primary",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "ifID2",
"name": "propArchived",
"width": "fill_container",
"height": 21,
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "ENYTp",
"name": "propArchivedLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "sLZpE",
"name": "archivedTxt",
"fill": "$--muted-foreground",
"content": "Archived",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "GBwmg",
"name": "propArchivedToggle",
"width": 15,
"height": 15,
"fill": "$--background",
"cornerRadius": 3,
"stroke": {
"align": "inside",
"thickness": 1.5,
"fill": "$--border"
}
}
]
},
{
"type": "frame",
"id": "Urufa",
"name": "propTags",
"width": "fill_container",
"justifyContent": "space_between",
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "t7x4Q",
"name": "propTagsLbl",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "text",
"id": "oRDgI",
"name": "tagsTxt",
"fill": "$--muted-foreground",
"content": "Tags",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "kqyQ4",
"name": "propTagsChips",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "m6Z8U",
"name": "tagChip1",
"fill": "$--accent-purple-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "4LKxL",
"name": "tag1txt",
"fill": "$--accent-purple",
"content": "v2",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
},
{
"type": "frame",
"id": "WZKJn",
"name": "tagChip2",
"fill": "$--accent-orange-light",
"cornerRadius": 4,
"padding": [
3,
8
],
"alignItems": "center",
"children": [
{
"type": "text",
"id": "dguRE",
"name": "tag2txt",
"fill": "$--accent-orange",
"content": "docs",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "500"
}
]
}
]
}
]
},
{
"id": "xaKek",
"type": "ref",
"ref": "2bVOu",
"width": "fill_container",
"name": "p5",
"height": "fit_content",
"x": 0,
"y": 174,
"descendants": {
"SS4ef": {
"content": "Author",
"y": 3
},
"lKjFb": {
"width": "fit_content",
"height": "fit_content",
"x": 192
},
"38JOz": {
"content": "Luca",
"x": 8,
"y": 3
}
}
},
{
"type": "frame",
"id": "v6jWn",
"name": "addPropRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "503Xx",
"name": "addIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "D0U3S",
"name": "addTxt",
"opacity": 0.5,
"rotation": -0.43548563406852797,
"fill": "$--muted-foreground",
"content": "Add property",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "2ATek",
"name": "Relationships Section",
"width": "fill_container",
"layout": "vertical",
"gap": 16,
"children": [
{
"type": "frame",
"id": "tXTui",
"name": "relGroup1",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "x6MGE",
"name": "relGrp1Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "WyIlJ",
"name": "belongsIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "ySLwx",
"name": "belongsTxt",
"fill": "$--muted-foreground",
"content": "Belongs to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "oWXIe",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r1",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Laputa",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"id": "eRfdI",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"name": "r2",
"height": "fit_content",
"x": 0,
"y": 50,
"descendants": {
"OTLK6": {
"content": "Building",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "tag",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "mQRif",
"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": "m6BqZ",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "I7qBC",
"name": "relGroup2",
"width": "fill_container",
"layout": "vertical",
"gap": 4,
"children": [
{
"type": "frame",
"id": "cOazX",
"name": "relGrp2Title",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "mBTjs",
"name": "relatedIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-up-right",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "G8vvT",
"name": "relatedTxt",
"fill": "$--muted-foreground",
"content": "Related to",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"id": "KWfe9",
"type": "ref",
"ref": "n6iwQ",
"width": "fill_container",
"fill": "$--accent-red-light",
"name": "r3",
"height": "fit_content",
"x": 0,
"y": 19,
"descendants": {
"OTLK6": {
"content": "Shadcn Migration",
"fill": "$--accent-red",
"x": 10,
"y": 6
},
"s37c7": {
"iconFontName": "flask",
"fill": "$--accent-red",
"x": 212,
"y": 6.5
}
}
},
{
"type": "frame",
"id": "ZsMZJ",
"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": "gf8IP",
"name": "laputaTxt",
"fill": "$--muted-foreground",
"content": "+ Link existing",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "frame",
"id": "rZ32x",
"name": "addRelRow",
"width": "fill_container",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "WMqYk",
"name": "addRelIco",
"opacity": 0.5,
"width": 12,
"height": 12,
"iconFontName": "plus",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "Z0Xjw",
"name": "addRelTxt",
"opacity": 0.5,
"fill": "$--muted-foreground",
"content": "Add relationship",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
}
]
},
{
"id": "8dTwx",
"type": "ref",
"ref": "comp_Separator",
"name": "sep1",
"width": "fill_container",
"x": 0,
"y": 502.577211185393
},
{
"type": "frame",
"id": "aqqat",
"name": "Section Group 2",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12
],
"children": [
{
"type": "frame",
"id": "k1Da6",
"name": "Backlinks Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "EXpUD",
"name": "blTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "frame",
"id": "PYpPc",
"name": "blTitleTxt",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "2U4ji",
"name": "blIco",
"width": 12,
"height": 12,
"iconFontName": "arrow-down-left",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "U1RX7",
"name": "blTxt",
"fill": "$--muted-foreground",
"content": "Backlinks",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"type": "text",
"id": "iCMpl",
"name": "blItem1",
"fill": "$--primary",
"content": "Portfolio Rewrite",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "KbNWM",
"name": "blItem2",
"fill": "$--primary",
"content": "Meeting with Grant",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
},
{
"type": "text",
"id": "5uRiP",
"name": "blItem3",
"fill": "$--primary",
"content": "Q1 Planning",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
}
]
},
{
"id": "781CE",
"type": "ref",
"ref": "comp_Separator",
"name": "sep2",
"width": "fill_container",
"x": 0,
"y": 627.577211185393
},
{
"type": "frame",
"id": "1lv1P",
"name": "Section Group 3",
"width": "fill_container",
"layout": "vertical",
"gap": 20,
"padding": [
20,
12,
0,
12
],
"children": [
{
"type": "frame",
"id": "y2ihJ",
"name": "History Section",
"width": "fill_container",
"layout": "vertical",
"gap": 8,
"children": [
{
"type": "frame",
"id": "9McCK",
"name": "histTitle",
"gap": 4,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "voB01",
"name": "histIco",
"width": 12,
"height": 12,
"iconFontName": "clock-counter-clockwise",
"iconFontFamily": "phosphor",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "7U2jU",
"name": "histTxt",
"fill": "$--muted-foreground",
"content": "History",
"fontFamily": "Inter",
"fontSize": 12,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "eM4AA",
"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": "BkaQW",
"name": "histItem1Hash",
"fill": "$--accent-blue",
"content": "a089f44 · feat: migrate to shadcn/ui",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "USetN",
"name": "histItem1Date",
"fill": "$--muted-foreground",
"content": "Feb 16, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "Sq3V0",
"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": "B8D8M",
"name": "histItem2Hash",
"fill": "$--accent-blue",
"content": "5a4b4ac · feat: emoji favicon",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "KcUft",
"name": "histItem2Date",
"fill": "$--muted-foreground",
"content": "Feb 15, 2026",
"fontFamily": "Inter",
"fontSize": 10,
"fontWeight": "normal"
}
]
}
]
}
]
}
]
}
]
}
]
}
]
}
]
},
{
"type": "frame",
"id": "9QgAe",
"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": "HvdQl",
"name": "Status Left",
"height": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "z41bj",
"name": "versionIcon",
"width": 14,
"height": 14,
"iconFontName": "box",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "2F5m9",
"name": "versionText",
"fill": "$--muted-foreground",
"content": "v0.4.2",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "500"
},
{
"type": "text",
"id": "3zlVi",
"name": "sep1",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "DGW93",
"name": "branchIcon",
"width": 14,
"height": 14,
"iconFontName": "git-branch",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "NieED",
"name": "branchText",
"fill": "$--muted-foreground",
"content": "main",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "XaTaL",
"name": "sep2",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "baJ34",
"name": "syncIcon",
"width": 13,
"height": 13,
"iconFontName": "refresh-cw",
"iconFontFamily": "lucide",
"fill": "$--accent-green"
},
{
"type": "text",
"id": "2be9I",
"name": "syncText",
"fill": "$--muted-foreground",
"content": "Synced 2m ago",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
}
]
},
{
"type": "frame",
"id": "RrTfE",
"name": "Status Right",
"height": "fill_container",
"gap": 12,
"alignItems": "center",
"children": [
{
"type": "icon_font",
"id": "R3SB6",
"name": "aiIcon",
"width": 13,
"height": 13,
"iconFontName": "sparkles",
"iconFontFamily": "lucide",
"fill": "$--accent-purple"
},
{
"type": "text",
"id": "uj6GM",
"name": "aiText",
"fill": "$--muted-foreground",
"content": "Claude Sonnet 4",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "l3SNr",
"name": "sep3",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "zKhu2",
"name": "notesCount",
"width": 13,
"height": 13,
"iconFontName": "file-text",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "text",
"id": "SipxO",
"name": "notesText",
"fill": "$--muted-foreground",
"content": "1,247 notes",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "text",
"id": "R7hFy",
"name": "sep4",
"fill": "$--border",
"content": "|",
"fontFamily": "Inter",
"fontSize": 11,
"fontWeight": "normal"
},
{
"type": "icon_font",
"id": "4ki4j",
"name": "bellIcon",
"width": 13,
"height": 13,
"iconFontName": "bell",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
},
{
"type": "icon_font",
"id": "VIzQo",
"name": "settingsIcon",
"width": 13,
"height": 13,
"iconFontName": "settings",
"iconFontFamily": "lucide",
"fill": "$--muted-foreground"
}
]
}
]
}
]
}
],
"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"
}
}
]
},
"--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"
}
}
]
},
"--muted-foreground": {
"type": "color",
"value": [
{
"value": "#787774"
},
{
"value": "#888888",
"theme": {
"Mode": "Dark"
}
}
]
},
"--popover": {
"type": "color",
"value": [
{
"value": "#FFFFFF"
},
{
"value": "#1e1e3a",
"theme": {
"Mode": "Dark"
}
}
]
},
"--popover-foreground": {
"type": "color",
"value": [
{
"value": "#37352F"
},
{
"value": "#e0e0e0",
"theme": {
"Mode": "Dark"
}
}
]
},
"--primary": {
"type": "color",
"value": [
{
"value": "#2383E2"
},
{
"value": "#4a9eff",
"theme": {
"Mode": "Dark"
}
},
{
"value": "#155DFF"
},
{
"value": "#155DFF",
"theme": {
"Mode": "Dark"
}
}
]
},
"--primary-foreground": {
"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"
}
}
]
},
"--sidebar": {
"type": "color",
"value": [
{
"value": "#F7F6F3"
},
{
"value": "#1a1a2e",
"theme": {
"Mode": "Dark"
}
}
]
},
"--sidebar-accent": {
"type": "color",
"value": [
{
"value": "#EBEBEA"
},
{
"value": "#252545",
"theme": {
"Mode": "Dark"
}
}
]
},
"--sidebar-accent-foreground": {
"type": "color",
"value": [
{
"value": "#37352F"
},
{
"value": "#ffffff",
"theme": {
"Mode": "Dark"
}
}
]
},
"--sidebar-border": {
"type": "color",
"value": [
{
"value": "#E9E9E7"
},
{
"value": "#2a2a4a",
"theme": {
"Mode": "Dark"
}
}
]
},
"--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"
}
}
]
},
"--spacing-xs": {
"type": "number",
"value": 4
},
"--spacing-sm": {
"type": "number",
"value": 8
},
"--spacing-md": {
"type": "number",
"value": 12
},
"--spacing-lg": {
"type": "number",
"value": 16
},
"--spacing-xl": {
"type": "number",
"value": 24
},
"--spacing-2xl": {
"type": "number",
"value": 32
},
"--spacing-3xl": {
"type": "number",
"value": 40
},
"--height-titlebar": {
"type": "number",
"value": 38
},
"--height-tabbar": {
"type": "number",
"value": 45
},
"--height-breadcrumb": {
"type": "number",
"value": 45
},
"--height-statusbar": {
"type": "number",
"value": 30
},
"--height-search-bar": {
"type": "number",
"value": 40
},
"--height-note-item": {
"type": "number",
"value": 64
},
"--height-inspector-header": {
"type": "number",
"value": 36
},
"--height-modal-header": {
"type": "number",
"value": 56
},
"--height-modal-footer": {
"type": "number",
"value": 56
},
"--shadow-sm": {
"type": "string",
"value": "0 1px 2px rgba(0,0,0,0.05)"
},
"--shadow-md": {
"type": "string",
"value": "0 4px 6px rgba(0,0,0,0.07)"
},
"--shadow-lg": {
"type": "string",
"value": "0 10px 15px rgba(0,0,0,0.1)"
},
"--font-mono": {
"type": "string",
"value": "IBM Plex Mono, monospace"
},
"--search-bg": {
"type": "color",
"value": [
{
"value": "#FFFFFF"
},
{
"value": "#1E1E2E",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-input-bg": {
"type": "color",
"value": [
{
"value": "#F0F0EF"
},
{
"value": "#2A2A3C",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-text": {
"type": "color",
"value": [
{
"value": "#37352F"
},
{
"value": "#ccccdd",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-text-muted": {
"type": "color",
"value": [
{
"value": "#787774"
},
{
"value": "#8888aa",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-text-dim": {
"type": "color",
"value": [
{
"value": "#787774"
},
{
"value": "#666680",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-heading": {
"type": "color",
"value": [
{
"value": "#37352F"
},
{
"value": "#e0e0f0",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-border": {
"type": "color",
"value": [
{
"value": "#E9E9E7"
},
{
"value": "#4c4c6d",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-highlight": {
"type": "color",
"value": [
{
"value": "#37352F"
},
{
"value": "#555570",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-snippet": {
"type": "color",
"value": [
{
"value": "#787774"
},
{
"value": "#888899",
"theme": {
"Mode": "Dark"
}
}
]
},
"--search-count": {
"type": "color",
"value": [
{
"value": "#787774"
},
{
"value": "#c0c0d0",
"theme": {
"Mode": "Dark"
}
}
]
},
"--traffic-red": {
"type": "color",
"value": "#ff5f57"
},
"--traffic-yellow": {
"type": "color",
"value": "#febc2e"
},
"--traffic-green": {
"type": "color",
"value": "#28c840"
},
"--white-overlay": {
"type": "color",
"value": "#ffffff40"
},
"--accent-orange-light": {
"type": "color",
"value": "#D9730D14"
}
},
"fonts": [
{
"name": "GT Pressura Trial",
"url": "GT-Pressura-Regular-Trial.otf"
}
]
}
Reference in New Issue View Git Blame Copy Permalink