Thanks Eric, that worked. :) Now i got this on small screen http://screencast.com/t/XxhYYggpflmb . Now is there a way to change width of *<core-drawer-panel>* when opened trough toggle button like on screenshot?
понедељак, 24. новембар 2014. 21.42.15 UTC+1, Eric Bidelman је написао/ла: > > Hi, I responded on SO. > > > http://stackoverflow.com/questions/27113266/having-trouble-with-changing-core-drawer-panel-default-width > > <http://www.google.com/url?q=http%3A%2F%2Fstackoverflow.com%2Fquestions%2F27113266%2Fhaving-trouble-with-changing-core-drawer-panel-default-width&sa=D&sntz=1&usg=AFQjCNFt2nCyIjBOD6HYuyQwOkkHDiwRcw> > > On Mon, Nov 24, 2014 at 1:58 PM, Jelena Jovanovic <[email protected] > <javascript:>> wrote: > >> Hi, >> >> I started playing around with Polymer few days ago and so far I >> understand it quite good, but just now I ran into an problem. I tried to >> change default width of *<core-drawer-panel>* but I couldn't get the >> desired result. First I tried to change width in css only with these >> changes: >> >> <style> >> >> #navheader { >> background-color: #56BA89; >> } >> core-drawer-panel .transition > #main{ >> left:100px!important; >> } >> >> core-drawer-panel .transition > #drawer{ >> width:100px!important; >> } >> >> core-drawer-panel .narrow-layout > #drawer:not(.core-selected){ >> width:100px!important; >> } >> </style> >> >> and here is the html part: >> >> <core-scaffold> >> >> <core-header-panel navigation flex> >> <core-toolbar id="navheader"> >> <span>Menu</span> >> </core-toolbar> >> <core-menu> >> <core-item label="One"></core-item> >> <core-item label="Two"></core-item> >> <core-item label="Three"></core-item> >> <core-item label="Four"></core-item> >> <core-item label="Five"></core-item> >> <core-item label="Six"></core-item> >> <core-item label="Seven"></core-item> >> >> </core-menu> >> </core-header-panel> >> >> <span tool>Title</span> >> >> <div class="content"> >> If drawer is hidden, press button to display drawer. >> </div> >> </core-scaffold> >> >> It didn't wanted to overwrite the default style without !important. This >> is what i got: http://screencast.com/t/7AQHblQvk and it looks good until >> it collapse, like this: http://screencast.com/t/oDg3ptLpp . Then I tried >> to change default width inside of *core-drawer-panel.html* so I modified >> this part of code: >> >> /** >> * Width of the drawer panel. >> * >> * @attribute drawerWidth >> * @type string >> * @default '256px' >> */ >> drawerWidth: '100px', >> >> and nothing happened. It didn't changed the width of element, so now I am >> out of ideas and knowledge about how to achieve this. Can anyone help? >> >> Thanks in advance! :) >> >> Jelena >> >> >> >> Follow Polymer on Google+: plus.google.com/107187849809354688692 >> --- >> You received this message because you are subscribed to the Google Groups >> "Polymer" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected] <javascript:>. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/polymer-dev/7db9800b-655c-44fd-baa3-6bdcd51a5013%40googlegroups.com >> >> <https://groups.google.com/d/msgid/polymer-dev/7db9800b-655c-44fd-baa3-6bdcd51a5013%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> For more options, visit https://groups.google.com/d/optout. >> > > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/1ea0ddbf-36fb-4c2e-9de1-b0ce0658f006%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
