<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="701px" height="341px" viewBox="-0.5 -0.5 701 341" content="&lt;mxfile host=&quot;Electron&quot; modified=&quot;2022-06-10T18:09:34.213Z&quot; agent=&quot;5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) draw.io/14.5.1 Chrome/89.0.4389.82 Electron/12.0.1 Safari/537.36&quot; version=&quot;14.5.1&quot; etag=&quot;_-5RhmXxVU02xmgK7WC4&quot; type=&quot;device&quot;&gt;&lt;diagram id=&quot;fhML0nd2t9HE8folxyzR&quot;&gt;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&lt;/diagram&gt;&lt;/mxfile&gt;"><defs/><g><rect x="0" y="0" width="700" height="340" fill="none" stroke="none" pointer-events="all"/><path d="M 21.05 38.48 L 478.11 41.01 L 480.69 319.99 L 19.39 321.78" fill="#ffffff" stroke="none" pointer-events="all"/><path d="M 20.93 39.69 C 162.3 37.4 305.88 37.33 479.45 39.94 M 20.38 40.06 C 119.63 37.89 219 38.11 480.26 39.74 M 479.24 40.1 C 481.68 110.45 482.12 178.95 480.78 319.18 M 479.96 40.04 C 479.99 150.56 479.89 262.78 479.45 319.73 M 479.9 320.13 C 350.64 317.36 220.56 318.11 20.82 320.29 M 480.16 319.83 C 378.76 321.15 277.61 321.93 19.61 319.66 M 19.85 320.43 C 21.07 221.03 20.44 119.47 20.14 40.49 M 19.85 320.31 C 18.19 259.04 17.81 195.98 20.25 39.23" fill="none" stroke="#b3b3b3" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-end; justify-content: unsafe center; width: 458px; height: 1px; padding-top: 317px; margin-left: 21px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #B3B3B3; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">Page with "center" horizontal alignment</div></div></div></foreignObject><text x="250" y="317" fill="#B3B3B3" font-family="Helvetica" font-size="12px" text-anchor="middle">Page with "center" horizontal alignment</text></switch></g><rect x="110.11" y="70" width="280" height="190" fill="#ffddff" stroke="#b266ff" stroke-dasharray="1 2" pointer-events="all"/><rect x="225.11" y="-25" width="50" height="260" fill="#ffffff" stroke="#000000" stroke-dasharray="1 2" transform="rotate(90,250.11,105)" pointer-events="all"/><rect x="130.11" y="90" width="199.89" height="30" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 198px; height: 1px; padding-top: 105px; margin-left: 131px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">"new_task" TextField</div></div></div></foreignObject><text x="230" y="109" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">"new_task" TextField</text></switch></g><rect x="340" y="90" width="30.11" height="30" rx="4.5" ry="4.5" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 28px; height: 1px; padding-top: 105px; margin-left: 341px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "> + </div></div></div></foreignObject><text x="355" y="109" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle"> + </text></switch></g><rect x="195.11" y="65" width="110" height="260" fill="#ffffff" stroke="#000000" stroke-dasharray="1 2" transform="rotate(90,250.11,195)" pointer-events="all"/><rect x="500" y="70" width="150" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 148px; height: 1px; padding-top: 85px; margin-left: 502px;"><div style="box-sizing: border-box; font-size: 0; text-align: left; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><b style="font-size: 12px">Row </b>with <b style="font-size: 12px">TextField </b>and <b>FloatingAction</b><b style="font-size: 12px">Button</b></div></div></div></foreignObject><text x="502" y="89" fill="#000000" font-family="Helvetica" font-size="12px">Row with TextField and Fl...</text></switch></g><path d="M 500 85 L 376.17 87.98" fill="none" stroke="#4d4d4d" stroke-miterlimit="10" pointer-events="stroke"/><ellipse cx="375.17" cy="88" rx="1" ry="1" fill="#4d4d4d" stroke="#4d4d4d" pointer-events="all"/><rect x="130.11" y="150" width="20" height="20" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 18px; height: 1px; padding-top: 160px; margin-left: 131px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">V</div></div></div></foreignObject><text x="140" y="164" fill="#000000" font-family="Helvetica" font-size="12px" text-anchor="middle">V</text></switch></g><rect x="160.11" y="151" width="100" height="19" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 161px; margin-left: 162px;"><div style="box-sizing: border-box; font-size: 0; text-align: left; "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">Create ToDo App</div></div></div></foreignObject><text x="162" y="164" fill="#000000" font-family="Helvetica" font-size="11px">Create ToDo App</text></switch></g><rect x="130.11" y="180" width="20" height="20" fill="#dae8fc" stroke="#6c8ebf" pointer-events="all"/><rect x="160.11" y="181" width="160" height="19" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 158px; height: 1px; padding-top: 191px; margin-left: 162px;"><div style="box-sizing: border-box; font-size: 0; text-align: left; "><div style="display: inline-block; font-size: 11px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">Share app with colleagues</div></div></div></foreignObject><text x="162" y="194" fill="#000000" font-family="Helvetica" font-size="11px">Share app with colleagues</text></switch></g><rect x="500" y="130" width="150" height="31" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 148px; height: 1px; padding-top: 146px; margin-left: 502px;"><div style="box-sizing: border-box; font-size: 0; text-align: left; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; ">"tasks_view" <b>Column<span style="font-size: 12px"> </span></b>with a list of <b style="font-size: 12px">Checkboxes</b></div></div></div></foreignObject><text x="502" y="149" fill="#000000" font-family="Helvetica" font-size="12px">"tasks_view" Column with...</text></switch></g><path d="M 500 145.5 L 336.38 169.88" fill="none" stroke="#4d4d4d" stroke-miterlimit="10" pointer-events="stroke"/><ellipse cx="335.39" cy="170.03" rx="1" ry="1" fill="#4d4d4d" stroke="#4d4d4d" pointer-events="all"/><path d="M 18.64 18.81 L 481.66 18.58 L 481.32 39.95 L 18.86 41.89" fill="#ffffff" stroke="none" pointer-events="all"/><path d="M 19.59 20.05 C 162.9 21.44 306.47 20.26 479.92 20.56 M 20.36 19.59 C 178.01 20.57 335.32 21.09 480.38 19.55 M 479.25 20.65 C 478.8 24.32 478.88 30.65 480.29 41.37 M 480.06 20.88 C 480.95 26.58 479.61 32.76 479.11 39.63 M 479.8 40.47 C 381.07 41.54 281.75 41.13 20.09 39.48 M 480.12 40.35 C 387.02 41.37 294.63 41.57 19.57 40.33 M 19.3 39 C 19.29 35.55 19.56 25.75 20.3 19.63 M 19.21 40.35 C 19.99 32.93 20.71 24.96 19.31 20.59" fill="none" stroke="#b3b3b3" stroke-linejoin="round" stroke-linecap="round" stroke-miterlimit="10" pointer-events="all"/><ellipse cx="30" cy="30" rx="5" ry="5" fill="#ff3333" stroke="none" pointer-events="all"/><ellipse cx="60" cy="30" rx="5" ry="5" fill="#66cc00" stroke="none" pointer-events="all"/><ellipse cx="45" cy="30" rx="5" ry="5" fill="#ffd966" stroke="none" pointer-events="all"/><rect x="72" y="25" width="398" height="10" rx="5" ry="5" fill="#ffffff" stroke="#b3b3b3" pointer-events="all"/><path d="M 112.13 276.95 L 386.87 276.13" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 118 274.6 L 111.01 276.96 L 118.01 279.27" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="all"/><path d="M 381 278.48 L 387.99 276.12 L 380.99 273.81" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 277px; margin-left: 250px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 9px; font-family: Helvetica; color: #B3B3B3; line-height: 1.2; pointer-events: all; background-color: #ffffff; white-space: nowrap; ">width=600</div></div></div></foreignObject><text x="250" y="280" fill="#B3B3B3" font-family="Helvetica" font-size="9px" text-anchor="middle">width=600</text></switch></g><rect x="500" y="210" width="190" height="30" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe flex-start; width: 188px; height: 1px; padding-top: 225px; margin-left: 502px;"><div style="box-sizing: border-box; font-size: 0; text-align: left; "><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: #000000; line-height: 1.2; pointer-events: all; white-space: normal; word-wrap: normal; "><span style="font-size: 12px">"view"<b> Column</b></span><b style="font-size: 12px"> </b>containing Row with TextField and Button and "tasks_view" Column</div></div></div></foreignObject><text x="502" y="229" fill="#000000" font-family="Helvetica" font-size="12px">"view" Column containing Row wi...</text></switch></g><path d="M 500 225 L 385.23 226.92" fill="none" stroke="#4d4d4d" stroke-miterlimit="10" pointer-events="stroke"/><ellipse cx="384.23" cy="226.94" rx="1" ry="1" fill="#4d4d4d" stroke="#4d4d4d" pointer-events="all"/><path d="M 133.24 55.83 L 327.76 55.01" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="stroke"/><path d="M 139.11 53.47 L 132.12 55.84 L 139.13 58.14" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="all"/><path d="M 321.89 57.37 L 328.88 55 L 321.87 52.7" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject style="overflow: visible; text-align: left;" pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 1px; height: 1px; padding-top: 56px; margin-left: 240px;"><div style="box-sizing: border-box; font-size: 0; text-align: center; "><div style="display: inline-block; font-size: 7px; font-family: Helvetica; color: #B3B3B3; line-height: 1.2; pointer-events: all; background-color: #ffffff; white-space: nowrap; ">Expand = True</div></div></div></foreignObject><text x="240" y="58" fill="#B3B3B3" font-family="Helvetica" font-size="7px" text-anchor="middle">Expand = True</text></switch></g><path d="M 130 50 L 130.11 90" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" stroke-dasharray="1 1" pointer-events="stroke"/><path d="M 330 50 L 330 90" fill="none" stroke="#b3b3b3" stroke-miterlimit="10" stroke-dasharray="1 1" pointer-events="stroke"/></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Viewer does not support full SVG 1.1</text></a></switch></svg>