polymer - paper-drawer-panel's closeDrawer() not closing with custom header element -


update able close drawer document.queryselector('paper-drawer-panel').forcenarrow = true;. going delete question maybe leave see if there way proper closedrawer()

i wrote own custom header, doesn't use of paper header behaviors. it's it's own custom element html styled header no behavior or features.

i implemented paper-drawer-panel worked great custom header. however, can not closedrawer() close drawer. see function function () { this.selected = 'main' }, not sure how applies inner code of paper-drawer-panel.

how can make paper-drawer-panel's closedrawer() close drawer?

index.html:

  <template is="dom-bind" id="app">     <paper-drawer-panel>       <div drawer>         <drawer-custom></drawer-custom>       </div>       <div main>         <header-custom></header-custom>         <video-selection data-route="home" tabindex="-1"></video-selection>       </div>     </paper-drawer-panel>   </template> 

app/elements/drawer-custom.html:

<dom-module id="drawer-custom">   <template>     <style include="iron-flex iron-flex-alignment">      :host {        background-color: var(--brown-color);        height: 1000px;        width: 100%;        overflow-x: hidden;        outline: none;        display: block;        padding-right: 1px;         --iron-icon-height: 42px;         --iron-icon-width: 42px;      }      .v-center {       @apply(--layout-vertical);       @apply(--layout-center-center);     }        #close-drawer {       height: 130px;       width: 100%;       background-color: var(--pink-color);       padding-right: 1px;     }      #contact {       background-color: #a9483b;       height: 130px;        width: 100%;       padding-right: 1px;     }      </style>     <div on-click="_closedrawer" id="close-drawer" class="v-center">       <iron-icon src='../images/menu-button-close.svg'></iron-icon>     </div>     <div id="contact">       contact     </div>   </template>    <script>     polymer({       is: 'drawer-custom',       _closedrawer: function() {         document.queryselector('paper-drawer-panel').closedrawer();       }      })   </script> </dom-module> 

solution:

when added <paper-icon-button> child paper-drawer-panel function closedrawer() worked.


Comments

Popular posts from this blog

Ansible - ERROR! the field 'hosts' is required but was not set -

customize file_field button ruby on rails -

SoapUI on windows 10 - high DPI/4K scaling issue -