Resolve "Merge the best from 7.40 branch"

SabrehavenOTClient/layouts/README.md

@@ -0,0 +1,4 @@
+## Layouts overwrite files from `/data`
+Foe example, if you have file `/data/images/background.png` and `/layouts/dragonball/images/background.png`, and dragonball layout is selected, then `/layouts/dragonball/images/background.png` will be loaded instead of `/data/images/background.png`.
+
+## Dont make layout named `default`, this name is reserved

SabrehavenOTClient/layouts/mobile/README.md

@@ -0,0 +1 @@
+Min. height for mobile is 360, don't make windows bigger than that

SabrehavenOTClient/layouts/mobile/styles/10-scrollbars.otui

@@ -0,0 +1,108 @@
+ScrollBarSlider < UIButton
+  id: sliderButton
+  anchors.centerIn: parent
+  size: 16 20
+  image-source: /images/ui/scrollbar
+  image-clip: 0 26 13 13
+  image-border: 2
+  image-color: #ffffffff
+  $hover:
+    image-clip: 13 26 13 13
+  $pressed:
+    image-clip: 26 26 13 13
+  $disabled:
+    image-color: #ffffff66
+
+ScrollBarValueLabel < Label
+  id: valueLabel
+  anchors.fill: parent
+  color: white
+  text-align: center
+
+VerticalScrollBar < UIScrollBar
+  orientation: vertical
+  width: 16
+  height: 39
+  image-source: /images/ui/scrollbar
+  image-clip: 39 0 13 65
+  image-border: 1
+  pixels-scroll: true
+
+  UIButton
+    id: decrementButton
+    anchors.top: parent.top
+    anchors.left: parent.left
+    image-source: /images/ui/scrollbar
+    image-clip: 0 0 13 13
+    image-color: #ffffffff
+    size: 16 16
+    $hover:
+      image-clip: 13 0 13 13
+    $pressed:
+      image-clip: 26 0 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  UIButton
+    id: incrementButton
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    size: 16 16
+    image-source: /images/ui/scrollbar
+    image-clip: 0 13 13 13
+    image-color: #ffffffff
+    $hover:
+      image-clip: 13 13 13 13
+    $pressed:
+      image-clip: 26 13 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  ScrollBarSlider
+
+  ScrollBarValueLabel
+
+HorizontalScrollBar < UIScrollBar
+  orientation: horizontal
+  height: 16
+  width: 39
+  image-source: /images/ui/scrollbar
+  image-clip: 0 65 52 13
+  image-border: 1
+
+  $disabled:
+    color: #bbbbbb88
+
+  UIButton
+    id: decrementButton
+    anchors.top: parent.top
+    anchors.left: parent.left
+    image-source: /images/ui/scrollbar
+    image-clip: 0 39 13 13
+    image-color: #ffffffff
+    size: 16 16
+    $hover:
+      image-clip: 13 39 13 13
+    $pressed:
+      image-clip: 26 39 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  UIButton
+    id: incrementButton
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    size: 16 16
+    image-source: /images/ui/scrollbar
+    image-clip: 0 52 13 13
+    image-color: #ffffffff
+    $hover:
+      image-clip: 13 52 13 13
+    $pressed:
+      image-clip: 26 52 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  ScrollBarSlider
+
+  ScrollBarValueLabel

SabrehavenOTClient/layouts/mobile/styles/20-smallscrollbar.otui

@@ -0,0 +1,60 @@
+SmallScrollBar < UIScrollBar
+  orientation: vertical
+  margin-bottom: 1
+  step: 20
+  width: 16
+  image-source: /images/ui/scrollbar
+  image-clip: 39 0 13 65
+  image-border: 1
+  pixels-scroll: true
+
+  UIButton
+    id: decrementButton
+    anchors.top: parent.top
+    anchors.left: parent.left
+    image-source: /images/ui/scrollbar
+    image-clip: 0 0 13 13
+    image-color: #ffffffff
+    size: 16 16
+    $hover:
+      image-clip: 13 0 13 13
+    $pressed:
+      image-clip: 26 0 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  UIButton
+    id: incrementButton
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    size: 16 16
+    image-source: /images/ui/scrollbar
+    image-clip: 0 13 13 13
+    image-color: #ffffffff
+    $hover:
+      image-clip: 13 13 13 13
+    $pressed:
+      image-clip: 26 13 13 13
+    $disabled:
+      image-color: #ffffff66
+
+  UIButton
+    id: sliderButton
+    anchors.centerIn: parent
+    size: 16 20
+    image-source: /images/ui/scrollbar
+    image-clip: 0 26 13 13
+    image-border: 2
+    image-color: #ffffffff
+    $hover:
+      image-clip: 13 26 13 13
+    $pressed:
+      image-clip: 26 26 13 13
+    $disabled:
+      image-color: #ffffff66
+        
+  Label
+    id: valueLabel
+    anchors.fill: parent
+    color: white
+    text-align: center

SabrehavenOTClient/layouts/mobile/styles/30-miniwindow.otui

