From 878ac6472114f2aeb7ead0b5e96fd323137a4e0f Mon Sep 17 00:00:00 2001
From: samcake <samuel.gateau@gmail.com>
Date: Fri, 25 Aug 2017 17:00:27 -0700
Subject: [PATCH] adding the qml styles

---
 .../lib/styles-uit/AnonymousProRegular.qml    |  23 ++
 .../utilities/lib/styles-uit/ButtonLabel.qml  |  18 +
 .../lib/styles-uit/FiraSansRegular.qml        |  23 ++
 .../lib/styles-uit/FiraSansSemiBold.qml       |  23 ++
 .../utilities/lib/styles-uit/HiFiGlyphs.qml   |  25 ++
 .../lib/styles-uit/HifiConstants.qml          | 342 ++++++++++++++++++
 .../lib/styles-uit/HifiConstants.qmlc         | Bin 0 -> 51304 bytes
 .../utilities/lib/styles-uit/IconButton.qml   |  20 +
 .../utilities/lib/styles-uit/InfoItem.qml     |  19 +
 .../utilities/lib/styles-uit/InputLabel.qml   |  18 +
 .../utilities/lib/styles-uit/ListItem.qml     |  18 +
 .../utilities/lib/styles-uit/Logs.qml         |  18 +
 .../utilities/lib/styles-uit/OverlayTitle.qml |  18 +
 .../utilities/lib/styles-uit/RalewayBold.qml  |  24 ++
 .../utilities/lib/styles-uit/RalewayLight.qml |  23 ++
 .../lib/styles-uit/RalewayRegular.qml         |  23 ++
 .../lib/styles-uit/RalewaySemiBold.qml        |  23 ++
 .../utilities/lib/styles-uit/SectionName.qml  |  19 +
 .../utilities/lib/styles-uit/Separator.qml    |  41 +++
 .../utilities/lib/styles-uit/ShortcutText.qml |  18 +
 .../utilities/lib/styles-uit/TabName.qml      |  19 +
 .../lib/styles-uit/TextFieldInput.qml         |  18 +
 22 files changed, 773 insertions(+)
 create mode 100644 scripts/developer/utilities/lib/styles-uit/AnonymousProRegular.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/ButtonLabel.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/FiraSansRegular.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/FiraSansSemiBold.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/HiFiGlyphs.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/HifiConstants.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/HifiConstants.qmlc
 create mode 100644 scripts/developer/utilities/lib/styles-uit/IconButton.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/InfoItem.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/InputLabel.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/ListItem.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/Logs.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/OverlayTitle.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/RalewayBold.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/RalewayLight.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/RalewayRegular.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/RalewaySemiBold.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/SectionName.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/Separator.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/ShortcutText.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/TabName.qml
 create mode 100644 scripts/developer/utilities/lib/styles-uit/TextFieldInput.qml

