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

Restyle top row of buttons in Entity List tab

Browse source
This commit is contained in:
David Rowe 2016-03-23 10:05:22 +13:00
parent 53b86a0b55
commit b5d71d1ee1
2 changed files with 66 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

75
examples/html/edit-style.css
View file

@ -8,6 +8,18 @@
// See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html // See the accompanying file LICENSE or http://www.apache.org/licenses/LICENSE-2.0.html
*/ */
@font-face {
font-family: Raleway-Bold;
src: url(../../resources/fonts/Raleway-Bold.ttf), /* Production */
url(../../interface/resources/fonts/Raleway-Bold.ttf); /* Development */
}
@font-face {
font-family: HiFi-Glyphs;
src: url(../../resources/fonts/hifi-glyphs.ttf),
url(../../interface/resources/fonts/hifi-glyphs.ttf);
}
* { * {
} }
@ -28,6 +40,7 @@ body {
user-select: none; user-select: none;
} }
.selectable { .selectable {
-webkit-touch-callout: text; -webkit-touch-callout: text;
-webkit-user-select: text; -webkit-user-select: text;
@ -98,20 +111,61 @@ body {
} }
input[type=button] { input[type=button] {
cursor: pointer; font-family: Raleway-Bold;
background-color: #608e96; font-size: 13px;
border-color: #608e96; vertical-align: top;
border-radius: 3.75pt; height: 28px;
padding: 3.75pt 7.5pt; min-width: 120px;
border: 0; padding: 0px 12px;
margin-right: 8px;
border-radius: 5px;
border: none;
color: #fff; color: #fff;
font-weight: bold; background-color: #000;
background: linear-gradient(#343434, #000);
cursor: pointer;
} }
#entity-list-header { input[type=button].glyph {
padding: 0.5em; font-family: HiFi-Glyphs;
font-size: 20px;
min-width: 34px;
padding: 0;
} }
input[type=button].red {
color: #fff;
background-color: #94132e;
background: linear-gradient(#d42043, #94132e);
}
input[type=button]:hover {
background: linear-gradient(#000, #000);
border: none;
}
input[type=button].red:hover {
background: linear-gradient(#d42043, #d42043);
border: none;
}
input[type=button]:active {
background: linear-gradient(#343434, #343434);
}
input[type=button].red:active {
background: linear-gradient(#94132e, #94132e);
}
#delete {
float: right;
margin-right: 0;
background-color: #ff0000;
}
#search-area { #search-area {
padding: 0.5em; padding: 0.5em;
box-sizing: border-box; box-sizing: border-box;
@ -259,9 +313,6 @@ div.input-area {
font-size: 9pt; font-size: 9pt;
} }
input {
}
#type, #id { #type, #id {
font-size: 9.0pt; font-size: 9.0pt;
} }

6
examples/html/entityList.html
View file

@ -262,9 +262,9 @@
</head> </head>
<body onload='loaded();'> <body onload='loaded();'>
<div id="entity-list-header"> <div id="entity-list-header">
<input type="button" id="refresh" value="Refresh" /> <input type="button" class="glyph" id="refresh" value="F" />
<input type="button" id="teleport" value="Teleport" /> <input type="button" id="teleport" value="JUMP TO SELECTION" />
<input type="button" id="delete" style="background-color: rgb(244, 64, 64); float: right" value="Delete" /> <input type="button" class="red" id="delete" value="DELETE" />
</div> </div>
<div id="entity-list"> <div id="entity-list">