ami.js
Version:
<p align="center"> <img src="https://cloud.githubusercontent.com/assets/214063/23213764/78ade038-f90c-11e6-8208-4fcade5f3832.png" width="60%"> </p>
152 lines (127 loc) • 2.05 kB
CSS
*{
font-family: 'Roboto', sans-serif;
outline: none;
}
#viewer, #r3d, #orientation {
background-color: #212121;
left: 0;
right: 0;
top: 0;
bottom: 0;
position: absolute;
width: 100%;
height: 100%;
overflow:hidden;
}
#orientation {
display: flex;
align-items: center;
justify-content: center;
}
.direction {
z-index: 1;
color: #fff;
text-transform: uppercase;
font-size: 16px;
position: absolute;
margin: 14px;
padding: 4px;
border-radius: 50%;
width: 18px;
height: 18px;
text-align: center;
background-color: rgba(0, 0, 0, .3);
}
#top {
top: 24px;
}
#bottom {
bottom: 0;
}
#left {
left: 0;
}
#right {
right: 0;
}
#my-gui-container {
position: fixed;
top: 30px;
right: 20px;
z-index:1;
}
#my-lut-container {
position: fixed;
left: 50%;
transform: translate(-50%, 0);
z-index: 1;
color: #F9F9F9;
display: flex;
}
#my-lut-container > #my-lut-canvases {
position: relative;
}
#my-lut-min {
margin-right: 10px;
}
#my-lut-max {
margin-left: 10px;
}
#my-lut-container > #my-lut-canvases > :first-child {
background: repeating-linear-gradient(-45deg, #353535, #353535 5px, black 5px, black 10px);
}
#my-lut-container > #my-lut-canvases > :nth-child(2) {
position: absolute;
top: 0;
left: 0;
}
#home-container{
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: #212121;
z-index: 99;
align-items: center;
display: flex;
flex-direction: column;
}
.big{
font-size:60px;
}
.medium{
font-size:40px;
}
.small{
font-size:30px;
}
.small{
font-size:20px;
}
#buttons{
flex: 1;
align-items: center;
display: flex;
flex-direction: column;
justify-content:center;
}
#filesinput{
display:none;
}
#buttoninput{
padding: 10px;
border: 6px solid #2196F3;
background-color: #2196F3;
color: #F9F9F9;
border-radius: 50%;
height: 200px;
width: 200px;
font-size:30px;
}
#buttoninput:hover{
/*border-style: dashed;*/
background-color: #F9F9F9;
color: #2196F3;
cursor:pointer;
}