@patternslib/patternslib
Version:
Patternslib is a JavaScript library that enables designers to build rich interactive prototypes without the need for writing any Javascript. All events are triggered by classes and other attributes in the HTML, without abusing the HTML as a programming la
59 lines (58 loc) • 2.31 kB
HTML
<html>
<head>
<title>Patterns — Equaliser</title>
<meta charset="utf-8">
<link rel="stylesheet" href="/style/common.css" />
<script src="/bundle.min.js"></script>
</head>
<body class="home">
<div
class="row pat-equaliser"
data-pat-equaliser="transition: grow; effect-easing: swing"
>
<div class="six columns">
<div class="panel">
<article class="pat-rich">
<p>
Sed ut perspiciatis unde omnis iste natus error sit
voluptatem accusantium doloremque laudantium, totam
rem aperiam, eaque ipsa quae ab illo inventore
veritatis et quasi architecto beatae vitae dicta
sunt explicabo. Nemo enim ipsam voluptatem quia
voluptas sit aspernatur aut odit aut fugit, sed quia
consequuntur magni dolores eos qui ratione
voluptatem sequi nesciunt. Neque porro quisquam est,
qui dolorem ipsum quia dolor sit amet, consectetur,
adipisci velit, sed quia non numquam.
</p>
<div class="pat-collapsible">
<h4>More…</h4>
<p>
Totam rem aperiam, eaque ipsa quae ab illo
inventore veritatis et quasi architecto beatae
vitae dicta sunt explicabo.
</p>
</div>
</article>
</div>
</div>
<div class="six columns">
<div class="panel">
<article class="pat-rich">
<p>Minimal content</p>
</article>
</div>
</div>
</div>
<style>
.panel {
padding: 1.5em;
background-color: #efefef;
}
.equalised {
background-color: pink;
}
</style>
</body>
</html>