@@ -0,0 +1,128 @@
+MiniWindow < UIMiniWindow
+  font: verdana-11px-antialised
+  icon-rect: 4 4 16 16
+  width: 192
+  height: 200
+  text-offset: 24 5
+  text-align: topLeft
+  image-source: /images/ui/miniwindow
+  image-border: 4
+  image-border-top: 23
+  image-border-bottom: 4
+  focusable: false
+  &minimizedHeight: 24
+
+  $on:
+    image-border-bottom: 2
+
+  UIWidget
+    id: miniwindowTopBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.left
+    margin-right: 3
+    margin-left: 3
+    margin-top: 3
+    size: 258 18
+    phantom: true
+
+  UIButton
+    id: closeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-top: 5
+    margin-right: 5
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 28 0 14 14
+
+    $hover:
+      image-clip: 28 14 14 14
+
+    $pressed:
+      image-clip: 28 28 14 14
+
+  UIButton
+    id: minimizeButton
+    anchors.top: closeButton.top
+    anchors.right: closeButton.left
+    margin-right: 3
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 0 0 14 14
+
+    $hover:
+      image-clip: 0 14 14 14
+
+    $pressed:
+      image-clip: 0 28 14 14
+
+    $on:
+      image-clip: 14 0 14 14
+
+    $on hover:
+      image-clip: 14 14 14 14
+
+    $on pressed:
+      image-clip: 14 28 14 14
+
+  UIButton
+    id: lockButton
+    anchors.top: minimizeButton.top
+    anchors.right: minimizeButton.left
+    margin-right: 3
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 112 0 14 14
+
+    $hover:
+      image-clip: 112 14 14 14
+
+    $pressed:
+    image-clip: 112 28 14 14
+
+    $on:
+      image-clip: 98 0 14 14
+
+    $on hover:
+      image-clip: 98 14 14 14
+
+    $on pressed:
+      image-clip: 98 28 14 14
+
+  VerticalScrollBar
+    id: miniwindowScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    margin-top: 22
+    margin-right: 3
+    margin-bottom: 3
+    pixels-scroll: true
+
+    $!on:
+      width: 0
+
+  ResizeBorder
+    id: bottomResizeBorder
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 8
+    minimum: 48
+    margin-left: 3
+    margin-right: 3
+    background: #ffffff88
+
+MiniWindowContents < ScrollablePanel
+  id: contentsPanel
+  anchors.fill: parent
+  anchors.right: miniwindowScrollBar.left
+  margin-left: 3
+  margin-bottom: 8
+  margin-top: 22
+  margin-right: 1
+  vertical-scrollbar: miniwindowScrollBar
+
+HeadlessMiniWindow < MiniWindow

SabrehavenOTClient/layouts/mobile/styles/40-console.otui

@@ -0,0 +1,165 @@
+ConsoleLabel < UITextEdit
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  margin-left: 2
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #999999
+  change-cursor-image: false
+  cursor-visible: false
+  editable: false
+  draggable: true
+  selectable: false
+  focusable: false
+
+ConsolePhantomLabel < UILabel
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #999999
+
+ConsoleTabBar < MoveableTabBar
+  height: 22
+
+ConsoleTabBarPanel < MoveableTabBarPanel
+  id: consoleTab
+
+  ScrollablePanel
+    id: consoleBuffer
+    anchors.fill: parent
+    margin-right: 12
+    vertical-scrollbar: consoleScrollBar
+    layout:
+      type: verticalBox
+      align-bottom: true
+    border-width: 1
+    border-color: #202327
+    background: #00000066
+    inverted-scroll: true
+    padding: 1
+
+  VerticalScrollBar
+    id: consoleScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    pixels-scroll: true
+
+ConsoleTabBarButton < MoveableTabBarButton
+  height: 22
+  padding: 5
+
+ConsolePanel < Panel
+  image-source: /images/ui/panel_bottom
+  image-border: 4
+  
+  $first:
+    anchors.fill: parent
+    
+  $!first:
+    anchors.top: prev.bottom
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+  CheckBox
+    id: toggleChat
+    !tooltip: tr('Disable chat mode, allow to walk using ASDW')
+    anchors.left: parent.left
+    anchors.top: parent.top
+    @onCheckChange: toggleChat()
+    visible: false
+
+  TabButton
+    id: prevChannelButton
+    icon: /images/game/console/leftarrow
+    anchors.left: parent.left
+    anchors.top: parent.top
+
+  ConsoleTabBar
+    id: consoleTabBar
+    anchors.left: prev.right
+    anchors.top: parent.top
+    anchors.right: next.left
+    tab-spacing: 2
+    movable: true
+
+  TabButton
+    id: nextChannelButton
+    icon: /images/game/console/rightarrow
+    anchors.right: next.left
+    anchors.top: parent.top
+
+  TabButton
+    id: closeChannelButton
+    !tooltip: tr('Close this channel') .. ' (Ctrl+E)'
+    icon: /images/game/console/closechannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    enabled: false
+    @onClick: removeCurrentTab()
+
+  TabButton
+    id: clearChannelButton
+    !tooltip: tr('Clear current message window')
+    icon: /images/game/console/clearchannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    @onClick: |
+      local consoleTabBar = self:getParent():getChildById('consoleTabBar')
+      clearChannel(consoleTabBar)
+
+  TabButton
+    id: channelsButton
+    !tooltip: tr('Open new channel') .. ' (Ctrl+O)'
+    icon: /images/game/console/channels
+    anchors.right: next.left
+    anchors.top: parent.top
+    @onClick: g_game.requestChannels()
+
+  TabButton
+    id: ignoreButton
+    !tooltip: tr('Ignore players')
+    icon: /images/game/console/ignore
+    anchors.right: parent.right
+    anchors.top: parent.top
+    @onClick: onClickIgnoreButton()
+
+  Panel
+    id: consoleContentPanel
+    anchors.top: prev.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    anchors.bottom: consoleTextEdit.top
+    padding: 1
+    focusable: false
+    phantom: true
+
+  TabButton
+    id: sayModeButton
+    icon: /images/game/console/say
+    !tooltip: tr('Adjust volume')
+    &sayMode: 2
+    size: 22 22
+    anchors.left: parent.left
+    anchors.bottom: parent.bottom
+    margin-left: 6
+    @onClick: sayModeChange()
+
+  TextEdit
+    id: consoleTextEdit
+    anchors.left: sayModeButton.right
+    anchors.right: parent.right
+    anchors.bottom: parent.bottom
+    height: 22
+    margin-right: 6
+    margin-left: 6
+    shift-navigation: true
+    max-length: 255
+    text-auto-submit: true

SabrehavenOTClient/layouts/mobile/styles/40-inventory.otui

