whyrating/.context/turbostarter-framework-context/wireframes/themed/templates/components/header.excalidraw

{
  "type": "excalidraw",
  "version": 2,
  "source": "turbostarter-wireframes",
  "elements": [
    {
      "id": "header-container",
      "type": "rectangle",
      "x": 0,
      "y": 0,
      "width": 1160,
      "height": 64,
      "strokeColor": "#e5e5e5",
      "backgroundColor": "#ffffff",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false
    },
    {
      "id": "title-text",
      "type": "text",
      "x": 24,
      "y": 14,
      "width": 200,
      "height": 24,
      "strokeColor": "#1a1a1a",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "title-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false,
      "text": "Page Title",
      "fontSize": 20,
      "fontFamily": 1,
      "textAlign": "left",
      "verticalAlign": "top",
      "baseline": 18
    },
    {
      "id": "description-text",
      "type": "text",
      "x": 24,
      "y": 42,
      "width": 300,
      "height": 16,
      "strokeColor": "#e5e5e5",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "title-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false,
      "text": "Brief description of this page",
      "fontSize": 14,
      "fontFamily": 1,
      "textAlign": "left",
      "verticalAlign": "top",
      "baseline": 12
    },
    {
      "id": "breadcrumb-area",
      "type": "rectangle",
      "x": 360,
      "y": 22,
      "width": 400,
      "height": 20,
      "strokeColor": "transparent",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "breadcrumb-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false
    },
    {
      "id": "breadcrumb-text",
      "type": "text",
      "x": 360,
      "y": 22,
      "width": 200,
      "height": 20,
      "strokeColor": "#e5e5e5",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "breadcrumb-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false,
      "text": "Home > Section > Current",
      "fontSize": 12,
      "fontFamily": 1,
      "textAlign": "left",
      "verticalAlign": "middle",
      "baseline": 10
    },
    {
      "id": "help-icon",
      "type": "ellipse",
      "x": 1000,
      "y": 14,
      "width": 36,
      "height": 36,
      "strokeColor": "#e5e5e5",
      "backgroundColor": "#ffffff",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "actions-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false
    },
    {
      "id": "help-icon-text",
      "type": "text",
      "x": 1012,
      "y": 22,
      "width": 12,
      "height": 20,
      "strokeColor": "#e5e5e5",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "actions-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false,
      "text": "?",
      "fontSize": 16,
      "fontFamily": 1,
      "textAlign": "center",
      "verticalAlign": "middle",
      "baseline": 14
    },
    {
      "id": "action-button",
      "type": "rectangle",
      "x": 1048,
      "y": 14,
      "width": 100,
      "height": 36,
      "strokeColor": "transparent",
      "backgroundColor": "#f97316",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "actions-group"
      ],
      "roundness": {
        "type": 3,
        "value": 8
      },
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false
    },
    {
      "id": "action-button-text",
      "type": "text",
      "x": 1068,
      "y": 24,
      "width": 60,
      "height": 16,
      "strokeColor": "#ffffff",
      "backgroundColor": "transparent",
      "fillStyle": "solid",
      "strokeWidth": 1,
      "roughness": 0,
      "opacity": 100,
      "groupIds": [
        "header-group",
        "actions-group"
      ],
      "roundness": null,
      "isDeleted": false,
      "boundElements": null,
      "link": null,
      "locked": false,
      "text": "Action",
      "fontSize": 14,
      "fontFamily": 1,
      "textAlign": "center",
      "verticalAlign": "middle",
      "baseline": 12
    }
  ],
  "appState": {
    "gridSize": 20,
    "viewBackgroundColor": "$background"
  }
}