diff options
Diffstat (limited to 'documentation/layout')
| -rw-r--r-- | documentation/layout/img/layout-intro-example-1.png | bin | 21093 -> 46039 bytes | |||
| -rw-r--r-- | documentation/layout/img/layout-schematic-hi.png | bin | 0 -> 54267 bytes | |||
| -rw-r--r-- | documentation/layout/layout-gridlayout.asciidoc | 81 | ||||
| -rw-r--r-- | documentation/layout/layout-orderedlayout.asciidoc | 50 | ||||
| -rw-r--r-- | documentation/layout/layout-overview.asciidoc | 48 | ||||
| -rw-r--r-- | documentation/layout/original-drawings/Makefile | 17 | ||||
| -rw-r--r-- | documentation/layout/original-drawings/layout-schematic.svg | 546 |
7 files changed, 622 insertions, 120 deletions
diff --git a/documentation/layout/img/layout-intro-example-1.png b/documentation/layout/img/layout-intro-example-1.png Binary files differindex e69ffb1ba1..1829a4feb7 100644 --- a/documentation/layout/img/layout-intro-example-1.png +++ b/documentation/layout/img/layout-intro-example-1.png diff --git a/documentation/layout/img/layout-schematic-hi.png b/documentation/layout/img/layout-schematic-hi.png Binary files differnew file mode 100644 index 0000000000..89fe14362a --- /dev/null +++ b/documentation/layout/img/layout-schematic-hi.png diff --git a/documentation/layout/layout-gridlayout.asciidoc b/documentation/layout/layout-gridlayout.asciidoc index 4ffabfb318..e96aa8e2bd 100644 --- a/documentation/layout/layout-gridlayout.asciidoc +++ b/documentation/layout/layout-gridlayout.asciidoc @@ -54,12 +54,12 @@ date.setResolution(DateField.RESOLUTION_DAY); grid.addComponent(date, 2, 2, 3, 3); ---- -The resulting layout will look as follows. The borders have been made visible to -illustrate the layout cells. +The resulting layout is shown in <<figure.layout.gridlayout>>. +The borders have been made visible to illustrate the layout cells. -[[figure.ui.gridlayout]] -.The Grid Layout Component -image::img/gridlayout.png[] +[[figure.layout.gridlayout]] +.The [classname]#GridLayout# component +image::img/gridlayout.png[width=50%, scaledwidth=75%] A component to be placed on the grid must not overlap with existing components. A conflict causes throwing a [classname]#GridLayout.OverlapsException#. @@ -103,8 +103,6 @@ the Debug Mode">>. ==== - - Often, you want to have one or more rows or columns that take all the available space left over from non-expanding rows or columns. You need to set the rows or columns as __expanding__ with [methodname]#setRowExpandRatio()# and @@ -116,7 +114,6 @@ multiple expanding rows or columns, the ratio parameter sets the relative portion how much a specific row/column will take in relation with the other expanding rows/columns. - [source, java] ---- GridLayout grid = new GridLayout(3,2); @@ -153,7 +150,7 @@ for (int col=0; col<grid.getColumns(); col++) { for (int row=0; row<grid.getRows(); row++) { Component c = grid.getComponent(col, row); grid.setComponentAlignment(c, Alignment.TOP_CENTER); - + // Make the labels high to illustrate the empty // horizontal space. if (col != 0 || row != 0) @@ -163,8 +160,8 @@ for (int col=0; col<grid.getColumns(); col++) { ---- [[figure.ui.gridlayout.sizing.expanding]] -.Expanding Rows and Columns in [classname]#GridLayout# -image::img/gridlayout_sizing_expanding.png[] +.Expanding rows and columns in [classname]#GridLayout# +image::img/gridlayout_sizing_expanding.png[width=75%, scaledwidth=100%] If the size of the contained components is undefined or fixed, the expansion ratio is of the __excess__ space, as in @@ -177,68 +174,18 @@ example, if we had a 100 pixels wide grid layout with two columns with 1.0 and [methodname]#setWidth("100%")#, the columns would have respective widths of 20 and 80 pixels, regardless of the minimum size of their contained components. - +[[layout.gridlayout.css]] == CSS Style Rules - [source, css] ---- .v-gridlayout {} .v-gridlayout-margin {} ---- -The v-gridlayout is the root element of the [classname]#GridLayout# component. -The v-gridlayout-margin is a simple element inside it that allows setting a -padding between the outer element and the cells. - -For styling the individual grid cells, you should style the components inserted -in the cells. The implementation structure of the grid can change, so depending -on it, as is done in the example below, is not generally recommended. Normally, -if you want to have, for example, a different color for a certain cell, just -make set the component inside it [methodname]#setSizeFull()#, and add a style -name for it. Sometimes you may need to use a layout component between a cell and -its actual component just for styling. - -The following example shows how to make the grid borders visible, as in -<<figure.ui.gridlayout.sizing.expanding>>. - - -[source, java] ----- -.v-gridlayout-gridexpandratio { - background: blue; /* Creates a "border" around the grid. */ - margin: 10px; /* Empty space around the layout. */ -} - -/* Add padding through which the background color shows. */ -.v-gridlayout-gridexpandratio .v-gridlayout-margin { - padding: 2px; -} - -/* Add cell borders and make the cell backgrounds white. - * Warning: This depends heavily on the HTML structure. */ -.v-gridlayout-gridexpandratio > div > div > div { - padding: 2px; /* Layout background will show through. */ - background: white; /* The cells will be colored white. */ -} - -/* Components inside the layout are a safe way to style cells. */ -.v-gridlayout-gridexpandratio .v-label { - text-align: left; - background: #ffffc0; /* Pale yellow */ -} ----- - -You should beware of [literal]#++margin++#, [literal]#++padding++#, and -[literal]#++border++# settings in CSS as they can mess up the layout. The -dimensions of layouts are calculated in the Client-Side Engine of Vaadin and -some settings can interfere with these calculations. For more information, on -margins and spacing, see -<<dummy/../../../framework/layout/layout-settings#layout.settings.spacing,"Layout -Cell Spacing">> and -<<dummy/../../../framework/layout/layout-settings#layout.settings.margins,"Layout -Margins">> - - - +The `v-gridlayout` is the root element of the [classname]#GridLayout# component. +The `v-gridlayout-margin` is a simple element inside it that allows setting a padding between the outer element and the cells. +For styling the individual grid cells, you should style the components inserted in the cells. +Normally, if you want to have, for example, a different color for a certain cell, just make set the component inside it [methodname]#setSizeFull()#, and add a style name for it. +Sometimes, you may need to wrap a component inside a layout component just for styling the cell. diff --git a/documentation/layout/layout-orderedlayout.asciidoc b/documentation/layout/layout-orderedlayout.asciidoc index 7cd2c7772d..4e0d53bbed 100644 --- a/documentation/layout/layout-orderedlayout.asciidoc +++ b/documentation/layout/layout-orderedlayout.asciidoc @@ -31,14 +31,13 @@ layout.addComponent(vertical); ---- See the http://demo.vaadin.com/book-examples-vaadin7/book#layout.orderedlayout.basic[on-line example, window="_blank"]. -The component captions are placed above the component, so the layout will look -as follows: +In [classname]#VerticalLayout#, the captions of child components are placed above each component, so the layout would look as follows: -image::img/orderedlayout_vertical.png[] +image::img/orderedlayout_vertical.png[width=30%, scaledwidth=65%] -Using [classname]#HorizontalLayout# gives the following layout: +[classname]#HorizontalLayout# gives the following layout: -image::img/orderedlayout_horizontal.png[] +image::img/orderedlayout_horizontal.png[width=80%, scaledwidth=100%] [[layout.orderedlayout.properties]] == Properties or Attributes @@ -48,18 +47,16 @@ Ordered layouts have the following properties: [[layout.orderedlayout.properties.table]] .Properties and Declarative Attributes +[cols="1,2"] |=============== |Property|Declarative Attribute -|[parameter]#componentAlignment#|In child components:[literal]#++:left++#(default),[literal]#++:center++#,[literal]#++:right++#,[literal]#++:top++#(default),[literal]#++:middle++#,[literal]#++:bottom++# -|[parameter]#spacing#|[parameter]#spacing#[replaceable]#[=<boolean>]# -|[parameter]#margin#|[parameter]#margin#[replaceable]#[=<boolean>]# -|[parameter]#expandRatio#|In child components:[parameter]#:expand#=[replaceable]#<integer>#or[parameter]#:expand#(implies ratio 1) +|[parameter]#componentAlignment#|Alignment of a child component is specified in the child with: [literal]#++:left++# (default), [literal]#++:center++#, [literal]#++:right++#, [literal]#++:top++# (default), [literal]##++:middle++##, [literal]##++:bottom++## +|[parameter]#spacing#|[parameter]##spacing##++[=++[replaceable]##<boolean>##++]++ +|[parameter]#margin#|[parameter]##margin##++[=++[replaceable]##<boolean>##++]++ +|[parameter]#expandRatio#|Expand ratio of a child component is specified in the child with: [parameter]#:expand#++[=++[replaceable]##<integer>##++]++ or [parameter]#:expand# (implies ratio 1) |=============== - - - [[layout.orderedlayout.spacing]] == Spacing in Ordered Layouts @@ -76,9 +73,7 @@ element in a CSS selector, such as [literal]#++v-verticallayout++# for a [literal]#++v-horizontal++# for all vertically or horizontally ordered layouts, such as [classname]#FormLayout#. -For example, the following sets the amount of spacing for all -[classname]#VerticalLayout#s, as well as [classname]#FormLayout#, in the UI: - +For example, the following sets the amount of spacing for all [classname]##VerticalLayout##s (as well as [classname]##FormLayout##s) in the UI: [source, css] ---- @@ -89,7 +84,6 @@ For example, the following sets the amount of spacing for all Or for [classname]#HorizontalLayout#: - [source, css] ---- .v-horizontal > .v-spacing { @@ -97,7 +91,6 @@ Or for [classname]#HorizontalLayout#: } ---- - [[layout.orderedlayout.sizing]] == Sizing Contained Components @@ -106,8 +99,8 @@ different ways depending on how you specify their height or width in the primary direction of the layout component. [[figure.layout.orderedlayout.size.summary]] -.Component Widths in [classname]#HorizontalLayout# -image::img/horizontallayout_sizing.png[] +.Component widths in [classname]#HorizontalLayout# +image::img/horizontallayout_sizing.png[width=75%, scaledwidth=100%] <<figure.layout.orderedlayout.size.summary>> gives a summary of the sizing options for a [classname]#HorizontalLayout#. The figure is broken down in the @@ -154,8 +147,6 @@ Component Hierarchy">>. ==== - - An exception to the above rule is a case where you have a layout with undefined size that contains a component with a fixed or undefined size together with one or more components with relative size. In this case, the contained component @@ -163,6 +154,7 @@ with fixed (or undefined) size in a sense defines the size of the containing layout, removing the paradox. That size is then used for the relatively sized components. +ifdef::web[] The technique can be used to define the width of a [classname]#VerticalLayout# or the height of a [classname]#HorizontalLayout#. @@ -171,10 +163,10 @@ or the height of a [classname]#HorizontalLayout#. ---- // Vertical layout would normally have 100% width VerticalLayout vertical = new VerticalLayout(); - + // Shrink to fit the width of contained components vertical.setWidth(Sizeable.SIZE_UNDEFINED, 0); - + // Label has normally 100% width, but we set it as // undefined so that it will take only the needed space Label label = @@ -182,7 +174,7 @@ Label label = "the width of this Label \u2192"); label.setWidth(Sizeable.SIZE_UNDEFINED, 0); vertical.addComponent(label); - + // Button has undefined width by default Button butt = new Button("\u2190 This Button takes 100% "+ "of the width \u2192"); @@ -193,8 +185,9 @@ See the http://demo.vaadin.com/book-examples-vaadin7/book#layout.orderedlayout.s [[figure.layout.orderedlayout.sizing.undefined.defining]] .Defining the Size with a Component -image::img/orderedlayout-sizing-undefined.png[] +image::img/orderedlayout-sizing-undefined.png[width=50%, scaledwidth=75%] +endif::web[] === Layout with Defined Size @@ -310,7 +303,7 @@ excess space that expands, not the components. for (int i = 1; i <= 3; i++) { // Button with undefined size. Button button = new Button(captions[i - 1]); - + layout4.addComponent(button); // Expand ratios are 1:2:3. @@ -349,8 +342,3 @@ for (int i = 1; i <= 3; i++) { } parentLayout.addComponent(layout50); ---- - - - - - diff --git a/documentation/layout/layout-overview.asciidoc b/documentation/layout/layout-overview.asciidoc index 6481db6229..7a57e2a518 100644 --- a/documentation/layout/layout-overview.asciidoc +++ b/documentation/layout/layout-overview.asciidoc @@ -9,15 +9,23 @@ layout: page The user interface components in Vaadin can roughly be divided in two groups: components that the user can interact with and layout components for placing the -other components to specific places in the user interface. The layout components -are identical in their purpose to layout managers in regular desktop frameworks -for Java and you can use plain Java to accomplish sophisticated component -layouting. +other components to specific places in the user interface. +The layout components are identical in their purpose to layout managers in regular desktop frameworks for Java. +You can use plain Java to accomplish sophisticated component layouts. + +[[figure.layout.intro.simple]] +.Layout example +image::img/layout-intro-example-1.png[width=75%, scaledwidth=100%] You start by creating a content layout for the UI and then add other layout components hierarchically, and finally the interaction components as the leaves of the component tree. +[[figure.layout.intro.schematic]] +.Layout schematic +image::img/layout-schematic-hi.png[width=100%, scaledwidth=100%] + +Let us look at building a bit simplified version of the layout in <<figure.layout.intro.simple>>: [source, java] ---- @@ -25,20 +33,22 @@ of the component tree. VerticalLayout content = new VerticalLayout(); setContent(content); -// Add the topmost component. -content.addComponent(new Label("The Ultimate Cat Finder")); +HorizontalLayout titleBar = new HorizontalLayout(); +titleBar.setWidth("100%"); +root.addComponent(titleBar); -// Add a horizontal layout for the bottom part. -HorizontalLayout bottom = new HorizontalLayout(); -content.addComponent(bottom); +Label title = new Label("The Ultimate Cat Finder"); +titleBar.addComponent(title); +titleBar.setExpandRatio(title, 1.0f); // Expand -bottom.addComponent(new Tree("Major Planets and Their Moons")); -bottom.addComponent(new Panel()); -... ----- +Label titleComment = new Label("for Vaadin"); +titleComment.setSizeUndefined(); // Take minimum space +titleBar.addComponent(titleComment); -Or in the declarative format: +... build rest of the layout ... +---- +Or in the declarative format (roughly): [source, html] ---- @@ -46,8 +56,9 @@ Or in the declarative format: <vaadin-label>The Ultimate Cat Finder</vaadin-label> <vaadin-horizontal-layout> - <vaadin-tree caption="Major Planets and Their Moons"/> + <vaadin-tree caption="Possible Places"/> <vaadin-panel/> + ... </vaadin-horizontal-layout> </vaadin-vertical-layout> ---- @@ -65,10 +76,3 @@ described in You can see a finished version of the above example in <<figure.layout.intro.simple>>. - -[[figure.layout.intro.simple]] -.Layout Example -image::img/layout-intro-example-1.png[] - - - diff --git a/documentation/layout/original-drawings/Makefile b/documentation/layout/original-drawings/Makefile new file mode 100644 index 0000000000..7e9434de9c --- /dev/null +++ b/documentation/layout/original-drawings/Makefile @@ -0,0 +1,17 @@ +SVG = +RASTERIMAGES = layout-schematic + +RASTERSRCIMAGES := $(foreach file, $(RASTERIMAGES), $(file).svg) +RASTERIMAGES_HI := $(foreach file, $(RASTERIMAGES), ../img/$(file)-hi.png) +SVGTRGIMAGES := $(foreach file, $(SVG), ../img/$(file).svg) + +images: $(RASTERIMAGES_HI) $(SVGTRGIMAGES) FORCE +# Just do low now $(TRGIMAGES_LO) + +$(RASTERIMAGES_HI): ../img/%-hi.png: %.svg + inkscape --export-png $@ --export-dpi=300 --export-area-drawing $< + +$(SVGTRGIMAGES): ../img/%.svg: %.svg FORCE + inkscape $< --export-text-to-path -l $@ + +FORCE: diff --git a/documentation/layout/original-drawings/layout-schematic.svg b/documentation/layout/original-drawings/layout-schematic.svg new file mode 100644 index 0000000000..ec1b9240a5 --- /dev/null +++ b/documentation/layout/original-drawings/layout-schematic.svg @@ -0,0 +1,546 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- Created with Inkscape (http://www.inkscape.org/) --> + +<svg + xmlns:dc="http://purl.org/dc/elements/1.1/" + xmlns:cc="http://creativecommons.org/ns#" + xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" + xmlns:svg="http://www.w3.org/2000/svg" + xmlns="http://www.w3.org/2000/svg" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + width="82mm" + height="41mm" + id="svg1901" + sodipodi:version="0.32" + inkscape:version="0.91 r" + sodipodi:docname="layout-schematic.svg" + version="1.1"> + <defs + id="defs1903" /> + <sodipodi:namedview + id="base" + pagecolor="#ffffff" + bordercolor="#666666" + borderopacity="1.0" + inkscape:pageopacity="1" + inkscape:pageshadow="2" + inkscape:zoom="3.959798" + inkscape:cx="148.02363" + inkscape:cy="70.790343" + inkscape:document-units="mm" + inkscape:current-layer="layer1" + inkscape:window-width="1920" + inkscape:window-height="1060" + inkscape:window-x="-2" + inkscape:window-y="-3" + showgrid="true" + inkscape:window-maximized="1" + inkscape:snap-center="true" + inkscape:snap-grids="true" + inkscape:snap-bbox="true" + inkscape:object-paths="true" + inkscape:object-nodes="true" + inkscape:snap-object-midpoints="true" + showguides="true" + inkscape:guide-bbox="true" + units="mm" + fit-margin-top="2" + fit-margin-left="2" + fit-margin-right="2" + fit-margin-bottom="2"> + <inkscape:grid + type="xygrid" + id="grid2982" + empspacing="10" + visible="true" + enabled="true" + snapvisiblegridlinesonly="true" + spacingx="3.5433071" + spacingy="3.5433071" + units="mm" + originx="18.581643" + originy="0.35428181" /> + </sodipodi:namedview> + <metadata + id="metadata1906"> + <rdf:RDF> + <cc:Work + rdf:about=""> + <dc:format>image/svg+xml</dc:format> + <dc:type + rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> + <dc:title /> + </cc:Work> + </rdf:RDF> + </metadata> + <g + inkscape:label="Taso 1" + inkscape:groupmode="layer" + id="layer1" + transform="translate(18.581643,-907.44094)"> + <rect + y="910.62994" + x="46.062992" + height="138.189" + width="162.99213" + id="rect4347-0-2-5-5-9-59" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <flowRoot + xml:space="preserve" + id="flowRoot4349" + style="font-style:normal;font-weight:normal;font-size:10px;line-height:125%;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" + transform="translate(7.0866142,882.28351)"><flowRegion + id="flowRegion4351"><rect + id="rect4353" + width="67.322838" + height="42.519684" + x="49.6063" + y="56.692909" + style="font-size:10px" /></flowRegion><flowPara + id="flowPara4355" /></flowRoot> <g + id="g4392-0-4-6-8" + transform="translate(216.14174,42.519773)" /> + <rect + y="914.17328" + x="49.6063" + height="131.10236" + width="155.90552" + id="rect4347-0-2-5-5-9" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="917.71655" + x="53.149605" + height="21.259869" + width="148.81889" + id="rect4347-0-2-5-5-9-5" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="921.25989" + x="56.692913" + height="14.17316" + width="102.7559" + id="rect4347-0-2-5-5-9-5-8" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="921.25983" + x="162.99213" + height="14.173287" + width="35.433075" + id="rect4347-0-2-5-5-9-5-8-5" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="942.51971" + x="53.149605" + height="88.582695" + width="148.81889" + id="rect4347-0-2-5-5-9-5-84" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="1034.6458" + x="53.149605" + height="7.0865755" + width="148.81889" + id="rect4347-0-2-5-5-9-5-9" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="946.06305" + x="56.692913" + height="81.496048" + width="46.062984" + id="rect4347-0-2-5-5-9-5-8-0" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="956.69293" + x="60.236221" + height="67.322792" + width="38.976372" + id="rect4347-0-2-5-5-9-5-8-0-5" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="946.06293" + x="106.29922" + height="81.49617" + width="92.125977" + id="rect4347-0-2-5-5-9-5-8-0-8" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="956.69287" + x="109.84253" + height="67.322922" + width="85.03936" + id="rect4347-0-2-5-5-9-5-8-0-5-4" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 49.606297,921.25994 -10.629919,-5e-5" + id="path3003-6-5-1" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="921.25989" + cx="49.606293" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6" + r="2.1259842" /> + <circle + cy="921.25989" + cx="38.976379" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 53.149601,1038.1893 -14.17322,0" + id="path3003-6-5-1-8" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="1038.1891" + cx="53.149601" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-7" + r="2.1259842" /> + <circle + cy="1038.189" + cx="38.976379" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-4" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 56.69291,953.14967 -17.716532,-2e-5" + id="path3003-6-5-1-5" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="953.14966" + cx="56.692902" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13" + r="2.1259842" /> + <circle + cy="953.14966" + cx="38.976376" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 53.1496,946.06308 -14.173222,-4e-5" + id="path3003-6-5-1-5-1" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="946.06299" + cx="53.149601" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-9" + r="2.1259842" /> + <circle + cy="946.06305" + cx="38.976379" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-8" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14174,931.8898 -17.71654,0" + id="path3003-6-5-1-5-7" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="931.88983" + cx="198.42522" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3" + r="2.1259842" /> + <circle + cy="931.88983" + cx="216.14174" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 56.692911,928.34655 -17.716533,-5e-5" + id="path3003-6-5-1-5-78" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="928.3465" + cx="56.692902" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-7" + r="2.1259842" /> + <circle + cy="928.3465" + cx="38.976379" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-0" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 60.236217,960.23629 -21.259839,-3e-5" + id="path3003-6-5-1-5-13" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="960.23627" + cx="60.236206" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-39" + r="2.1259842" /> + <circle + cy="960.23627" + cx="38.976376" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-9" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14174,949.60637 -17.71653,0" + id="path3003-6-5-1-5-7-1" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="949.60632" + cx="198.42522" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-2" + r="2.1259842" /> + <circle + cy="949.60638" + cx="216.14175" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-4" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14174,921.25991 -14.17323,0" + id="path3003-6-5-1-5-7-1-1" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="921.25989" + cx="201.96854" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-2-6" + r="2.1259842" /> + <circle + cy="921.26001" + cx="216.14175" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-4-2" + r="2.1259842" /> + <rect + y="970.86621" + x="120.47243" + height="38.976353" + width="63.77953" + id="rect4347-0-2-5-5-9-5-8-0-5-4-1" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#e61e6d;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="974.40948" + x="124.01573" + height="14.173236" + width="56.692928" + id="rect4347-0-2-5-5-9-5-8-0-5-4-1-7" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <rect + y="992.12604" + x="124.01573" + height="14.173219" + width="56.692928" + id="rect4347-0-2-5-5-9-5-8-0-5-4-1-7-8" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:none;fill-opacity:1;fill-rule:nonzero;stroke:#ffc13f;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14173,985.03941 -35.43307,2e-5" + id="path3003-6-5-1-5-7-7" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="985.03943" + cx="180.70866" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-5" + r="2.1259842" /> + <circle + cy="985.03943" + cx="216.14174" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-0" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14173,1002.7559 -35.43307,0" + id="path3003-6-5-1-5-7-7-7" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="1002.7559" + cx="180.70866" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-5-3" + r="2.1259842" /> + <circle + cy="1002.7559" + cx="216.14174" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-0-3" + r="2.1259842" /> + <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.14173,974.40949 -31.88976,2e-5" + id="path3003-6-5-1-5-7-1-1-7" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="974.40948" + cx="184.25197" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-2-6-9" + r="2.1259842" /> + <circle + cy="974.40955" + cx="216.14177" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-4-2-4" + r="2.1259842" /> + <flowRoot + transform="translate(34.181781,923.10248)" + id="flowRoot4367-0-7-2-4-4-43-5-2" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6-6-7" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-1-0-0">VerticalLayout</flowPara></flowRoot> <flowRoot + transform="translate(34.055515,1040.0315)" + id="flowRoot4367-0-7-2-4-4-4" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-8" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-5">Label</flowPara></flowRoot> <flowRoot + transform="translate(34.055511,955.26005)" + id="flowRoot4367-0-7-2-4-4-43" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-1">Panel</flowPara></flowRoot> <flowRoot + transform="translate(34.176406,947.90968)" + id="flowRoot4367-0-7-2-4-4-43-3" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6-1" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;writing-mode:lr;text-anchor:end;" + id="flowPara4684">HorizontalLayout</flowPara></flowRoot> <flowRoot + transform="translate(220.06236,933.6273)" + id="flowRoot4367-0-7-2-4-4-8" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill-rule:nonzero;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;filter-blend-mode:normal;filter-gaussianBlur-deviation:0;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7" /><flowPara + style="font-size:6.25px;text-align:start;text-anchor:start;color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;filter-blend-mode:normal;filter-gaussianBlur-deviation:0;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;-inkscape-font-specification:'Montserrat, Normal';font-family:Montserrat;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;writing-mode:lr;line-height:58%;" + id="flowPara4783-7-2-8-7">Label</flowPara></flowRoot> <flowRoot + transform="translate(34.055512,930.18906)" + id="flowRoot4367-0-7-2-4-4-43-5" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6-6" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-1-0">Label</flowPara></flowRoot> <flowRoot + transform="translate(33.772237,962.0788)" + id="flowRoot4367-0-7-2-4-4-43-8" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6-7" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-1-1">Tree</flowPara></flowRoot> <flowRoot + transform="translate(220.06237,951.34394)" + id="flowRoot4367-0-7-2-4-4-8-4" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-7" /><flowPara + style="font-size:6.25px;text-align:start;text-anchor:start;-inkscape-font-specification:'Montserrat, Normal';font-family:Montserrat;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;writing-mode:lr;line-height:58%;" + id="flowPara4783-7-2-8-7-1">Panel</flowPara></flowRoot> <flowRoot + transform="translate(219.88965,923.13155)" + id="flowRoot4367-0-7-2-4-4-8-4-8" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-7-1" /><flowPara + style="font-size:6.25px;line-height:58%;text-align:start;text-anchor:start;-inkscape-font-specification:'Montserrat, Normal';font-family:Montserrat;font-weight:normal;font-style:normal;font-stretch:normal;font-variant:normal;writing-mode:lr;" + id="flowPara4865">HorizontalLayout</flowPara></flowRoot> <flowRoot + transform="translate(220.25102,986.77706)" + id="flowRoot4367-0-7-2-4-4-8-9" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-6" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;writing-mode:lr;text-anchor:start;" + id="flowPara4783-7-2-8-7-4">Label</flowPara></flowRoot> <flowRoot + transform="translate(220.25102,1004.4936)" + id="flowRoot4367-0-7-2-4-4-8-9-7" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-6-6" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;writing-mode:lr;text-anchor:start;" + id="flowPara4783-7-2-8-7-4-8">Label</flowPara></flowRoot> <flowRoot + transform="translate(219.88712,976.25205)" + id="flowRoot4367-0-7-2-4-4-8-4-8-2" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-7-1-6" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:58%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;writing-mode:lr;text-anchor:start;" + id="flowPara4865-9">VerticalLayout</flowPara></flowRoot> <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 46.06299,914.17332 -7.086612,-5e-5" + id="path3003-6-5-1-86" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="914.17328" + cx="46.062992" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-8" + r="2.1259842" /> + <circle + cy="914.17328" + cx="38.976379" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-6" + r="2.1259842" /> + <flowRoot + transform="translate(34.181782,916.01583)" + id="flowRoot4367-0-7-2-4-4-43-5-2-5" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;letter-spacing:0px;word-spacing:0px;writing-mode:lr;text-anchor:end;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-6-6-7-3" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:121%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:end;writing-mode:lr;text-anchor:end;" + id="flowPara4783-7-2-8-1-0-0-9">UI</flowPara></flowRoot> <path + style="fill:none;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" + d="m 216.1417,960.23626 -21.25981,0" + id="path3003-6-5-1-5-7-1-1-7-5" + inkscape:connector-curvature="0" + sodipodi:nodetypes="cc" /> + <circle + cy="960.23627" + cx="194.8819" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-13-3-2-6-9-1" + r="2.1259842" /> + <circle + cy="960.23627" + cx="216.14174" + style="color:#000000;display:inline;overflow:visible;visibility:visible;fill:#ffffff;fill-opacity:1;stroke:#33383a;stroke-width:0.70866144;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;marker:none;enable-background:accumulate" + id="path2997-7-6-1-7-7-4-2-4-9" + r="2.1259842" /> + <flowRoot + transform="translate(219.88709,962.07882)" + id="flowRoot4367-0-7-2-4-4-8-4-8-2-0" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:57.99999833%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" + xml:space="preserve"><flowRegion + id="flowRegion4369-0-6-7-7-5-7-7-1-6-7" /><flowPara + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:6.25px;line-height:57.99999833%;font-family:Montserrat;-inkscape-font-specification:'Montserrat, Normal';text-align:start;writing-mode:lr-tb;text-anchor:start" + id="flowPara4865-9-0">VerticalLayout</flowPara></flowRoot> </g> +</svg> |