@@ -0,0 +1,299 @@
+InventoryItem < Item
+  $on:
+    image-source: /images/ui/item-blessed
+
+HeadSlot < InventoryItem
+  id: slot1
+  image-source: /images/game/slots/head
+  &position: {x=65535, y=1, z=0}
+  $on:
+    image-source: /images/game/slots/head-blessed
+
+BodySlot < InventoryItem
+  id: slot4
+  image-source: /images/game/slots/body
+  &position: {x=65535, y=4, z=0}
+  $on:
+    image-source: /images/game/slots/body-blessed
+
+LegSlot < InventoryItem
+  id: slot7
+  image-source: /images/game/slots/legs
+  &position: {x=65535, y=7, z=0}
+  $on:
+    image-source: /images/game/slots/legs-blessed
+
+FeetSlot < InventoryItem
+  id: slot8
+  image-source: /images/game/slots/feet
+  &position: {x=65535, y=8, z=0}
+  $on:
+    image-source: /images/game/slots/feet-blessed
+
+NeckSlot < InventoryItem
+  id: slot2
+  image-source: /images/game/slots/neck
+  &position: {x=65535, y=2, z=0}
+  $on:
+    image-source: /images/game/slots/neck-blessed
+
+LeftSlot < InventoryItem
+  id: slot6
+  image-source: /images/game/slots/left-hand
+  &position: {x=65535, y=6, z=0}
+  $on:
+    image-source: /images/game/slots/left-hand-blessed
+
+FingerSlot < InventoryItem
+  id: slot9
+  image-source: /images/game/slots/finger
+  &position: {x=65535, y=9, z=0}
+  $on:
+    image-source: /images/game/slots/finger-blessed
+
+BackSlot < InventoryItem
+  id: slot3
+  image-source: /images/game/slots/back
+  &position: {x=65535, y=3, z=0}
+  $on:
+    image-source: /images/game/slots/back-blessed
+
+RightSlot < InventoryItem
+  id: slot5
+  image-source: /images/game/slots/right-hand
+  &position: {x=65535, y=5, z=0}
+  $on:
+    image-source: /images/game/slots/right-hand-blessed
+
+AmmoSlot < InventoryItem
+  id: slot10
+  image-source: /images/game/slots/ammo
+  &position: {x=65535, y=10, z=0}
+  $on:
+    image-source: /images/game/slots/ammo-blessed
+
+PurseButton < UIButton
+  id: purseButton
+  size: 34 12
+  !tooltip: tr('Open purse')
+  icon-source: /images/game/slots/purse
+  icon-clip: 0 0 34 12
+  
+  $on:
+    icon-clip: 0 12 34 12
+
+  $pressed:
+    icon-clip: 0 12 34 12
+
+CombatBox < UICheckBox
+  size: 20 20
+  image-clip: 0 0 20 20
+  margin-left: 4
+
+  $checked:
+    image-clip: 0 20 20 20
+
+
+InventoryButton < Button
+  font: verdana-11px-antialised
+  height: 18
+  margin-top: 2
+  text-align: center
+
+SoulCapLabel < GameLabel
+  text-align: center
+  color: #FFFFFF
+  font: cipsoftFont
+  margin-top: 4
+  text-offset: 0 3
+  width: 36
+  height: 20
+  icon-source: /images/game/slots/soulcap
+      
+FightOffensiveBox < CombatBox
+  image-source: /images/game/combatmodes/fightoffensive
+FightBalancedBox < CombatBox
+  image-source: /images/game/combatmodes/fightbalanced
+FightDefensiveBox < CombatBox
+  image-source: /images/game/combatmodes/fightdefensive
+ChaseModeBox < CombatBox
+  image-source: /images/game/combatmodes/chasemode
+SafeFightBox < CombatBox
+  image-source: /images/game/combatmodes/safefight
+
+MountButton < CombatBox
+  image-source: /images/game/combatmodes/mount    
+
+InventoryWindow < MiniWindow
+  icon: /images/topbuttons/inventory
+  height: 200
+  id: inventoryWindow
+  @onClose: modules.game_inventory.onMiniWindowClose()
+  &save: true
+  &autoOpen: 3
+
+  MiniWindowContents
+    anchors.left: parent.left
+        
+    Panel
+      id: inventoryPanel
+      margin-right: 63
+      margin-top: 2
+      anchors.fill: parent
+      
+      HeadSlot
+        anchors.top: parent.top
+        anchors.horizontalCenter: parent.horizontalCenter
+        margin-top: 3
+
+      BodySlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      LegSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      FeetSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      NeckSlot
+        anchors.top: slot1.top
+        anchors.right: slot1.left
+        margin-top: 13
+        margin-right: 5
+
+      LeftSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      FingerSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+        
+      BackSlot
+        anchors.top: slot1.top
+        anchors.left: slot1.right
+        margin-top: 13
+        margin-left: 5
+
+      RightSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      AmmoSlot
+        anchors.top: prev.bottom
+        anchors.horizontalCenter: prev.horizontalCenter
+        margin-top: 3
+
+      SoulCapLabel
+        id: soulLabel
+        anchors.top: slot10.bottom
+        anchors.horizontalCenter: slot10.horizontalCenter
+        
+      SoulCapLabel
+        id: capLabel
+        anchors.top: slot9.bottom
+        anchors.horizontalCenter: slot9.horizontalCenter
+
+      PurseButton
+        anchors.left: slot3.left
+        anchors.bottom: slot3.top        
+        margin-bottom: 3
+  
+      Panel
+        id: conditionPanel
+        layout:
+          type: horizontalBox
+        height: 22
+        padding: 2
+        anchors.top: slot8.bottom
+        anchors.left: slot6.left
+        anchors.right: slot5.right
+        margin-top: 4
+        border-width: 1
+        border-color: #00000077
+        background-color: #ffffff22
+        
+    Panel
+      margin-top: 5
+      anchors.fill: parent
+      anchors.left: prev.right
+        
+      FightOffensiveBox
+        id: fightOffensiveBox
+        anchors.left: parent.left
+        anchors.top: parent.top        
+        margin-left: 8
+
+      ChaseModeBox
+        id: chaseModeBox
+        anchors.left: prev.right
+        anchors.top: parent.top
+
+      FightBalancedBox
+        id: fightBalancedBox
+        margin-top: 22
+        anchors.left: parent.left
+        anchors.top: parent.top
+        margin-left: 8
+        
+      SafeFightBox
+        id: safeFightBox
+        margin-top: 22
+        anchors.left: prev.right
+        anchors.top: parent.top
+
+      FightDefensiveBox
+        id: fightDefensiveBox
+        margin-top: 44
+        anchors.left: parent.left
+        anchors.top: parent.top
+        margin-left: 8
+        
+      MountButton
+        id: mountButton
+        margin-top: 44
+        anchors.left: prev.right
+        anchors.top: parent.top
+        
+      Panel
+        id: buttonsPanel
+        margin-top: 4
+        margin-right: 5
+        anchors.fill: parent
+        anchors.top: prev.bottom
+        layout:
+          type: verticalBox
+        
+        UIButton
+          id: buttonPvp
+          height: 20
+          icon: /images/game/combatmodes/pvp
+          icon-clip: 0 0 42 20
+
+          $on:
+            icon-clip: 0 20 42 20
+        
+        InventoryButton
+          !text: tr('Stop')
+          @onClick: g_game.stop(); g_game.cancelAttackAndFollow()
+
+        InventoryButton
+          !text: tr('Options')
+          @onClick: modules.client_options.toggle()
+
+        InventoryButton
+          !text: tr('Quests')
+          @onClick: g_game.requestQuestLog()
+
+        InventoryButton
+          !text: tr('Logout')
+          @onClick: modules.game_interface.tryLogout()

