<ButtonModel>:
    color: app.get_color(self.color_name, control_alpha=self.alpha)
    disabled_color: app.get_color(self.disabled_color_name, control_alpha=self.disabled_alpha)
    canvas:
        Color:
            rgba: self.color if not self.disabled else self.disabled_color
        BorderImage:
            border: self.border
            size: self.size
            pos: self.pos
            source: self.atlas_url + self.down_image if self.state == 'down' else self.atlas_url + self.normal_image
            auto_scale: 'y_full_x_lower'
    RampLabel:
        id: label
        height: root.height * 0.9
        width: root.width * 0.9
        x: root.x + 0.05 * root.width
        y: root.y + 0.05 * root.height
        color_name: root.font_color_name
        text: root.text
        style: root.style
        text_size: root.size
        ramp_group_name: root.ramp_group_name
        ramp_name: root.ramp_name
        valign: 'middle'
        halign: 'center'

<OutlineButton>:
    outline_color: app.get_color(self.outline_color_name, control_alpha=self.outline_alpha)
    disabled_outline_color: app.get_color(self.disabled_outline_color_name, control_alpha=self.disabled_outline_alpha)
    canvas:
        Color:
            rgba: self.outline_color if not self.disabled else self.disabled_outline_color
        BorderImage:
            border: [self.border[0] + self.size_diff[1]/2., self.border[1] + self.size_diff[0]/2., self.border[2] + self.size_diff[1]/2., self.border[3] + self.size_diff[0]/2.]
            size: self.width * 1.004 + self.size_diff[0], self.height * 1.004 + self.size_diff[1]
            pos: self.x - self.size_diff[0]/2., self.y - self.size_diff[1]/2.
            source: self.atlas_url + self.outline_image
            auto_scale: 'y_full_x_lower'