<?xml version="1.0"?>
<root
  xmlns="http://panopainter.com/layout.xsd"
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
>

  <layout id="usermanual">
    <border positioning="absolute" position="0 0" color=".4 .4 .4 .8" width="100%" height="100%" align="center" justify="center" mouse-capture="true">
      <border thickness="1" border-color=".2" pad="3" max-width="650" dir="col" width="80%" height="80%">
        <border width="100%" height="30" color=".2 .2 .2 .9" dir="row" align="center" justify="center">
          <text text="PanoPainter User Manual"></text>
        </border>
        <border width="100%" height="100%" color="0 0 0 .9" pad="10" dir="col">
          <!--window content-->
          <border color=".2" width="100%" height="1" grow="1">
            <scroll pad="10" margin="5" color="1" dir="col" shrink="1">
              <node align="center" margin="10 0 10 0">
                <text color="0" font-size="30" text="Getting started with PanoPainter"/>
              </node>
              <image path="data/doc/images/panopainter-doc-overview.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node align="center" margin="40 0 20 0">
                <text color="0" font-size="30" text="Brush Settings"/>
              </node>
              <image path="data/doc/images/panopainter-doc-brush-settings.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node align="center" margin="40 0 20 0">
                <text color="0" font-size="30" text="Layers Settings"/>
              </node>
              <image path="data/doc/images/panopainter-doc-layers.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node align="center" margin="40 0 20 0">
                <text color="0" font-size="30" text="File Menu"/>
              </node>
              <image path="data/doc/images/panopainter-doc-menu-file.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node align="center" margin="40 0 20 0">
                <text color="0" font-size="30" text="Layers Menu"/>
              </node>
              <image path="data/doc/images/panopainter-doc-menu-layers.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node align="center" margin="40 0 20 0">
                <text color="0" font-size="30" text="Timelapse Menu"/>
              </node>
              <image path="data/doc/images/panopainter-doc-menu-timelapse.jpg" width="100%" align="center" justify="flex-end" autosize="1"/>
              <node height="40" margin="0 0 40 0"></node>
            </scroll>
          </border>
          <!--footer buttons-->
          <node height="60" dir="row" justify="flex-end">
            <button id="btn-ok" text="Ok" width="100" height="30" margin="5 0 0 0"/>
          </node>
        </border>
      </border>
    </border>
  </layout>

</root>
