iron-media-query inside paper-toolbar doesn't load template

[itsas...@gmail.com]

 <template is="dom-bind">

                            <iron-media-query query="(min-width: 1008px)" query-matches="{{largeScreen}}">

                            </iron-media-query>

                            <template is="dom-if" if="{{largeScreen}}">

                                <span class="right-container">

                    <paper-icon-button src="{{userImage}}" icon="account-box"></paper-icon-button>

                    <paper-icon-button icon="settings"></paper-icon-button>

                </span>

                            </template>

                            <template is="dom-if" if="{{!largeScreen}}">

                                <span></span>
<paper-icon-button icon="settings"></paper-icon-button>

                            </template>

                        </template>

It works directly when paper-toolbar was inside paper-header-panel inside body. But since I have moved the whole code to a new dom-module, it has stopped working.
I am not getting any error messages in the console.

Any suggestions?

[kti...@gmail.com]

If this is part of a dom-module why are you dom-binding the outer template? I would hazard a guess (without a more complete code snippet) I would say this template is outside the context it was previously and variables/properties are not assigned as they were.

But this is all just speculation based on the first observation.

[itsas...@gmail.com]

Thank you.
I am new to Polymer. Couldn't figure it out. Had no clue I was restricting the iron-media-query by dom-binding to the wrong template.

[Karl Tiedt]

I'm not saying you are restricting it, I am saying, if that if that is in fact part of a custom element, is="dom-bind" is not correct to my knowledge and is probably causing the problems.

-Karl Tiedt