aiexperiments-ai-duet/static/style/main.css

58 lines
942 B
CSS
Raw Normal View History

2016-11-11 18:52:19 +00:00
$keyboardHeight : 100px;
$bottomHeight : 30px;
body, #container{
width: 100%;
height: 100%;
position: absolute;
top: 0px;
left: 0px;
margin: 0px;
background-color: black;
#keyboard {
position: absolute;
bottom: $bottomHeight;
left: 0px;
height: $keyboardHeight;
}
#roll {
width : 100%;
height: calc(100% - #{$keyboardHeight + $bottomHeight});
position: absolute;
top: 0px;
left: 0px;
}
#glow {
width : 100%;
height: calc(100% - #{$keyboardHeight + $bottomHeight});
position: absolute;
top: 0px;
left: 0px;
}
#bottom {
width: 100%;
height: $bottomHeight;
bottom: 0px;
left: 0px;
position: absolute;
background-color: rgb(34, 34, 34);
box-shadow: inset 0px 12px 30px -5px rgba(0,0,0,0.75);
}
}
#container {
opacity: 0.4;
filter: blur(4px);
$transitionTime : 0.2s;
transition: filter $transitionTime, opacity $transitionTime;
&.focus {
filter: blur(0px);
opacity: 1;
}
}