Picture
{
    margins: 0;
    image: resource("wallpaper");
    image-scaling: cover;
    hit-test-visible: true;
    DockLayout
    {
        GridLayout
        {
            dock-site: bottom;
            columns: auto, expand, auto, auto, auto, expand, auto;

            Button
            {
                on-click: callback("open-volume-control");
                horizontal-alignment: center;
                Picture { image: resource("icon-volume-medium"); }
            }
            Spacer { }
            Button
            {
                on-click: callback("previous-song");
                horizontal-alignment: center;
                Picture { image: resource("icon-skip-previous"); }
            }
            Button
            {
                on-click: callback("play-pause");
                horizontal-alignment: center;
                Picture { image: resource("icon-play"); }
            }
            Button
            {
                on-click: callback("next-song");
                horizontal-alignment: center;
                Picture { image: resource("icon-skip-next"); }
            }
            Spacer { }
            Button
            {
                on-click: callback("open-main-menu");
                horizontal-alignment: center;
                Picture { image: resource("icon-menu"); }
            }
        }
        Label
        {
            dock-site: bottom;
            text: bind("current-artist");
        }
        Label
        {
            dock-site: bottom;
            text: bind("current-song");
        }
        Picture
        {
            image: bind("current-albumart");
            image-scaling: zoom;
            vertical-alignment: middle;
            horizontal-alignment: center;
        }
    }
}