mirror of
https://github.com/overte-org/overte.git
synced 2025-04-18 00:26:33 +02:00
Base UI elements
This commit is contained in:
parent
94041291d5
commit
aca343330f
5 changed files with 136 additions and 24 deletions
|
@ -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",
|
||||
|
|
102
scripts/system/html/css/miniTablet.css
Normal file
102
scripts/system/html/css/miniTablet.css
Normal file
|
@ -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;
|
||||
}
|
31
scripts/system/html/miniTablet.html
Normal file
31
scripts/system/html/miniTablet.html
Normal file
|
@ -0,0 +1,31 @@
|
|||
<!--
|
||||
miniTablet.html
|
||||
|
||||
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
|
||||
-->
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="stylesheet" type="text/css" href="css/miniTablet.css" />
|
||||
</head>
|
||||
<body>
|
||||
<section>
|
||||
<div id="mute" class="button off">
|
||||
<img id="mute-img" />
|
||||
</div>
|
||||
<div id="bubble" class="button off">
|
||||
<img id="bubble-img" />
|
||||
</div>
|
||||
</section>
|
||||
<footer>
|
||||
<div id="expand" class="button"><p>...</p></div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
|
@ -1,21 +0,0 @@
|
|||
<!--
|
||||
tabletRezzer.html
|
||||
|
||||
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
|
||||
-->
|
||||
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title></title>
|
||||
</head>
|
||||
<body>
|
||||
Hello world!
|
||||
</body>
|
||||
</html>
|
|
@ -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,
|
Loading…
Reference in a new issue