Second Paper Drawer
51 views
Skip to first unread message
Anton Fliege
Jun 21, 2016, 10:17:02 PM6/21/16
to Polymer
Hello,
i need a second paper drawer on the right side.
Is this possible with polymer 1 and the paper-drawer element?
have anyone a code sample for me?
thanks for your help!
mgrprog...@gmail.com
Jun 22, 2016, 9:27:00 AM6/22/16
to Polymer, mr.ev...@gmail.com
Yes possible to have silder on left and right hand side.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Leipzig-Memory</title>
<script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>
<link rel="import" href="bower_components/iron-flex-layout/classes/iron-flex-layout.html">
<link rel="import" href="bower_components/paper-drawer-panel/paper-drawer-panel.html">
<link rel="import" href="bower_components/paper-header-panel/paper-header-panel.html">
<link rel="import" href="bower_components/paper-toolbar/paper-toolbar.html">
</head>
<style>body {font-family: sans-serif;} paper-toolbar {border: #fff solid 1px}</style>
<body class="fullbleed layout vertical">
<paper-drawer-panel>
<paper-header-panel drawer>
<paper-toolbar class="tall"></paper-toolbar>
<div>content left drawer</div>
</paper-header-panel>
<paper-drawer-panel main right-drawer>
<paper-header-panel drawer>
<paper-toolbar class="tall">
</paper-toolbar>
<div main>
content right drawer
</div>
</paper-header-panel>
<paper-header-panel main>
<paper-toolbar>
<div>double drawer example</div>
</paper-toolbar>
<div>
Content
</div>
</paper-header-panel>
</paper-drawer-panel>
</paper-drawer-panel>
</body>
</html>Hide a drawer with force-narrow.
A site I am playing with (buggy, I know, not production): http://www.damawi.de/. After you hit search, you get to a site and can open a filter on the right hand side with the fab and still have the menu on the left hand side.
Reply all
Reply to author
Forward
0 new messages