Menu
I'm playing around with Polymer project and want to create a layout similar to Google Play Music (https://play.google.com/music).
How can I hide the drawer by default and display the icon? Basically the small screen behavior of paper-drawer-panel should be forced. How can I create a app toolbar similar to Play Music?
<body unresolved class="fullbleed layout vertical">
<span id="browser-sync-binding"></span>
<template is="dom-bind" id="app">
<paper-drawer-panel responsiveWidth="9999px">
<paper-header-panel drawer>
<paper-toolbar>
<div>Application</div>
</paper-toolbar>
<div>Drawer content...</div>
</paper-header-panel>
<paper-header-panel main>
<paper-toolbar>
<paper-icon-button icon="menu" paper-drawer-toggle></paper-icon-button>
<div>Title</div>
</paper-toolbar>
<div>Main content...</div>
</paper-header-panel>
</paper-drawer-panel>
</template>
</body>
564
asked Mar 16 '26 03:03
Erm... How about just force-narrow?
<paper-header-panel force-narrow>
...
</paper-header-panel>
as described in "paper-header-panel.html":
/**
* If true, ignore `responsiveWidth` setting and force the narrow layout.
*/
forceNarrow: {
type: Boolean,
value: false
},
I found the solution! The documentation is pretty useless when such basics like attributes are not correct.
<paper-drawer-panel responsive-width="10000px">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With