Mirrors/overte
3
0
Fork 0
mirror of https://github.com/overte-org/overte.git synced 2025-08-09 14:29:03 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Fix styling of properties window when narrow

Browse source
This commit is contained in:
Ryan Huffman 2018-11-19 13:50:56 -08:00
parent 556aec9412
commit 193b9752b8
2 changed files with 16 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
scripts/system/html/css/edit-style.css
View file

@ -590,9 +590,6 @@ div.section[collapsed="true"], div.section[collapsed="true"] > .section-header {
background-color: #373737; background-color: #373737;
} }
.section-header {
cursor: pointer;
}
.section-header span { .section-header span {
font-size: 30px; font-size: 30px;
@ -948,12 +945,12 @@ div.refresh input[type="button"] {
} }
.draggable-number.left-arrow { .draggable-number.left-arrow {
top: -5px; top: -5px;
right: 106px; left: 0px;
transform: rotate(180deg); transform: rotate(180deg);
} }
.draggable-number.right-arrow { .draggable-number.right-arrow {
top: -5px; top: -5px;
left: 106px; right: 0px;
} }
.draggable-number input[type=number] { .draggable-number input[type=number] {
position: absolute; position: absolute;
@ -1123,7 +1120,7 @@ textarea:enabled[scrolling="true"]::-webkit-resizer {
} }
body#entity-list-body { div#grid-section, body#entity-list-body {
padding-bottom: 0; padding-bottom: 0;
margin: 16px; margin: 16px;
} }
@ -1552,7 +1549,6 @@ input.rename-entity {
.container { .container {
display: flex; display: flex;
flex-flow: row nowrap; flex-flow: row nowrap;
justify-content: space-around;
margin-bottom: 8px; margin-bottom: 8px;
min-height: 28px; min-height: 28px;
} }
@ -1602,6 +1598,8 @@ input.rename-entity {
.xyz.fstuple, .pyr.fstuple { .xyz.fstuple, .pyr.fstuple {
position: relative; position: relative;
left: -12px; left: -12px;
min-width: 50px;
width: 100px;
} }
.rgb.fstuple .tuple { .rgb.fstuple .tuple {
@ -1660,3 +1658,7 @@ input.number-slider {
#placeholder-property-type { #placeholder-property-type {
min-width: 0px; min-width: 0px;
} }
.collapse-icon {
cursor: pointer;
}

11
scripts/system/html/js/entityProperties.js
View file

@ -1158,18 +1158,21 @@ const GROUPS = [
label: "Link", label: "Link",
type: "string", type: "string",
propertyID: "href", propertyID: "href",
placeholder: "URL",
}, },
{ {
label: "Script", label: "Script",
type: "string", type: "string",
buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadScripts } ], buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadScripts } ],
propertyID: "script", propertyID: "script",
placeholder: "URL",
}, },
{ {
label: "Server Script", label: "Server Script",
type: "string", type: "string",
buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadServerScripts } ], buttons: [ { id: "reload", label: "F", className: "glyph", onClick: reloadServerScripts } ],
propertyID: "serverScripts", propertyID: "serverScripts",
placeholder: "URL",
}, },
{ {
label: "Server Script Status", label: "Server Script Status",
@ -2771,7 +2774,7 @@ function loaded() {
elLegend.appendChild(createElementFromHTML(`<div class="label">${group.label}</div>`)); elLegend.appendChild(createElementFromHTML(`<div class="label">${group.label}</div>`));
let elSpan = document.createElement('span'); let elSpan = document.createElement('span');
elSpan.className = ".collapse-icon"; elSpan.className = "collapse-icon";
elSpan.innerText = "M"; elSpan.innerText = "M";
elLegend.appendChild(elSpan); elLegend.appendChild(elSpan);
elGroup.appendChild(elLegend); elGroup.appendChild(elLegend);
@ -3311,14 +3314,14 @@ function loaded() {
getPropertyInputElement("image").addEventListener('change', createImageURLUpdateFunction('textures', false)); getPropertyInputElement("image").addEventListener('change', createImageURLUpdateFunction('textures', false));
// Collapsible sections // Collapsible sections
let elCollapsible = document.getElementsByClassName("section-header"); let elCollapsible = document.getElementsByClassName("collapse-icon");
let toggleCollapsedEvent = function(event) { let toggleCollapsedEvent = function(event) {
let element = this.parentNode; let element = this.parentNode.parentNode;
let isCollapsed = element.dataset.collapsed !== "true"; let isCollapsed = element.dataset.collapsed !== "true";
element.dataset.collapsed = isCollapsed ? "true" : false; element.dataset.collapsed = isCollapsed ? "true" : false;
element.setAttribute("collapsed", isCollapsed ? "true" : "false"); element.setAttribute("collapsed", isCollapsed ? "true" : "false");
element.getElementsByClassName(".collapse-icon")[0].textContent = isCollapsed ? "L" : "M"; this.textContent = isCollapsed ? "L" : "M";
}; };
for (let collapseIndex = 0, numCollapsibles = elCollapsible.length; collapseIndex < numCollapsibles; ++collapseIndex) { for (let collapseIndex = 0, numCollapsibles = elCollapsible.length; collapseIndex < numCollapsibles; ++collapseIndex) {