SabrehavenOTClient/layouts/retro/styles/10-checkboxes.otui

@@ -0,0 +1,59 @@
+CheckBox < UICheckBox
+  size: 12 12
+  text-align: left
+  text-offset: 18 -1
+  color: #dfdfdf
+  image-color: #dfdfdfff
+  image-rect: 0 0 12 12
+  image-source: /images/ui/checkbox
+
+  $hover !disabled:
+    color: #ffffff
+
+  $!checked:
+    image-clip: 0 0 12 12
+
+  $checked:
+    image-clip: 0 12 12 12
+
+  $disabled:
+    image-color: #dfdfdf88
+    color: #dfdfdf88
+    opacity: 0.8
+
+ColorBox < UICheckBox
+  size: 16 16
+  image-color: #dfdfdfff
+  image-source: /images/ui/colorbox
+
+  $checked:
+    image-clip: 16 0 16 16
+
+  $!checked:
+    image-clip: 0 0 16 16
+
+ButtonBox < UICheckBox
+  font: verdana-11px-antialised
+  color: white
+  size: 106 23
+  text-offset: 0 0
+  text-align: center
+  image-source: /images/ui/button
+  image-color: #dfdfdf
+  image-clip: 0 0 22 23
+  image-border: 3
+
+  $hover !disabled:
+    image-clip: 0 23 22 23
+
+  $checked:
+    image-clip: 0 46 22 23
+    color: white
+    text-offset: 2 2
+
+  $disabled:
+    color: #dfdfdf88
+    image-color: #dfdfdf88
+
+ButtonBoxRounded < ButtonBox
+  image-source: /images/ui/button_rounded

SabrehavenOTClient/layouts/retro/styles/10-comboboxes.otui

@@ -0,0 +1,106 @@
+ComboBoxPopupScrollMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 4 0
+  color: #BFBFBF
+  background-color: alpha
+  margin: 1
+
+  $hover !disabled:
+    color: #dfdfdf
+    background-color: #595959
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxPopupScrollMenu < UIPopupScrollMenu
+  image-source: /images/ui/combobox_square
+  image-clip: 0 69 91 23
+  image-border: 1
+
+ComboBoxPopupMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+  margin: 1
+
+  $hover !disabled:
+    color: #dfdfdf
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxPopupMenu < UIPopupMenu
+  image-source: /images/ui/combobox_square
+  image-clip: 0 69 91 23
+  image-border: 1
+
+ComboBox < UIComboBox
+  font: verdana-11px-antialised
+  color: #dfdfdf
+  size: 91 23
+  text-offset: 5 2
+  text-align: left
+  image-source: /images/ui/combobox_square
+  image-border: 3
+  image-border-right: 19
+  image-clip: 0 0 91 23
+
+  $hover !disabled:
+    image-clip: 0 23 91 23
+
+  $on:
+    image-clip: 0 46 91 23
+
+  $disabled:
+    color: #dfdfdf88
+    opacity: 0.8
+
+ComboBoxRoundedPopupScrollMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxRoundedPopupScrollMenu < UIPopupScrollMenu
+  image-source: /images/ui/combobox_rounded
+  image-clip: 0 69 91 23
+  image-border: 3
+
+ComboBoxRoundedPopupMenuButton < UIButton
+  height: 23
+  font: verdana-11px-antialised
+  text-align: left
+  text-offset: 5 2
+  color: #dfdfdf
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #355d89
+
+  $disabled:
+    color: #dfdfdf88
+
+ComboBoxRoundedPopupMenu < UIPopupMenu
+  image-source: /images/ui/combobox_rounded
+  image-clip: 0 69 91 23
+  image-border: 3
+
+ComboBoxRounded < ComboBox
+  image-source: /images/ui/combobox_rounded
+  image-border: 3

SabrehavenOTClient/layouts/retro/styles/10-panels.otui

@@ -0,0 +1,19 @@
+Panel < UIWidget
+  phantom: true
+  auto-focus: first
+
+ScrollablePanel < UIScrollArea
+  phantom: true
+  auto-focus: first
+
+FlatPanel < Panel
+  image-source: /images/ui/panel_flat
+  image-border: 1
+
+ScrollableFlatPanel < ScrollablePanel
+  image-source: /images/ui/panel_flat
+  image-border: 1
+
+LightFlatPanel < Panel
+  image-source: /images/ui/panel_lightflat
+  image-border: 1

SabrehavenOTClient/layouts/retro/styles/10-progressbars.otui

