static/css/common/invisible-upload.less (50 lines of code) (raw):
@import '../impala/lib';
/* Invisible file inputs */
.invisible-upload {
cursor: pointer;
display: inline-block;
overflow: hidden;
position: relative;
input {
display: block;
cursor: pointer;
// Fixed size seems to avoid thiny height issue in Nightly.
height: 80px;
opacity: 0;
outline: none;
position: absolute;
left: 0;
bottom: 0;
width: auto;
z-index: 0;
}
&:hover {
input {
/* Large target fix so the input is always clickable. */
font-size: 1000px;
}
}
a.button {
display: inline-block;
position: relative;
}
a.link {
color: #05e;
text-decoration: none;
}
&:hover, &:focus {
a.button {
border-color: #25f;
box-shadow: inset 0 0 2px #fff;
}
a.link {
text-decoration: underline;
}
}
&.legacy {
input {
opacity: 1;
position: static;
}
a.button {
display: none;
}
}
}