-body {
+html, body {
+ padding: 0;
+ margin: 0;
font-family: sans-serif;
font-size: 16px;
}
div.nanotouch {
border: 1px dashed #333;
+ box-sizing: border-box;
padding: 1.5rem;
position: relative;
- width: 7vw;
- height: 7vw;
+ width: 10vw;
+ height: 10vw;
margin: 1vw;
display: inline-block;
overflow: hidden;
background: #6aff6a;
}
-div.nanotouch input {
+div.nanotouch input[type=file] {
position: absolute;
top: 0;
left: 0;
cursor: pointer;
}
+div.nanotouch input[type=range] {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ padding: 0;
+ margin: 0;
+}
+
div.nanotouch span.name {
position: absolute;
}
div.nanotouch span.duration {
position: absolute;
- bottom: 1ex;
+ bottom: 2ex;
right: 1ex;
}