-
Notifications
You must be signed in to change notification settings - Fork 2
/
manifest-gui.css
51 lines (47 loc) · 2.88 KB
/
manifest-gui.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
html{background-image: radial-gradient(#000000,#101010);background-color: #101010;/* height: 100vh; */}
body{margin:0;color:#fff;font-family:"Proxima Nova",sans-serif;background-image:url(./grid-25.png);height: calc(100vh - 24px);}
controls button{background:#101010}
header{margin:24px;opacity:.75;user-select:none;white-space:nowrap;mask-image:linear-gradient(90deg,#000,transparent)}
header:hover{opacity:1}
header #uos-logo-container{padding-right:12px}
header>*{display:inline-block;vertical-align:middle}
header h1{margin:0;font-weight:400;font-size:24px}
header #uos-logo{height:36px}
header #uos-logo path{fill:#fff}
#manifest-gui{user-select:none;background-image: linear-gradient(0deg,#101010,#202020);margin-top:16px;border-radius:4px;margin:0 auto;box-shadow:0 24px 48px #000000;overflow:hidden;opacity:.75;transition:.25s opacity cubic-bezier(0,1,1,1);opacity:0}
#manifest-gui.rendered{opacity:0.75}
#manifest-gui:hover{opacity:1}
.table-data-header{text-align:right;color:grey;text-transform:capitalize;text-rendering:geometricPrecision;/* padding-left:8px; */}
/* #manifest-gui .table-data-header>div{opacity:0;width:0;transition:1s width ease;overflow: hidden;} */
/* #manifest-gui:hover .table-data-header>div{opacity:1;width:100px} */
.table-data-header>div{padding:8px 16px}
.table-data-value{user-select:text}
.table-data-value>div{padding:8px 16px;border-bottom-left-radius:4px;border-left:1px solid #303030;border-bottom:1px solid #303030;/* font-weight: bold; */}
#manifest-gui>tr>td>*{vertical-align:middle;margin:8px}
#controls{position:fixed;right:24px;top:24px}
button{appearance:none;background:0 0;color:#fff;font-size:16px;border:none;/* background-color: transparent; */padding:8px 16px;border-radius:4px;opacity:.75;font-family:"Proxima Nova",sans-serif;}
button:hover{background-color:#404040;cursor:pointer;opacity:1}
button:active{background-color:#606060}
#manifest-gui thead td{border-bottom:1px solid #303030;/* text-align: end; */}
#manifest-gui thead td:last-of-type{text-align:right;padding: 8px 16px;color:#808080}
#viewport{width: 100%;display: table;height: calc(100vh - ( ( 36px + 8px ) * 2 ) * 2);/* border-collapse: collapse; */}
#viewport-cell{height: 100%;display: table-cell;vertical-align: middle;/* width: 100%; */}
#manifest-gui tfoot tr td button {
width: calc(50% - 4px);
display: inline-block;
font-weight:900;
margin: 0 2px;
}
button#remove::before{content:"−";}
button#remove:hover::before{content:"Remove"}
button#remove{color: #f00;}
button#remove:hover{background-color: #ff000010;}
button#remove:active{background-color: #ff000020;}
button#remove:active::before{content:"−−−−−−";}
button#add::before{content:"+"}
button#add:hover::before{content:"Add"}
button#add{color: #0f0;}
button#add:hover{background-color: #00ff0010;}
button#add:active{background-color: #00ff0020;}
button#add:active::before{content:"+++"}
#manifest-gui pre{margin: 0 0 16px;}