@@ -0,0 +1,38 @@
+ProgressBar < UIProgressBar
+  height: 16
+  background-color: red
+  image-source: /images/ui/progressbar
+  image-border: 2
+  font: verdana-11px-rounded
+  text-offset: 0 2
+
+  $!on:
+    visible: false
+    margin-top: 0
+    margin-bottom: 0
+    height: 0
+
+LifeProgressBar < UIProgressBar
+  height: 16
+  background-color: green
+  border: 1 black
+  font: verdana-11px-rounded
+  text-offset: 0 2
+  margin: 2
+
+ProgressRect < UIProgressRect
+  anchors.fill: parent
+  phantom: true
+  color: white
+  background-color: #00000088
+  font: verdana-11px-rounded
+
+HealthBar < ProgressBar
+  image-source: /images/ui/progressbarhpmana
+  image-border: 3
+  background-color: #ff4444
+
+ManaBar < ProgressBar
+  image-source: /images/ui/progressbarhpmana
+  image-border: 4
+  background-color: #4444ff

SabrehavenOTClient/layouts/retro/styles/10-textedits.otui

@@ -0,0 +1,20 @@
+TextEdit < UITextEdit
+  font: verdana-11px-antialised
+  color: white
+  size: 86 22
+  text-offset: 0 4
+  opacity: 1
+  padding: 4
+  image-source: /images/ui/textedit
+  image-border: 1
+  selection-color: #272727
+  selection-background-color: #cccccc
+  $disabled:
+    color: #27272788
+    opacity: 0.5
+
+PasswordTextEdit < TextEdit
+  text-hidden: true
+
+MultilineTextEdit < TextEdit
+  multiline: true

SabrehavenOTClient/layouts/retro/styles/10-windows.otui

@@ -0,0 +1,32 @@
+Window < UIWindow
+  font: verdana-11px-antialised
+  size: 236 207
+  opacity: 1
+  color: #AFAFAF
+  text-offset: 0 2
+  text-align: top
+  image-source: /images/ui/window
+  image-border: 4
+  image-border-top: 17
+  padding-top: 25
+  padding-left: 16
+  padding-right: 16
+  padding-bottom: 16
+
+  $disabled:
+    color: #dfdfdf
+
+HeadlessWindow < UIWindow
+  image-source: /images/ui/window_headless
+  image-border: 5
+  padding: 5
+
+MainWindow < Window
+  anchors.centerIn: parent
+
+StaticWindow < Window
+  &static: true
+
+StaticMainWindow < StaticWindow
+  anchors.centerIn: parent
+  

SabrehavenOTClient/layouts/retro/styles/20-popupmenus.otui

@@ -0,0 +1,83 @@
+PopupMenuButton < UIButton
+  height: 18
+  size: 0 21
+  text-offset: 4 2
+  text-align: left
+  font: verdana-11px-antialised
+
+  color: white
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #ffffff44
+    image-clip: 0 40 20 20
+
+  $disabled:
+    color: #555555
+
+PopupMenuShortcutLabel < Label
+  font: verdana-11px-antialised
+  text-align: right
+  anchors.fill: parent
+  margin-right: 2
+  margin-left: 5
+
+PopupMenuSeparator < UIWidget
+  margin-left: 2
+  margin-right: 2
+  margin-bottom: 1
+  image-source: /images/ui/separator_horizontal
+  image-border-left: 1
+  image-border-right: 1
+  image-clip: 0 0 32 2
+  height: 2
+  phantom: true
+
+PopupMenu < UIPopupMenu
+  width: 120
+  image-source: /images/ui/menubox
+  image-border: 3
+  padding: 5
+
+PopupScrollMenuButton < UIButton
+  height: 18
+  size: 0 21
+  text-offset: 4 0
+  text-align: left
+  font: verdana-11px-antialised
+
+  color: #aaaaaa
+  background-color: alpha
+
+  $hover !disabled:
+    color: #ffffff
+    background-color: #ffffff44
+    image-clip: 0 40 20 20
+
+  $disabled:
+    color: #555555
+
+PopupScrollMenuShortcutLabel < Label
+  font: verdana-11px-antialised
+  text-align: right
+  anchors.fill: parent
+  margin-right: 2
+  margin-left: 5
+
+PopupScrollMenuSeparator < UIWidget
+  margin-left: 2
+  margin-right: 2
+  margin-bottom: 1
+  image-source: /images/ui/menubox
+  image-border-left: 1
+  image-border-right: 1
+  image-clip: 0 0 32 2
+  height: 2
+  phantom: true
+
+PopupScrollMenu < UIPopupScrollMenu
+  width: 50
+  image-source: /images/ui/menubox
+  image-border: 3
+  padding: 3

SabrehavenOTClient/layouts/retro/styles/20-tabbars.otui

