Color < ColorBox
  anchors.top: head.top
  anchors.left: head.right

Window
  title: Select Outfit
  size: 550 280

  anchors.horizontalCenter: parent.horizontalCenter
  anchors.verticalCenter: parent.verticalCenter

  @onEnter: Outfit.accept()
  @onEscape: Outfit.destroy()

  Label
    id: name
    text: Outfit Name
    width: 100
    anchors.top: parent.top
    anchors.left: parent.left
    margin-top: 34
    margin-left: 20

  Creature
    id: creature
    anchors.top: name.bottom
    anchors.left: name.left
    margin-top: 5

  ButtonBox
    id: head
    text: Head
    anchors.top: creature.top
    anchors.left: creature.right
    margin-left: 10
    checked: true

  ButtonBox
    id: primary
    text: Primary
    anchors.top: prev.bottom
    anchors.left: prev.left

  ButtonBox
    id: secondary
    text: Secondary
    anchors.top: prev.bottom
    anchors.left: prev.left

  ButtonBox
    id: detail
    text: Detail
    anchors.top: prev.bottom
    anchors.left: prev.left

  Button
    @onClick: Outfit.nextType()
    text: >>
    width: 32
    margin-top: 4
    anchors.top: creature.bottom
    anchors.right: creature.right

  Button
    @onClick: Outfit.previousType()
    text: <<
    width: 32
    margin-top: 4
    anchors.top: creature.bottom
    anchors.left: creature.left

  CheckBox
    id: addon1
    text: Addon 1
    enabled: false
    margin-top: 10
    width: 100
    anchors.top: prev.bottom
    anchors.left: prev.left

  CheckBox
    id: addon2
    text: Addon 2
    enabled: false
    margin-top: 10
    width: 100
    anchors.top: prev.bottom
    anchors.left: prev.left

  CheckBox
    id: addon3
    text: Addon 3
    enabled: false
    margin-top: 10
    width: 100
    anchors.top: prev.bottom
    anchors.left: prev.left

  HorizontalSeparator
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: next.top
    margin-left: 16
    margin-right: 16
    margin-bottom: 10

  Button
    id: buttonOk
    text: Ok
    width: 64
    anchors.right: next.left
    anchors.bottom: parent.bottom
    margin-bottom: 16
    margin-right: 16
    @onClick: Outfit.accept()

  Button
    id: buttonCancel
    text: Cancel
    width: 64
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    margin-bottom: 16
    margin-right: 16
    @onClick: Outfit.destroy()