Date input magic

by lucaslimax

HTML

<div class="wrapper">
	<input class="date" type="date">
	<input class="picker" type="date">
</div>

CSS

.wrapper {
	position: relative;
	width: 146px;
	height: 24px;
	margin: 20px;
	overflow: hidden;
}
.date {
	border: 0;
	width: 146px;
	height: 24px;
	line-height: 24px;
	position: absolute;
	top: 0;
	left: 0;
	background: #fff;
	border: 1px solid #999;
	box-sizing: border-box;
}
.picker {
	width: 200px;
	height: 24px;
	font-size: 999px;
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0;
}

JavaScript

/* $(".picker").on("change", function() {
  var date = $(this).val();
  $(".date").val(date);
}) */