From aca343330fb203d861a30e8b5c1a943df58b3dd4 Mon Sep 17 00:00:00 2001 From: David Rowe Date: Mon, 20 Aug 2018 16:00:02 +1200 Subject: [PATCH] Base UI elements --- scripts/defaultScripts.js | 2 +- scripts/system/html/css/miniTablet.css | 102 ++++++++++++++++++ scripts/system/html/miniTablet.html | 31 ++++++ scripts/system/html/tabletRezzer.html | 21 ---- .../system/{tabletRezzer.js => miniTablet.js} | 4 +- 5 files changed, 136 insertions(+), 24 deletions(-) create mode 100644 scripts/system/html/css/miniTablet.css create mode 100644 scripts/system/html/miniTablet.html delete mode 100644 scripts/system/html/tabletRezzer.html rename scripts/system/{tabletRezzer.js => miniTablet.js} (99%) diff --git a/scripts/defaultScripts.js b/scripts/defaultScripts.js index 0e6aa08ba6..2aee26f71e 100644 --- a/scripts/defaultScripts.js +++ b/scripts/defaultScripts.js @@ -32,7 +32,7 @@ var DEFAULT_SCRIPTS_COMBINED = [ "system/firstPersonHMD.js", "system/tablet-ui/tabletUI.js", "system/emote.js", - "system/tabletRezzer.js" + "system/miniTablet.js" ]; var DEFAULT_SCRIPTS_SEPARATE = [ "system/controllers/controllerScripts.js", diff --git a/scripts/system/html/css/miniTablet.css b/scripts/system/html/css/miniTablet.css new file mode 100644 index 0000000000..d0585e489a --- /dev/null +++ b/scripts/system/html/css/miniTablet.css @@ -0,0 +1,102 @@ +/* +miniTablet.css + +Created by David Rowe on 20 Aug 2018. +Copyright 2018 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 +*/ + +* { + box-sizing: border-box; + padding: 0; + margin: 0; + user-select: none; +} + +html { + background-color: #121212; +} + +body { + height: 100%; +} + +section { + background-color: #404040; + position: relative; + padding: 15px; +} + +section .button { + width: 100%; + height: 88px; + background-color: #252525; + margin-top: 10px; + text-align: center; + border-radius: 8px; +} + + section .button.off { + border: 2px solid #6a6a6a; + background-color: #303030; + } + + section .button.off:hover { + border: 2px solid #1fc6a6; + } + + section .button.on { + border: 2px solid #1fc6a6; + background-color: #1fc6a6; + } + + section .button.on:hover { + border: 2px solid #e3e3e3; + } + + section .button:first-child { + margin-top: 0; + } + +img { + width: 60px; +} + +#mute { + padding-top: 12px; +} + +#bubble { + padding-top: 14px; +} + +footer { + position: absolute; + bottom: 0; + width: 100%; + height: 30px; + text-align: center; + color: #e3e3e3; + font-weight: bold; +} + + footer div { + display: inline-block; + height: 12px; + width: 24px; + position: relative; + top: 16px; + } + + footer div p { + position: relative; + top: -8px; + } + + footer .button:hover { + border: 1px solid #1fc6a6; + border-radius: 2px; + margin: -1px; + } \ No newline at end of file diff --git a/scripts/system/html/miniTablet.html b/scripts/system/html/miniTablet.html new file mode 100644 index 0000000000..f8216e5515 --- /dev/null +++ b/scripts/system/html/miniTablet.html @@ -0,0 +1,31 @@ + + + + + + + + + + +
+
+ +
+
+ +
+
+ + + diff --git a/scripts/system/html/tabletRezzer.html b/scripts/system/html/tabletRezzer.html deleted file mode 100644 index 6a0e0d0448..0000000000 --- a/scripts/system/html/tabletRezzer.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - - - - Hello world! - - diff --git a/scripts/system/tabletRezzer.js b/scripts/system/miniTablet.js similarity index 99% rename from scripts/system/tabletRezzer.js rename to scripts/system/miniTablet.js index fe4bc6477b..aa8b96665b 100644 --- a/scripts/system/tabletRezzer.js +++ b/scripts/system/miniTablet.js @@ -1,5 +1,5 @@ // -// tabletRezzer.js +// miniTablet.js // // Created by David Rowe on 9 Aug 2018. // Copyright 2018 High Fidelity, Inc. @@ -41,7 +41,7 @@ // UI overlay. proxyUIOverlay = null, - PROXY_UI_HTML = Script.resolvePath("./html/tabletRezzer.html"), + PROXY_UI_HTML = Script.resolvePath("./html/miniTablet.html"), PROXY_UI_DIMENSIONS = { x: 0.0577, y: 0.0905 }, PROXY_UI_WIDTH_PIXELS = 150, METERS_TO_INCHES = 39.3701,