react-layout-pane
Version:
React flexbox layout component
53 lines (42 loc) • 1.02 kB
HTML
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.2/normalize.min.css" rel="stylesheet">
<style>
*, *:before, *:after {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
html, body {
font-size: 16px;
line-height: 1.5rem;
}
.header {
padding: 1rem;
background: #111;
height: 4rem;
color: #fff;
}
.sidebar {
background: #2980B9;
width: 10rem;
color: #fff;
}
.top-left, .top-right, .bottom-left, .bottom-right {
padding: 1rem;
}
.content {
padding: 1rem;
background: #ECF0F1;
}
</style>
</head>
<body>
<div id="container">
</div>
</body>
<script src="bundle.js"></script>
</html>