<brls:TabFrame
    title="@i18n/demo/title"
    iconInterpolation="linear"
    icon="@res/img/borealis_96.png">

    <!-- Dynamic tab - required to get references to the views in the code -->
    <brls:Tab label="@i18n/demo/tabs/components" >
        <ComponentsTab />
    </brls:Tab>

    <!-- Static tab linking to another XML -->
    <brls:Tab label="@i18n/demo/tabs/layout" >
        <brls:View xml="@res/xml/tabs/layout.xml" />
    </brls:Tab>

    <brls:Tab label="@i18n/demo/tabs/recycling">
        <RecyclingListTab />
    </brls:Tab>

    <brls:Separator />

    <brls:Tab label="@i18n/demo/tabs/popups" />
    <brls:Tab label="@i18n/demo/tabs/hos_layout" />

    <brls:Separator />

    <brls:Tab label="@i18n/demo/tabs/misc_layouts" />
    <brls:Tab label="@i18n/demo/tabs/misc_components" />
    <brls:Tab label="@i18n/demo/tabs/misc_tools" />

    <brls:Separator />

    <!-- Static tab with inline XML -->
    <brls:Tab label="@i18n/demo/tabs/about" >

        <brls:Box
            width="auto"
            height="auto"
            axis="column"
            paddingTop="@style/about/padding_top_bottom"
            paddingBottom="@style/about/padding_top_bottom"
            paddingLeft="@style/about/padding_sides"
            paddingRight="@style/about/padding_sides" >

            <brls:Image
                width="auto"
                height="33%"
                image="@res/img/borealis_256.png"
                marginBottom="@style/about/description_margin"/>

            <brls:Box
                width="auto"
                height="auto"
                axis="row"
                marginBottom="@style/about/description_margin">

                <brls:Label
                    width="40%"
                    height="auto"
                    text="@i18n/demo/about/title"
                    fontSize="36"
                    horizontalAlign="right"
                    verticalAlign="top" />

                <brls:Label
                    width="auto"
                    height="auto"
                    text="@i18n/demo/about/description"
                    marginLeft="@style/about/description_margin" />

            </brls:Box>

            <brls:Box
                width="auto"
                height="auto"
                axis="column"
                alignItems="center"
                justifyContent="spaceEvenly"
                grow="1.0" >

                <brls:Label
                    width="auto"
                    height="auto"
                    text="@i18n/demo/about/github" />

                <brls:Label
                    width="auto"
                    height="auto"
                    text="@i18n/demo/about/licence" />

                <brls:Label
                    width="auto"
                    height="auto"
                    text="@i18n/demo/about/logo_credit" />

            </brls:Box>

        </brls:Box>

    </brls:Tab>

</brls:TabFrame>
