Merge pull request #193 from AleziaKurdis/kasen/core

Create app: Properties editor: tabs
This commit is contained in:
kasenvr 2020-05-07 15:46:45 -04:00 committed by GitHub
commit fa6d40f81c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
31 changed files with 675 additions and 312 deletions

View file

@ -1,52 +1,63 @@
<!--
//
// entityProperties.html
//
// Created by Ryan Huffman on 13 Nov 2014
// Copyright 2014 High Fidelity, Inc.
// Copyright 2020 Project Athena contributors.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
//
-->
<html>
<head>
<title>Properties</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" type="text/css" href="../../../html/css/edit-style.css">
<link rel="stylesheet" type="text/css" href="../../../html/css/colpick.css">
<link rel="stylesheet" type="text/css" href="../../../html/css/jsoneditor.css">
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
<script src="../../../html/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="../../../html/js/colpick.js"></script>
<script type="text/javascript" src="../../../html/js/jsoneditor.min.js"></script>
<script type="text/javascript" src="../../../html/js/eventBridgeLoader.js"></script>
<script type="text/javascript" src="../../../html/js/spinButtons.js"></script>
<script type="text/javascript" src="../../../html/js/utils.js"></script>
<script type="text/javascript" src="../../../html/js/includes.js"></script>
<script type="text/javascript" src="js/underscore-min.js"></script>
<script type="text/javascript" src="js/createAppTooltip.js"></script>
<script type="text/javascript" src="js/draggableNumber.js"></script>
<script type="text/javascript" src="js/entityProperties.js"></script>
</head>
<body onload='loaded();'>
<div id="properties-list">
<div class='property container'>
<label id='placeholder-property-type'></label>
<div class='value'>
<div class='row flex-center' style='padding-bottom: 8px;'>
<div id="placeholder-property-name" class="stretch"></div>
<div id="placeholder-property-locked" class="shrink"></div>
<div id="placeholder-property-visible" class="shrink"></div>
</div>
<div class='row'>
<div id="placeholder-property-id" class="stretch"></div>
<head>
<title>Properties</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<link rel="stylesheet" type="text/css" href="../../../html/css/edit-style.css">
<link rel="stylesheet" type="text/css" href="../../../html/css/colpick.css">
<link rel="stylesheet" type="text/css" href="../../../html/css/jsoneditor.css">
<link rel="stylesheet" type="text/css" href="../../../html/css/tabs.css">
<script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
<script src="../../../html/js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="../../../html/js/colpick.js"></script>
<script type="text/javascript" src="../../../html/js/jsoneditor.min.js"></script>
<script type="text/javascript" src="../../../html/js/eventBridgeLoader.js"></script>
<script type="text/javascript" src="../../../html/js/spinButtons.js"></script>
<script type="text/javascript" src="../../../html/js/utils.js"></script>
<script type="text/javascript" src="../../../html/js/includes.js"></script>
<script type="text/javascript" src="js/underscore-min.js"></script>
<script type="text/javascript" src="js/createAppTooltip.js"></script>
<script type="text/javascript" src="js/draggableNumber.js"></script>
<script type="text/javascript" src="js/entityProperties.js"></script>
</head>
<body onload='loaded();'>
<div id="properties-list">
<div class='property container'>
<label id='placeholder-property-type'></label>
<div class='value'>
<div class='row flex-center' style='padding-bottom: 8px;'>
<div id="placeholder-property-name" class="stretch"></div>
<div id="placeholder-property-locked" class="shrink"></div>
<div id="placeholder-property-visible" class="shrink"></div>
</div>
<div class='row'>
<div id="placeholder-property-id" class="stretch"></div>
</div>
</div>
</div>
<table class="tabsTableFrame">
<tr class="tabsTrFrame">
<td class = "tabsFrame">
<div id="tabs" class="tabsContainer"></div>
</td>
<td class="tabsPropertiesFrame">
<div class="tabsPropertiesPage" id="properties-pages">
<!-- each property is added at runtime in entityProperties -->
</div>
</td>
</tr>
</table>
</div>
<!-- each property is added at runtime in entityProperties -->
</div>
</body>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 669 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 693 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 711 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 707 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 811 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 445 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 902 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 770 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 891 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 650 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 915 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 757 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 719 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 755 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 815 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 692 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 567 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 835 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 552 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 784 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 767 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 594 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 947 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 921 B

View file

@ -0,0 +1,77 @@
/*
// tabs.css
//
// Created by Alezia Kurdis on 27 Feb 2020
// Copyright 2020 Project Athena contributors.
//
// Distributed under the Apache License, Version 2.0.
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
*/
div.tabsContainer {
float: left;
width: 32px;
padding: 0px;
}
.tabsContainer button {
padding: 4px;
text-align: center;
cursor: pointer;
transition: 0.4s;
font-size: 14px;
background-color: #404040;
border-color: #404040;
border-width: 1px 0px 1px 1px;
border-radius: 5px 0px 0px 5px;
outline: none;
}
.tabsContainer button:hover {
background-color: #575757;
}
.tabsContainer button.active {
background-color: #2E2E2E;
}
div.labelTabHeader {
font-size: 20px;
font-weight: 700;
height: 40px;
color: #ffffff;
}
div.tab-section-header {
width: 100%;
padding: 5px;
}
table.tabsTableFrame {
width: 100%;
min-height: 352px;
display: block;
}
tr.tabsTrFrame {
width: 100%;
}
td.tabsFrame {
width: 32px;
vertical-align: top;
background-color: #575757;
padding: 0px;
border: 0px;
}
td.tabsPropertiesFrame {
width: 100%;
vertical-align: top;
border:0px;
}
div.tabsPropertiesPage {
min-height: 352px;
display: block;
}