TopButton < UIButton
  size: 26 26
  image-source: /images/ui/button_top
  image-clip: 0 0 26 26
  image-border: 3
  image-color: #ffffffff
  icon-color: #ffffffff

  $on:
    image-source: /images/ui/button_top_blink

  $hover !disabled:
    image-color: #ffffff99
    image-clip: 26 0 26 26

  $pressed:
    image-clip: 52 0 26 26

  $disabled:
    image-color: #ffffff44
    icon-color: #ffffff44

TopToggleButton < UIButton
  size: 26 26
  image-source: /images/ui/button_topgame
  image-clip: 26 0 26 26
  image-border: 3
  icon-offset: 0 0

  $pressed:
    image-clip: 52 0 26 26
    icon-offset: 1 1

  $disabled:
    image-clip: 0 0 26 26
    icon-offset: 1 1

largeToggleButton < UIButton
  size: 108 20
  image-source: /images/options/store_large
  image-clip: 0 0 108 20
  image-border: 3

  $pressed:
    image-clip: 0 20 108 20

  $on:
    image-clip: 0 20 108 20
	
MainToggleButton < UIButton
  size: 20 20
  image-source: /images/options/button_empty
  image-clip: 0 0 20 20
  image-border: 3

  $pressed:
    image-clip: 20 0 20 20

  $on:
    image-clip: 20 0 20 20

  UIWidget
    id: brightButton
    size: 20 20
    anchors.top: prev.top
    anchors.left: prev.left
    phantom: true
    visible: false
    image-source: /images/ui/bright-x20

  UIWidget
    id: highlight
    size: 22 22
    visible: false
    margin-top: -1
    phantom: true
    image-source: /images/ui/highlight
    anchors.horizontalCenter: parent.horizontalCenter
    anchors.verticalCenter: parent.verticalCenter

TopMenuButtonsPanel < Panel
  layout:
    type: horizontalBox
    spacing: 4
    fit-children: true
  padding: 6 4

TopMenuPanel < Panel
  height: 36
  image-source: /images/ui/panel_top
  image-repeated: true
  focusable: false

TopMenuFrameCounterLabel < Label
  font: verdana-11px-rounded
  color: white
  margin-top: 4
  margin-left: 5

TopMenuPingLabel < Label
  font: verdana-11px-rounded