@@ -0,0 +1,113 @@
+MoveableTabBar < UIMoveableTabBar
+  size: 80 21
+MoveableTabBarPanel < Panel
+MoveableTabBarButton < UIButton
+  size: 96 18
+  image-source: /images/ui/tabbutton_square
+  image-clip: 0 0 96 22
+  image-border: 3
+  image-border-bottom: 0
+  color: #7F7F7F
+  anchors.top: parent.top
+  anchors.left: parent.left
+  margin-top: 2
+  padding: 3
+
+  $checked:
+    image-clip: 0 36 96 22
+    color: #dfdfdf
+
+  $on !checked:
+    color: #F75F5F
+
+TabBar < UITabBar
+  size: 80 21
+  Panel
+    id: buttonsPanel
+    anchors.fill: parent
+TabBarPanel < Panel
+TabBarButton < UIButton
+  size: 17 18
+  image-source: /images/ui/tabbutton_square
+  image-color: #dfdfdf
+  image-clip: 0 0 98 18
+  image-border: 3
+  icon-color: #dfdfdf
+  color: #dfdfdf
+  anchors.top: parent.top
+  padding: 5
+
+  $first:
+    anchors.left: parent.left
+
+  $!first:
+    anchors.left: prev.right
+    margin-left: 5
+
+  $hover !checked:
+    image-clip: 0 18 98 18
+    color: #dfdfdf
+
+  $disabled:
+    image-color: #dfdfdf88
+    icon-color: #dfdfdf
+
+  $checked:
+    image-clip: 0 36 98 18
+    color: #dfdfdf
+
+  $on !checked:
+    color: #de6f6f
+
+TabBarRounded < TabBar
+TabBarRoundedPanel < TabBarPanel
+TabBarRoundedButton < TabBarButton
+  image-source: /images/ui/tabbutton_rounded
+
+TabBarVertical < UITabBar
+  width: 96
+  ScrollableFlatPanel
+    id: buttonsPanel
+    anchors.top: parent.top
+    anchors.left: parent.left
+    anchors.right: scrollBar.left
+    anchors.bottom: parent.bottom
+    vertical-scrollbar: scrollBar
+    margin-right: 1
+    padding-top: 10
+    
+  VerticalScrollBar
+    id: scrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 16
+    pixels-scroll: true
+    $!on:
+      width: 0
+
+TabBarVerticalPanel < Panel 
+TabBarVerticalButton < UIButton
+  size: 48 48
+  color: #aaaaaa
+  anchors.left: parent.left
+  anchors.right: parent.right
+  text-align: bottom
+  icon-align: top
+  icon-offset-y: 2
+  icon-color: #888888
+  $first:
+    anchors.top: parent.top
+  $!first:
+    anchors.top: prev.bottom
+    margin-top: 10
+  $hover !checked:
+    color: white
+    icon-color: #dfdfdf
+  $disabled:
+    icon-color: #333333
+  $checked:
+    icon-color: #ffffff
+    color: #80c7f8
+  $on !checked:
+    color: #F55E5E

SabrehavenOTClient/layouts/retro/styles/20-topmenu.otui

@@ -0,0 +1,131 @@
+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
+  icon-clip: 0 0 20 20
+  
+  $on:
+    image-source: /images/ui/button_top_blink
+    icon-clip: 0 20 20 20
+
+  $hover !disabled:
+    image-color: #ffffff99
+    image-clip: 26 0 26 26
+
+  $pressed:
+    image-clip: 52 0 26 26
+    icon-clip: 0 20 20 20
+
+  $disabled:
+    image-color: #ffffff44
+    icon-color: #ffffff44
+
+TopToggleButton < UIButton
+  size: 20 20
+  image-source: /images/ui/button_top
+  image-clip: 0 0 26 26
+  image-color: #ffffffff
+  image-border: 3
+  icon-clip: 0 0 20 20
+  icon-color: #ffffffff
+  
+  $on:
+    icon-clip: 0 20 20 20
+
+  $hover !disabled:
+    image-color: #ffffff99
+    image-clip: 26 0 26 26
+
+  $pressed:
+    image-clip: 52 0 26 26
+    icon-clip: 0 20 20 20
+
+  $disabled:
+    image-color: #ffffff44
+    icon-color: #ffffff44
+    
+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
+  image-border: 3
+  image-border-top: 0
+  focusable: false
+
+TopMenuFrameCounterLabel < Label
+  font: verdana-11px-rounded
+  color: white
+  margin-top: 4
+  margin-left: 5
+
+TopMenuPingLabel < Label
+  font: verdana-11px-rounded
+
+TopMenu < TopMenuPanel
+  id: topMenu
+  width: 800
+  anchors.horizontalCenter: parent.horizontalCenter
+  anchors.top: parent.top
+  &hideIngame: true
+  &reverseButtons: true
+
+  UIWidget
+    id: discord
+    anchors.top: parent.top
+    anchors.left: parent.left
+    margin-top: 3
+    margin-left: 5
+    image-source: /images/ui/discord
+    
+  Label
+    id: discordLabel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+    text-align: center
+    margin-left: 2
+    text-auto-resize: true
+
+  TopMenuButtonsPanel
+    id: rightButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+
+  TopMenuButtonsPanel
+    id: rightGameButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.left: prev.right
+    visible: false
+
+  Label
+    id: onlineLabel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.horizontalCenter: parent.horizontalCenter
+    text-align: center
+    text-auto-resize: true
+
+  TopMenuButtonsPanel
+    id: leftButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+
+  TopMenuButtonsPanel
+    id: leftGameButtonsPanel
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: prev.left
+    visible: false

SabrehavenOTClient/layouts/retro/styles/30-miniwindow.otui

