WALLET PANEL SCHEMA

by Outrora

HTML

<div class="parent">
<div class="panel-left">

</div>
<div class="panel-right">

</div>
</div>

CSS

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
.parent {
	height: 200px;
	width: 100%;
	background: lightblue;
	display: flex;
	flex-flow: nowrap;
}

[class*="panel"] {
	display: inline-block;
	width: 50%;
	height: 100%;
}
.panel-right {
	background: lightgreen;
	flex: 1 0 auto;
}
.panel-left {
	width: 50%;
	background: indianred;
	margin-left: 0px;
	transition: margin-left 1s;
}
.panel-left:hover {
	margin-left: -50%;
}