diff --git a/scripts/developer/utilities/lib/styles-uit/AnonymousProRegular.qml b/scripts/developer/utilities/lib/styles-uit/AnonymousProRegular.qml
new file mode 100644
index 0000000000..789689973b
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/AnonymousProRegular.qml
@@ -0,0 +1,23 @@
+//
+//  AnonymousProRegular.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: anonymousProRegular; source: "../../fonts/AnonymousPro-Regular.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: anonymousProRegular.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/ButtonLabel.qml b/scripts/developer/utilities/lib/styles-uit/ButtonLabel.qml
new file mode 100644
index 0000000000..aade5fb439
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/ButtonLabel.qml
@@ -0,0 +1,18 @@
+//
+//  ButtonLabel.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayBold {
+    font.pixelSize: hifi.fontSizes.buttonLabel
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/FiraSansRegular.qml b/scripts/developer/utilities/lib/styles-uit/FiraSansRegular.qml
new file mode 100644
index 0000000000..4ae0826772
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/FiraSansRegular.qml
@@ -0,0 +1,23 @@
+//
+//  FiraSansRegular.qml
+//
+//  Created by David Rowe on 12 May 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: firaSansRegular; source: "../../fonts/FiraSans-Regular.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: firaSansRegular.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/FiraSansSemiBold.qml b/scripts/developer/utilities/lib/styles-uit/FiraSansSemiBold.qml
new file mode 100644
index 0000000000..b3f3324090
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/FiraSansSemiBold.qml
@@ -0,0 +1,23 @@
+//
+//  FiraSansSemiBold.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: firaSansSemiBold; source: pathToFonts + "fonts/FiraSans-SemiBold.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: firaSansSemiBold.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/HiFiGlyphs.qml b/scripts/developer/utilities/lib/styles-uit/HiFiGlyphs.qml
new file mode 100644
index 0000000000..cbd6fa1d68
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/HiFiGlyphs.qml
@@ -0,0 +1,25 @@
+//
+//  HiFiGlyphs.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: hiFiGlyphs; source: pathToFonts + "fonts/hifi-glyphs.ttf"; }
+    property int size: 32
+    font.pixelSize: size
+    width: size
+    height: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: hiFiGlyphs.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/HifiConstants.qml b/scripts/developer/utilities/lib/styles-uit/HifiConstants.qml
new file mode 100644
index 0000000000..4a26d11128
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/HifiConstants.qml
@@ -0,0 +1,342 @@
+//
+//  HiFiConstants.qml
+//
+//  Created by Bradley Austin Davis on 28 Apr 2015
+//  Copyright 2015 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Window 2.2
+
+Item {
+    readonly property alias colors: colors
+    readonly property alias colorSchemes: colorSchemes
+    readonly property alias dimensions: dimensions
+    readonly property alias fontSizes: fontSizes
+    readonly property alias glyphs: glyphs
+    readonly property alias icons: icons
+    readonly property alias buttons: buttons
+    readonly property alias effects: effects
+
+    function glyphForIcon(icon) {
+        // Translates icon enum to glyph char.
+        var glyph;
+        switch (icon) {
+            case hifi.icons.information:
+                glyph = hifi.glyphs.info;
+                break;
+            case hifi.icons.question:
+                glyph = hifi.glyphs.question;
+                break;
+            case hifi.icons.warning:
+                glyph = hifi.glyphs.alert;
+                break;
+            case hifi.icons.critical:
+                glyph = hifi.glyphs.error;
+                break;
+            case hifi.icons.placemark:
+                glyph = hifi.glyphs.placemark;
+                break;
+            default:
+                glyph = hifi.glyphs.noIcon;
+        }
+        return glyph;
+    }
+
+    Item {
+        id: colors
+
+        // Base colors
+        readonly property color baseGray: "#393939"
+        readonly property color darkGray: "#121212"
+        readonly property color baseGrayShadow: "#252525"
+        readonly property color baseGrayHighlight: "#575757"
+        readonly property color lightGray: "#6a6a6a"
+        readonly property color lightGrayText: "#afafaf"
+        readonly property color faintGray: "#e3e3e3"
+        readonly property color primaryHighlight: "#00b4ef"
+        readonly property color blueHighlight: "#00b4ef"
+        readonly property color blueAccent: "#0093C5"
+        readonly property color redHighlight: "#EA4C5F"
+        readonly property color redAccent: "#C62147"
+        readonly property color greenHighlight: "#1ac567"
+        readonly property color greenShadow: "#359D85"
+        readonly property color orangeHighlight: "#FFC49C"
+        readonly property color orangeAccent: "#FF6309"
+        readonly property color indigoHighlight: "#C0D2FF"
+        readonly property color indigoAccent: "#9495FF"
+        readonly property color magentaHighlight: "#EF93D1"
+        readonly property color magentaAccent: "#A2277C"
+        readonly property color checkboxCheckedRed: "#FF0000"
+        readonly property color checkboxCheckedBorderRed: "#D00000"
+        readonly property color lightBlueHighlight: "#d6f6ff"
+
+        // Semitransparent
+        readonly property color darkGray30: "#4d121212"
+        readonly property color darkGray0: "#00121212"
+        readonly property color baseGrayShadow60: "#99252525"
+        readonly property color baseGrayShadow50: "#80252525"
+        readonly property color baseGrayShadow25: "#40252525"
+        readonly property color baseGrayHighlight40: "#66575757"
+        readonly property color baseGrayHighlight15: "#26575757"
+        readonly property color lightGray50: "#806a6a6a"
+        readonly property color lightGrayText80: "#ccafafaf"
+        readonly property color faintGray80: "#cce3e3e3"
+        readonly property color faintGray50: "#80e3e3e3"
+
+        // Other colors
+        readonly property color white: "#ffffff"
+        readonly property color gray: "#808080"
+        readonly property color black: "#000000"
+        readonly property color locked: "#252525"
+        // Semitransparent
+        readonly property color white50: "#80ffffff"
+        readonly property color white30: "#4dffffff"
+        readonly property color white25: "#40ffffff"
+        readonly property color transparent: "#00ffffff"
+
+        // Control specific colors
+        readonly property color tableRowLightOdd: "#fafafa"
+        readonly property color tableRowLightEven: "#eeeeee" // Equivavlent to "#1a575757" over #e3e3e3 background
+        readonly property color tableRowDarkOdd: "#2e2e2e"   // Equivalent to "#80393939" over #404040 background
+        readonly property color tableRowDarkEven: "#1c1c1c"  // Equivalent to "#a6181818" over #404040 background
+        readonly property color tableBackgroundLight: tableRowLightEven
+        readonly property color tableBackgroundDark: tableRowDarkEven
+        readonly property color tableScrollHandleLight: "#DDDDDD"
+        readonly property color tableScrollHandleDark: "#707070"
+        readonly property color tableScrollBackgroundLight: tableRowLightOdd
+        readonly property color tableScrollBackgroundDark: "#323232"
+        readonly property color checkboxLightStart: "#ffffff"
+        readonly property color checkboxLightFinish: "#afafaf"
+        readonly property color checkboxDarkStart: "#7d7d7d"
+        readonly property color checkboxDarkFinish: "#6b6a6b"
+        readonly property color checkboxChecked: primaryHighlight
+        readonly property color checkboxCheckedBorder: "#36cdff"
+        readonly property color sliderGutterLight: "#d4d4d4"
+        readonly property color sliderGutterDark: "#252525"
+        readonly property color sliderBorderLight: "#afafaf"
+        readonly property color sliderBorderDark: "#7d7d7d"
+        readonly property color sliderLightStart: "#ffffff"
+        readonly property color sliderLightFinish: "#afafaf"
+        readonly property color sliderDarkStart: "#7d7d7d"
+        readonly property color sliderDarkFinish: "#6b6a6b"
+        readonly property color dropDownPressedLight: "#d4d4d4"
+        readonly property color dropDownPressedDark: "#afafaf"
+        readonly property color dropDownLightStart: "#ffffff"
+        readonly property color dropDownLightFinish: "#afafaf"
+        readonly property color dropDownDarkStart: "#7d7d7d"
+        readonly property color dropDownDarkFinish: "#6b6a6b"
+        readonly property color textFieldLightBackground: "#d4d4d4"
+        readonly property color tabBackgroundDark: "#252525"
+        readonly property color tabBackgroundLight: "#d4d4d4"
+    }
+
+    Item {
+        id: colorSchemes
+        readonly property int light: 0
+        readonly property int dark: 1
+    }
+
+    Item {
+        id: dimensions
+        readonly property bool largeScreen: Screen.width >= 1920 && Screen.height >= 1080
+        readonly property real borderRadius: largeScreen ? 7.5 : 5.0
+        readonly property real borderWidth: largeScreen ? 2 : 1
+        readonly property vector2d contentMargin: Qt.vector2d(21, 21)
+        readonly property vector2d contentSpacing: Qt.vector2d(11, 14)
+        readonly property real labelPadding: 40
+        readonly property real textPadding: 8
+        readonly property real sliderHandleSize: 18
+        readonly property real sliderGrooveHeight: 8
+        readonly property real frameIconSize: 22
+        readonly property real spinnerSize: 50
+        readonly property real tablePadding: 12
+        readonly property real tableRowHeight: largeScreen ? 26 : 23
+        readonly property real tableHeaderHeight: 29
+        readonly property vector2d modalDialogMargin: Qt.vector2d(50, 30)
+        readonly property real modalDialogTitleHeight: 40
+        readonly property real controlLineHeight: 28  // Height of spinbox control on 1920 x 1080 monitor
+        readonly property real controlInterlineHeight: 21  // 75% of controlLineHeight
+        readonly property vector2d menuPadding: Qt.vector2d(14, 102)
+        readonly property real scrollbarBackgroundWidth: 18
+        readonly property real scrollbarHandleWidth: scrollbarBackgroundWidth - 2
+        readonly property real tabletMenuHeader: 90
+    }
+
+    Item {
+        id: fontSizes  // In pixels
+        readonly property real overlayTitle: dimensions.largeScreen ? 18 : 14
+        readonly property real tabName: dimensions.largeScreen ? 12 : 10
+        readonly property real sectionName: dimensions.largeScreen ? 12 : 10
+        readonly property real inputLabel: dimensions.largeScreen ? 14 : 10
+        readonly property real textFieldInput: dimensions.largeScreen ? 15 : 12
+        readonly property real textFieldInputLabel: dimensions.largeScreen ? 13 : 9
+        readonly property real textFieldSearchIcon: dimensions.largeScreen ? 30 : 24
+        readonly property real tableHeading: dimensions.largeScreen ? 12 : 10
+        readonly property real tableHeadingIcon: dimensions.largeScreen ? 60 : 33
+        readonly property real tableText: dimensions.largeScreen ? 15 : 12
+        readonly property real buttonLabel: dimensions.largeScreen ? 13 : 9
+        readonly property real iconButton: dimensions.largeScreen ? 13 : 9
+        readonly property real listItem: dimensions.largeScreen ? 15 : 11
+        readonly property real tabularData: dimensions.largeScreen ? 15 : 11
+        readonly property real logs: dimensions.largeScreen ? 16 : 12
+        readonly property real code: dimensions.largeScreen ? 16 : 12
+        readonly property real rootMenu: dimensions.largeScreen ? 15 : 11
+        readonly property real rootMenuDisclosure: dimensions.largeScreen ? 20 : 16
+        readonly property real menuItem: dimensions.largeScreen ? 15 : 11
+        readonly property real shortcutText: dimensions.largeScreen ? 13 : 9
+        readonly property real carat: dimensions.largeScreen ? 38 : 30
+        readonly property real disclosureButton: dimensions.largeScreen ? 30 : 22
+    }
+
+    Item {
+        id: icons
+        // Values per OffscreenUi::Icon
+        readonly property int none: 0
+        readonly property int question: 1
+        readonly property int information: 2
+        readonly property int warning: 3
+        readonly property int critical: 4
+        readonly property int placemark: 5
+    }
+
+    Item {
+        id: buttons
+        readonly property int white: 0
+        readonly property int blue: 1
+        readonly property int red: 2
+        readonly property int black: 3
+        readonly property var textColor: [ colors.darkGray, colors.white, colors.white, colors.white ]
+        readonly property var colorStart: [ colors.white, colors.primaryHighlight, "#d42043", "#343434" ]
+        readonly property var colorFinish: [ colors.lightGrayText, colors.blueAccent, "#94132e", colors.black ]
+        readonly property var hoveredColor: [ colorStart[white], colorStart[blue], colorStart[red], colorFinish[black] ]
+        readonly property var pressedColor: [ colorFinish[white], colorFinish[blue], colorFinish[red], colorStart[black] ]
+        readonly property var disabledColorStart: [ colorStart[white], colors.baseGrayHighlight]
+        readonly property var disabledColorFinish: [ colorFinish[white], colors.baseGrayShadow]
+        readonly property var disabledTextColor: [ colors.lightGrayText, colors.baseGrayShadow]
+        readonly property int radius: 5
+    }
+
+    QtObject {
+        id: effects
+        readonly property int fadeInDuration: 300
+    }
+    Item {
+        id: glyphs
+        readonly property string noIcon: ""
+        readonly property string hmd: "b"
+        readonly property string screen: "c"
+        readonly property string keyboard: "d"
+        readonly property string handControllers: "e"
+        readonly property string headphonesMic: "f"
+        readonly property string gamepad: "g"
+        readonly property string headphones: "h"
+        readonly property string mic: "i"
+        readonly property string upload: "j"
+        readonly property string script: "k"
+        readonly property string text: "l"
+        readonly property string cube: "m"
+        readonly property string sphere: "n"
+        readonly property string zone: "o"
+        readonly property string light: "p"
+        readonly property string web: "q"
+        readonly property string web2: "r"
+        readonly property string edit: "s"
+        readonly property string market: "t"
+        readonly property string directory: "u"
+        readonly property string menu: "v"
+        readonly property string close: "w"
+        readonly property string closeInverted: "x"
+        readonly property string pin: "y"
+        readonly property string pinInverted: "z"
+        readonly property string resizeHandle: "A"
+        readonly property string disclosureExpand: "B"
+        readonly property string reloadSmall: "a"
+        readonly property string closeSmall: "C"
+        readonly property string forward: "D"
+        readonly property string backward: "E"
+        readonly property string reload: "F"
+        readonly property string unmuted: "G"
+        readonly property string muted: "H"
+        readonly property string minimize: "I"
+        readonly property string maximize: "J"
+        readonly property string maximizeInverted: "K"
+        readonly property string disclosureButtonExpand: "L"
+        readonly property string disclosureButtonCollapse: "M"
+        readonly property string scriptStop: "N"
+        readonly property string scriptReload: "O"
+        readonly property string scriptRun: "P"
+        readonly property string scriptNew: "Q"
+        readonly property string hifiForum: "2"
+        readonly property string hifiLogoSmall: "S"
+        readonly property string avatar1: "T"
+        readonly property string placemark: "U"
+        readonly property string box: "V"
+        readonly property string community: "0"
+        readonly property string grabHandle: "X"
+        readonly property string search: "Y"
+        readonly property string disclosureCollapse: "Z"
+        readonly property string scriptUpload: "R"
+        readonly property string code: "W"
+        readonly property string avatar: "<"
+        readonly property string arrowsH: ":"
+        readonly property string arrowsV: ";"
+        readonly property string arrows: "`"
+        readonly property string compress: "!"
+        readonly property string expand: "\""
+        readonly property string placemark1: "#"
+        readonly property string circle: "$"
+        readonly property string handPointer: "9"
+        readonly property string plusSquareO: "%"
+        readonly property string sliders: "&"
+        readonly property string square: "'"
+        readonly property string alignCenter: "8"
+        readonly property string alignJustify: ")"
+        readonly property string alignLeft: "*"
+        readonly property string alignRight: "^"
+        readonly property string bars: "7"
+        readonly property string circleSlash: ","
+        readonly property string sync: "()"
+        readonly property string key: "-"
+        readonly property string link: "."
+        readonly property string location: "/"
+        readonly property string caratR: "3"
+        readonly property string caratL: "4"
+        readonly property string caratDn: "5"
+        readonly property string caratUp: "6"
+        readonly property string folderLg: ">"
+        readonly property string folderSm: "?"
+        readonly property string levelUp: "1"
+        readonly property string info: "["
+        readonly property string question: "]"
+        readonly property string alert: "+"
+        readonly property string home: "_"
+        readonly property string error: "="
+        readonly property string settings: "@"
+        readonly property string trash: "{"
+        readonly property string objectGroup: "\ue000"
+        readonly property string cm: "}"
+        readonly property string msvg79: "~"
+        readonly property string deg: "\\"
+        readonly property string px: "|"
+        readonly property string editPencil: "\ue00d"
+        readonly property string vol_0: "\ue00e"
+        readonly property string vol_1: "\ue00f"
+        readonly property string vol_2: "\ue010"
+        readonly property string vol_3: "\ue011"
+        readonly property string vol_4: "\ue012"
+        readonly property string vol_x_0: "\ue013"
+        readonly property string vol_x_1: "\ue014"
+        readonly property string vol_x_2: "\ue015"
+        readonly property string vol_x_3: "\ue016"
+        readonly property string vol_x_4: "\ue017"
+        readonly property string source: "\ue01c"
+        readonly property string playback_play: "\ue01d"
+        readonly property string stop_square: "\ue01e"
+        readonly property string avatarTPose: "\ue01f"
+        readonly property string lock: "\ue006"
+    }
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/HifiConstants.qmlc b/scripts/developer/utilities/lib/styles-uit/HifiConstants.qmlc
new file mode 100644
index 0000000000000000000000000000000000000000..a11d8cf029dcb2a16ad80b66aa3ac76475f0233e
GIT binary patch
literal 51304
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

literal 0
HcmV?d00001

diff --git a/scripts/developer/utilities/lib/styles-uit/IconButton.qml b/scripts/developer/utilities/lib/styles-uit/IconButton.qml
new file mode 100644
index 0000000000..84c1ef14c1
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/IconButton.qml
@@ -0,0 +1,20 @@
+//
+//  IconButton.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayRegular {
+    font.pixelSize: hifi.fontSizes.iconButton
+    font.capitalization: Font.AllUppercase
+    font.letterSpacing: 1.5
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/InfoItem.qml b/scripts/developer/utilities/lib/styles-uit/InfoItem.qml
new file mode 100644
index 0000000000..83781a4ef5
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/InfoItem.qml
@@ -0,0 +1,19 @@
+//
+//  InfoItem.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewaySemiBold {
+    lineHeight: 2
+    font.pixelSize: hifi.fontSizes.menuItem
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/InputLabel.qml b/scripts/developer/utilities/lib/styles-uit/InputLabel.qml
new file mode 100644
index 0000000000..59657a554d
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/InputLabel.qml
@@ -0,0 +1,18 @@
+//
+//  InputLabel.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewaySemiBold {
+    font.pixelSize: hifi.fontSizes.inputLabel
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/ListItem.qml b/scripts/developer/utilities/lib/styles-uit/ListItem.qml
new file mode 100644
index 0000000000..f707686edc
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/ListItem.qml
@@ -0,0 +1,18 @@
+//
+//  ListItem.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayRegular {
+    font.pixelSize: hifi.fontSizes.listItem
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/Logs.qml b/scripts/developer/utilities/lib/styles-uit/Logs.qml
new file mode 100644
index 0000000000..577fe2f8d8
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/Logs.qml
@@ -0,0 +1,18 @@
+//
+//  Logs.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+AnonymousProRegular {
+    font.pixelSize: hifi.fontSizes.logs
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/OverlayTitle.qml b/scripts/developer/utilities/lib/styles-uit/OverlayTitle.qml
new file mode 100644
index 0000000000..e23b9eca14
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/OverlayTitle.qml
@@ -0,0 +1,18 @@
+//
+//  OverlayTitle.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayRegular {
+    font.pixelSize: hifi.fontSizes.overlayTitle
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/RalewayBold.qml b/scripts/developer/utilities/lib/styles-uit/RalewayBold.qml
new file mode 100644
index 0000000000..433fdb7ae6
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/RalewayBold.qml
@@ -0,0 +1,24 @@
+//
+//  RalewayBold.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: ralewayBold; source: pathToFonts + "fonts/Raleway-Bold.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: ralewayBold.name
+    font.bold: true  // Font seems to need this in order to display bold.
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/RalewayLight.qml b/scripts/developer/utilities/lib/styles-uit/RalewayLight.qml
new file mode 100644
index 0000000000..913918afd7
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/RalewayLight.qml
@@ -0,0 +1,23 @@
+//
+//  RalewayLight.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: ralewayLight; source: "../../fonts/Raleway-Light.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: ralewayLight.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/RalewayRegular.qml b/scripts/developer/utilities/lib/styles-uit/RalewayRegular.qml
new file mode 100644
index 0000000000..2cffeeb59d
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/RalewayRegular.qml
@@ -0,0 +1,23 @@
+//
+//  RalewayRegular.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: ralewayRegular; source: pathToFonts + "fonts/Raleway-Regular.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: ralewayRegular.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/RalewaySemiBold.qml b/scripts/developer/utilities/lib/styles-uit/RalewaySemiBold.qml
new file mode 100644
index 0000000000..b6c79e02a4
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/RalewaySemiBold.qml
@@ -0,0 +1,23 @@
+//
+//  RalewaySemiBold.qml
+//
+//  Created by David Rowe on 12 Feb 2016
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+
+Text {
+    id: root
+    FontLoader { id: ralewaySemiBold; source: pathToFonts + "fonts/Raleway-SemiBold.ttf"; }
+    property real size: 32
+    font.pixelSize: size
+    verticalAlignment: Text.AlignVCenter
+    horizontalAlignment: Text.AlignLeft
+    font.family: ralewaySemiBold.name
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/SectionName.qml b/scripts/developer/utilities/lib/styles-uit/SectionName.qml
new file mode 100644
index 0000000000..5438fec7bc
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/SectionName.qml
@@ -0,0 +1,19 @@
+//
+//  SectionName.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayRegular {
+    font.pixelSize: hifi.fontSizes.sectionName
+    font.capitalization: Font.AllUppercase
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/Separator.qml b/scripts/developer/utilities/lib/styles-uit/Separator.qml
new file mode 100644
index 0000000000..4134b928a7
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/Separator.qml
@@ -0,0 +1,41 @@
+//
+//  Separator.qml
+//
+//  Created by Zach Fox on 2017-06-06
+//  Copyright 2017 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import "../styles-uit"
+
+Item {
+    // Size
+    height: 2;
+    width: parent.width;
+
+    Rectangle {
+        // Size
+        width: parent.width;
+        height: 1;
+        // Anchors
+        anchors.left: parent.left;
+        anchors.bottom: parent.bottom;
+        anchors.bottomMargin: height;
+        // Style
+        color: hifi.colors.baseGrayShadow;
+    }
+
+    Rectangle {
+        // Size
+        width: parent.width;
+        height: 1;
+        // Anchors
+        anchors.left: parent.left;
+        anchors.bottom: parent.bottom;
+        // Style
+        color: hifi.colors.baseGrayHighlight;
+    }
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/ShortcutText.qml b/scripts/developer/utilities/lib/styles-uit/ShortcutText.qml
new file mode 100644
index 0000000000..a3ab351870
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/ShortcutText.qml
@@ -0,0 +1,18 @@
+//
+//  ShortcutText.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayLight {
+    font.pixelSize: hifi.fontSizes.shortcutText
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/TabName.qml b/scripts/developer/utilities/lib/styles-uit/TabName.qml
new file mode 100644
index 0000000000..eb4e790e7e
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/TabName.qml
@@ -0,0 +1,19 @@
+//
+//  TabName.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+RalewayRegular {
+    font.pixelSize: hifi.fontSizes.tabName
+    font.capitalization: Font.AllUppercase
+}
diff --git a/scripts/developer/utilities/lib/styles-uit/TextFieldInput.qml b/scripts/developer/utilities/lib/styles-uit/TextFieldInput.qml
new file mode 100644
index 0000000000..010b4d03ad
--- /dev/null
+++ b/scripts/developer/utilities/lib/styles-uit/TextFieldInput.qml
@@ -0,0 +1,18 @@
+//
+//  TextFieldInput.qml
+//
+//  Created by Clement on 7/18/16
+//  Copyright 2016 High Fidelity, Inc.
+//
+//  Distributed under the Apache License, Version 2.0.
+//  See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
+//
+
+import QtQuick 2.5
+import QtQuick.Controls 1.4
+import QtQuick.Controls.Styles 1.4
+import "."
+
+FiraSansSemiBold {
+    font.pixelSize: hifi.fontSizes.textFieldInput
+}