@@ -0,0 +1,215 @@
+MiniWindow < UIMiniWindow
+  font: verdana-11px-antialised
+  icon-rect: 4 2 13 13
+  icon-clip: 0 0 20 20
+  color: #9F9F9F
+  width: 190
+  height: 200
+  text-offset: 24 2
+  text-align: topLeft
+  image-source: /images/ui/miniwindow
+  image-border: 4
+  image-border-top: 20
+  image-border-bottom: 4
+  focusable: false
+  &minimizedHeight: 20
+
+  $on:
+    image-border-bottom: 2
+
+  UIWidget
+    id: miniwindowTopBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.left
+    margin-right: 3
+    margin-left: 3
+    margin-top: 3
+    size: 258 14
+    phantom: true
+
+  UIButton
+    id: closeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-top: 2
+    margin-right: 4
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 28 0 14 14
+
+    $hover:
+      image-clip: 28 14 14 14
+
+    $pressed:
+      image-clip: 28 28 14 14
+
+  UIButton
+    id: minimizeButton
+    anchors.top: closeButton.top
+    anchors.right: closeButton.left
+    margin-right: 3
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 0 0 14 14
+
+    $hover:
+      image-clip: 0 14 14 14
+
+    $pressed:
+      image-clip: 0 28 14 14
+
+    $on:
+      image-clip: 14 0 14 14
+
+    $on hover:
+      image-clip: 14 14 14 14
+
+    $on pressed:
+      image-clip: 14 28 14 14
+
+  UIButton
+    id: lockButton
+    anchors.top: minimizeButton.top
+    anchors.right: minimizeButton.left
+    margin-right: 2
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 98 0 14 14
+
+    $hover:
+      image-clip: 98 14 14 14
+
+    $pressed:
+      image-clip: 98 28 14 14
+
+    $on:
+      image-clip: 84 0 14 14
+
+    $on hover:
+      image-clip: 84 14 14 14
+
+    $on pressed:
+      image-clip: 84 28 14 14
+
+  VerticalScrollBar
+    id: miniwindowScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    margin-top: 18
+    margin-right: 4
+    margin-bottom: 3
+    pixels-scroll: true
+
+    $!on:
+      width: 0
+
+  ResizeBorder
+    id: bottomResizeBorder
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 3
+    minimum: 48
+    margin-left: 3
+    margin-right: 3
+    background: #ffffff88
+
+MiniWindowContents < ScrollablePanel
+  id: contentsPanel
+  anchors.fill: parent
+  anchors.right: miniwindowScrollBar.left
+  margin-left: 3
+  margin-bottom: 3
+  margin-top: 18
+  margin-right: 1
+  vertical-scrollbar: miniwindowScrollBar
+
+HeadlessMiniWindow < UIMiniWindow
+  font: verdana-11px-antialised
+  icon-rect: 4 2 13 12
+  icon-clip: 0 0 20 20
+  color: #8F8F8F
+  width: 190
+  height: 200
+  focusable: false
+  &minimizedHeight: 20
+
+  $on:
+    image-border-bottom: 2
+    
+  $!on:
+    text:
+    icon:
+
+  UIButton
+    id: minimizeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    margin-right: 10
+    margin-top: 1
+    size: 14 14
+    image-source: /images/ui/miniwindow_buttons
+    image-clip: 0 0 14 14
+
+    $hover:
+      image-clip: 0 14 14 14
+
+    $pressed:
+      image-clip: 0 28 14 14
+
+    $on:
+      image-clip: 14 0 14 14
+
+    $on hover:
+      image-clip: 14 14 14 14
+
+    $on pressed:
+      image-clip: 14 28 14 14
+      
+    $!on:
+      size: 0 0
+
+  UIWidget
+    id: miniwindowTopBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.left
+    margin-right: 3
+    margin-left: 3
+    margin-top: 3
+    size: 258 14
+    phantom: true
+
+  UIButton
+    id: closeButton
+    anchors.top: parent.top
+    anchors.right: parent.right
+    hidden: true
+
+  VerticalScrollBar
+    id: miniwindowScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    margin-top: 16
+    margin-right: 4
+    margin-bottom: 3
+    pixels-scroll: true
+
+    $!on:
+      width: 0
+
+  ResizeBorder
+    id: bottomResizeBorder
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 3
+    minimum: 48
+    margin-left: 3
+    margin-right: 3
+    background: #ffffff88

SabrehavenOTClient/layouts/retro/styles/40-console.otui

@@ -0,0 +1,219 @@
+ConsoleLabel < UITextEdit
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  margin-left: 1
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #808080
+  change-cursor-image: false
+  cursor-visible: false
+  editable: false
+  draggable: true
+  selectable: false
+  focusable: false
+
+ConsolePhantomLabel < UILabel
+  font: verdana-11px-antialised
+  height: 14
+  color: yellow
+  text-wrap: true
+  text-auto-resize: true
+  selection-color: #111416
+  selection-background-color: #999999
+
+ConsoleTabBar < MoveableTabBar
+  height: 16
+
+ConsoleTabBarPanel < MoveableTabBarPanel
+  id: consoleTab
+
+  ScrollablePanel
+    id: consoleBuffer
+    anchors.fill: parent
+    margin-right: 12
+    vertical-scrollbar: consoleScrollBar
+    layout:
+      type: verticalBox
+      align-bottom: true
+    border-width: 1
+    border-color: #202327
+    background: #00000066
+    inverted-scroll: true
+    padding: 1
+
+  VerticalScrollBar
+    id: consoleScrollBar
+    anchors.top: parent.top
+    anchors.bottom: parent.bottom
+    anchors.right: parent.right
+    step: 14
+    pixels-scroll: true
+
+ConsoleTabBarButton < MoveableTabBarButton
+  height: 16
+  padding: 15
+
+ConsolePanel < Panel
+  image-source: /images/ui/panel_bottom
+  image-border: 7
+  image-border-top: 29
+  
+  $first:
+    anchors.fill: parent
+    
+  $!first:
+    anchors.top: prev.bottom
+    anchors.bottom: parent.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+
+  CheckBox
+    id: toggleChat
+    !tooltip: tr('Disable chat mode, allow to walk using ASDW')
+    anchors.left: parent.left
+    anchors.top: parent.top
+    margin-left: 6
+    margin-top: 3
+    @onCheckChange: toggleChat()
+
+  TabButton
+    id: prevChannelButton
+    icon: /images/game/console/leftarrow
+    anchors.left: toggleChat.right
+    anchors.top: parent.top
+    margin-top: 1
+    size: 16 16
+    
+  ConsoleTabBar
+    id: consoleTabBar
+    anchors.left: prev.right
+    anchors.top: parent.top
+    anchors.right: next.left
+    margin-top: 0
+    tab-spacing: 2
+    movable: true
+
+  TabButton
+    id: nextChannelButton
+    icon: /images/game/console/rightarrow
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-top: 1
+    size: 16 16
+    margin-right: 5
+
+  TabButton
+    id: closeChannelButton
+    !tooltip: tr('Close this channel') .. ' (Ctrl+E)'
+    icon: /images/game/console/closechannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    enabled: false
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: removeCurrentTab()
+    
+  TabButton
+    id: clearChannelButton
+    !tooltip: tr('Clear current message window')
+    icon: /images/game/console/clearchannel
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: |
+      local consoleTabBar = self:getParent():getChildById('consoleTabBar')
+      clearChannel(consoleTabBar)
+
+  TabButton
+    id: channelsButton
+    !tooltip: tr('Open new channel') .. ' (Ctrl+O)'
+    icon: /images/game/console/channels
+    anchors.right: next.left
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: g_game.requestChannels()
+
+  TabButton
+    id: ignoreButton
+    !tooltip: tr('Ignore players')
+    icon: /images/game/console/ignore
+    anchors.right: parent.right
+    anchors.top: parent.top
+    margin-right: 5
+    margin-top: 1
+    size: 16 16
+    icon-clip: 0 0 16 16
+
+    $pressed:
+      icon-clip: 0 16 16 16
+
+    @onClick: onClickIgnoreButton()
+
+  Panel
+    id: consoleContentPanel
+    anchors.top: consoleTabBar.bottom
+    anchors.left: parent.left
+    anchors.right: parent.right
+    anchors.bottom: consoleTextEdit.top
+    margin-left: 6
+    margin-right: 6
+    margin-bottom: 2
+    margin-top: 6
+    padding: 1
+    focusable: false
+    phantom: true
+
+  TabButton
+    id: sayModeButton
+    icon: /images/game/console/say
+    !tooltip: tr('Adjust volume')
+    &sayMode: 2
+    size: 18 18
+    anchors.left: parent.left
+    anchors.bottom: parent.bottom
+    margin-left: 8
+    margin-bottom: 4
+    @onClick: sayModeChange()
+
+  HorizontalSeparator
+    id: separator
+    anchors.left: parent.left
+    anchors.right: parent.right
+    anchors.bottom: prev.top
+    margin-bottom: 3
+    margin-left: 7
+    margin-right: 7
+
+  TextEdit
+    id: consoleTextEdit
+    anchors.left: sayModeButton.right
+    anchors.right: parent.right
+    anchors.bottom: parent.bottom
+    margin-right: 7
+    margin-left: 2
+    margin-bottom: 2
+    shift-navigation: true
+    max-length: 255
+    text-auto-submit: true

