{
    "views - icon": SimpleButton (
        within: "views - back",
        default: (
            area: (
                x_axis: (
                    from: (frac: 1, px: -60),
                    dist: (frac: 0, px: 60),
                ),
                y_axis: (
                    from: (frac: 1, px: 0),
                    dist: (frac: 0, px: 60),
                )
            ),
            fill_color: (191,159,23,191),
            image_path: "ui/icons/projector_screen.png",
        ),
    ),
    "views - arrow expand": SimpleButton (
        within: "views - back stub",
        start_enabled: false,
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 1, px: 0),
                ),
                y_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 0, px: 20),
                )
            ),
            image_path: "ui/icons/tick-down.png",
        ),
    ),
    "views - arrow minimize": SimpleButton (
        within: "views - back stub",
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 1, px: 0),
                ),
                y_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 0, px: 20),
                )
            ),
            image_path: "ui/icons/tick-up.png",
        ),
    ),
    "views - back stub": SimpleButton (
        default: (
            area: (
                x_axis: (
                    from: (frac: 1, px: -40),
                    dist: (frac: 0, px: 40),
                ),
                y_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 0, px: 20),
                )
            ),
            fill_color: (191,159,23,191),
        ),
    ),
    "views - back": SimpleButton (
        default: (
            area: (
                x_axis: (
                    from: (frac: 1, px: -40),
                    dist: (frac: 0, px: 40),
                ),
                y_axis: (
                    from: (frac: 0, px: 20),
                    dist: (frac: 0, px: 230),
                )
            ),
            fill_color: (191,159,23,191),
        ),
    ),
    "views - transit": SimpleButton (
        within: "views - back",
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -70),
                    dist: (frac: 0, px: 100),
                ),
                y_axis: (
                    from: (frac: 0, px: 0),
                    dist: (frac: 0, px: 100),
                )
            ),
            image_path: "buildings/roads/road.straight.bldg.1.above.png$white_outline",
            fill_color: (0x3F,0x3F,0x3F,0xFF),
        ),
        while_active: (
            border_color: (0xFF,0xFF,0xFF,0xFF),
        ),
        while_hovered: (
            fill_color: (0x7F,0x7F,0x7F,0xFF),
        ),
    ),
    /*"views - zones": SimpleButton (
        within: "views - back",
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -70),
                    dist: (frac: 0, px: 100),
                ),
                y_axis: (
                    from: (frac: 0, px: 240),
                    dist: (frac: 0, px: 100),
                )
            ),
            image_path: "buildings/heavyzone.bldg.0.above.png",
            fill_color: (0x3F,0x3F,0x3F,0xFF),
        ),
        while_active: (
            border_color: (0xFF,0xFF,0xFF,0xFF),
        ),
        while_hovered: (
            fill_color: (0x7F,0x7F,0x7F,0xFF),
        ),
    ),*/
    /*"views - utils": SimpleButton (
        within: "views - back",
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -70),
                    dist: (frac: 0, px: 100),
                ),
                y_axis: (
                    from: (frac: 0, px: 240),
                    dist: (frac: 0, px: 100),
                )
            ),
            image_path: "buildings/utility/pipes-icon.bldg.0.under.png$white_outline",
            fill_color: (0x3F,0x3F,0x3F,0xFF),
        ),
        while_active: (
            border_color: (0xFF,0xFF,0xFF,0xFF),
        ),
        while_hovered: (
            fill_color: (0x7F,0x7F,0x7F,0xFF),
        ),
    ),*/
    "views - aoe": SimpleButton (
        within: "views - back",
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -70),
                    dist: (frac: 0, px: 100),
                ),
                y_axis: (
                    from: (frac: 0, px: 120),
                    dist: (frac: 0, px: 100),
                )
            ),
            image_path: "buildings/aoe-icon.bldg.0.above.png$white_outline",
            fill_color: (0x3F,0x3F,0x3F,0xFF),
        ),
        while_active: (
            border_color: (0xFF,0xFF,0xFF,0xFF),
        ),
        while_hovered: (
            fill_color: (0x7F,0x7F,0x7F,0xFF),
        ),
    ),



    // TOOLTIPS

    "views - aoe - tooltip": SimpleButton (
        within: "views - aoe",
        tooltip_of: "views - aoe",
        text: "Environment Quality",
        text_color: (0,0,0,0xFF),
        text_align: left,
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -420),
                    dist: (frac: 0, px: 400),
                ),
                y_axis: (
                    from: (frac: 0, px: 20),
                    dist: (frac: 1, px: -40),
                )
            ),
            fill_color: (0xBF,0xBF,0xBF,0xBF),
        ),
    ),
    "views - transit - tooltip": SimpleButton (
        within: "views - transit",
        tooltip_of: "views - transit",
        text: "Transportation",
        text_color: (0,0,0,0xFF),
        text_align: left,
        default: (
            area: (
                x_axis: (
                    from: (frac: 0, px: -420),
                    dist: (frac: 0, px: 400),
                ),
                y_axis: (
                    from: (frac: 0, px: 20),
                    dist: (frac: 1, px: -40),
                )
            ),
            fill_color: (0xBF,0xBF,0xBF,0xBF),
        ),
    ),
}
