<?xml version="1.0" encoding="UTF-8"?>
<stkgui>
    <icon-button id="back" x="0" y="0" height="8%" icon="gui/back.png"/>
    <div x="1%" y="1%" width="98%" height="98%" layout="vertical-row" >
        <header width="80%" height="7%" align="center" text="SuperTuxKart Options" text_align="center"/>
        <spacer width="100%" height="1%"/>

        <div width="100%" height="92%" layout="horizontal-row" >

            <vertical-tabs id="options_choice" height="100%" width="18%">
                <icon-button id="tab_video" width="128" height="128" icon="gui/options_video.png"
                        I18N="Section in the settings menu" text="Graphics"/>
                <icon-button id="tab_audio" width="128" height="128" icon="gui/options_audio.png"
                        I18N="Section in the settings menu" text="Audio"/>
                <icon-button id="tab_ui" width="128" height="128" icon="gui/options_ui.png"
                        I18N="Section in the settings menu" text="User Interface"/>
                <icon-button id="tab_players" width="128" height="128" icon="gui/options_players.png"
                        I18N="Section in the settings menu" text="Players"/>
                <icon-button id="tab_controls" width="128" height="128" icon="gui/options_input.png"
                        I18N="Section in the settings menu" text="Controls"/>
                <icon-button id="tab_language" width="128" height="128" icon="gui/options_language.png"
                        I18N="Section in the settings menu" text="Language"/>
            </vertical-tabs>

            <spacer width="2%" height="100%"/>

            <box width="80%" height="100%" layout="vertical-row">

                <spacer width="5" height="1%"/>

                <!-- ******** Music ******** -->
                <label width="100%" I18N="In the audio options screen" text="Music"/>

                <div width="75%" height="fit" layout="horizontal-row" >
                    <label proportion="1" height="100%" text_align="right" I18N="In the audio options screen" text="Enabled"/>

                    <div proportion="1" height="fit" layout="horizontal-row" >
                        <spacer width="40" height="100%" />
                        <!-- FIXME: don't hardcode height -->
                        <checkbox id="music_enabled"/>
                    </div>
                </div>
                <div width="75%" height="fit" layout="horizontal-row" >
                    <label proportion="1" height="100%" text_align="right" I18N="In the audio options screen" text="Volume"/>
                    <div proportion="1" height="fit" layout="horizontal-row" >
                        <spacer width="40" height="100%" />
                        <gauge id="music_volume" proportion="1" min_value="1" max_value="10"/>
                    </div>
                </div>

                <spacer width="5" height="1%"/>

                <!-- ******** SFX ******** -->
                <label width="100%" I18N="In the audio options screen" text="Sound Effects"/>

                <div width="75%" height="fit" layout="horizontal-row" >
                    <label proportion="1" height="100%" text_align="right" I18N="In the audio options screen" text="Enabled"/>
                    <div proportion="1" height="fit" layout="horizontal-row" >
                        <spacer width="40" height="100%" />
                        <!-- FIXME: don't hardcode height -->
                        <checkbox id="sfx_enabled"/>
                    </div>
                </div>
                <div width="75%" height="fit" layout="horizontal-row" >
                    <label proportion="1" height="100%" text_align="right" I18N="In the audio options screen" text="Volume"/>
                    <div proportion="1" height="fit" layout="horizontal-row" >
                        <spacer width="40" height="100%" />
                        <gauge id="sfx_volume" proportion="1" min_value="1" max_value="10"/>
                    </div>
                </div>

                <spacer width="5" height="2%"/>

            </box>
        </div>
    </div>
</stkgui>