SabrehavenOTClient/layouts/retro/styles/40-entergame.otui

@@ -0,0 +1,3 @@
+EnterGameWindow < StaticMainWindow
+  !text: tr('Enter Game')
+  size: 260 340

SabrehavenOTClient/layouts/retro/styles/40-gamebuttons.otui

@@ -0,0 +1,16 @@
+GameButtonsWindow < HeadlessMiniWindow
+  height: 26
+  &forceOpen: true
+  &autoOpen: 4
+
+  MiniWindowContents
+    margin-top: 2
+    
+    Panel
+      id: buttons
+      anchors.fill: parent
+      layout:
+        type: grid
+        cell-spacing: 3
+        cell-size: 20 20
+        flow: true

SabrehavenOTClient/layouts/retro/styles/40-healthinfo.otui

@@ -0,0 +1,154 @@
+ExperienceBar < ProgressBar
+  id: experienceBar
+  background-color: #B6E866
+  anchors.top: prev.bottom
+  anchors.left: parent.left
+  anchors.right: parent.right
+  margin: 1
+  margin-top: 3
+
+SoulLabel < GameLabel
+  id: soulLabel
+  text-align: right
+  color: white
+  font: verdana-11px-rounded
+  anchors.bottom: parent.bottom
+  anchors.right: parent.right
+  anchors.left: parent.horizontalCenter
+  margin-top: 5
+  margin-right: 3
+  on: true
+
+  $!on:
+    visible: false
+    margin-top: 0
+    height: 0
+
+CapLabel < GameLabel
+  id: capLabel
+  color: white
+  font: verdana-11px-rounded
+  anchors.bottom: parent.bottom
+  anchors.left: parent.left
+  anchors.right: parent.horizontalCenter
+  margin-top: 5
+  margin-left: 3
+  on: true
+
+  $!on:
+    visible: false
+    margin-top: 0
+    height: 0
+
+ConditionWidget < UIWidget
+  size: 18 18
+
+  $!first:
+    margin-left: 2
+      
+HealthOverlay < UIWidget
+  id: healthOverlay
+  anchors.fill: parent
+  phantom: true
+  
+  HealthBar
+    id: topHealthBar
+    anchors.top: parent.top
+    anchors.left: parent.left
+    anchors.right: parent.horizontalCenter
+    phantom: true
+
+  ManaBar
+    id: topManaBar
+    anchors.top: parent.top
+    anchors.right: parent.right
+    anchors.left: parent.horizontalCenter
+    phantom: true
+    
+  UIProgressBar
+    id: healthCircle
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/left_empty
+    margin-right: 169
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: healthCircleFront
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/left_full
+    margin-right: 169
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: manaCircle
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/right_empty    
+    margin-left: 130
+    margin-bottom: 16
+    opacity: 0.5
+    phantom: true
+
+  UIProgressBar
+    id: manaCircleFront
+    anchors.horizontalCenter: parent.horizontalCenter
+    anchors.verticalCenter: parent.verticalCenter
+    image-source: /images/game/circle/right_full
+    margin-left: 130
+    margin-bottom: 16    
+    opacity: 0.4
+    image-color: #0000FFFF
+    phantom: true
+  
+HealthInfoWindow < HeadlessMiniWindow
+  icon: 
+  text:
+  height: 100
+  &forceOpen: true
+  icon: /images/topbuttons/healthinfo
+  !text: tr('Health Info')  
+
+  MiniWindowContents
+    margin-top: 2
+    
+    HealthBar
+      id: healthBar
+      anchors.top: parent.top
+      anchors.left: parent.left
+      anchors.right: parent.right
+      margin: 2
+      margin-top: 0
+      phantom: true
+      
+    ManaBar
+      id: manaBar
+      anchors.top: prev.bottom
+      anchors.left: parent.left
+      anchors.right: parent.right
+      margin: 2
+      margin-bottom: 0
+      phantom: true
+      
+    ExperienceBar
+    Panel
+      id: conditionPanel
+      layout:
+        type: horizontalBox
+      height: 22
+      margin-top: 4
+      padding: 2
+      anchors.top: prev.bottom
+      anchors.left: parent.left
+      anchors.right: parent.right
+      border-width: 1
+      border-color: #00000077
+      background-color: #ffffff11
+    SoulLabel
+    CapLabel
+