Responsive designs

529 views
Skip to first unread message

leif.j...@fact.co.uk

unread,
Jul 3, 2014, 6:28:36 AM7/3/14
to polym...@googlegroups.com
This is a bit a newb question, so do forgive. I'm fairly new to Polymer, but it's already proving to be a life safer. One thing that I can't see is how to make content responsive.

The scaffold, toolbar and menus are all responsive, but any content you place is not. I was wondering wether I'm missing something, or is it case of sorting it out with CSS or using something like Bootstrap Grids.


shaggy...@gmail.com

unread,
Jul 3, 2014, 9:06:15 PM7/3/14
to polym...@googlegroups.com, leif.j...@fact.co.uk
Yea I am wondering the same thing. Elements are responsive within but there is no grid system as far as I know. Will there be one ? I think I am going to use bootstrap grid system for the time being but I would love to get rid of it and just use this entirely.

Rob Dodson

unread,
Jul 4, 2014, 12:04:59 PM7/4/14
to shaggy...@gmail.com, polymer-dev, leif.j...@fact.co.uk
We don't currently have a grid element, though someone has done the work of breaking out the twitter bootstrap grid into its own element (which is awesome).

Any element you write can contain media queries in its CSS, so there's nothing new there. To make things really configurable we've added a core-media-query element which I talk about in this DevByte. You don't have to use core-media-query, you can just write regular CSS breakpoints if you prefer, but it is fun to play around with because you can get a little binding hook that will notify you when you've hit a particular size and you can totally rearrange your DOM if you want.




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 polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/adcc0b83-963b-4fb1-8d81-2d1811e13b48%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

the5h...@gmail.com

unread,
Sep 18, 2015, 6:11:49 PM9/18/15
to Polymer, leif.j...@fact.co.uk
I have created an easy to use grid system for polymer. Here's the link!

toduu

unread,
Sep 19, 2015, 11:44:02 AM9/19/15
to Polymer, leif.j...@fact.co.uk, the5h...@gmail.com
Not sure why you need this  flexible layout already is there e.g. for 1.0 <div flex-2>ssss</div>

mogv...@gmail.com

unread,
Feb 27, 2016, 1:42:30 PM2/27/16
to Polymer, leif.j...@fact.co.uk, the5h...@gmail.com
Hi, i am trying to use iron-grid but for example this code doesn't respect the sizes in chrome :( but in EDGE it works and i donn't know why :(

 <iron-grid>               
                <div class="s6 m10 l12" style="background-color:aqua;">
                    <span>I am full-width on mobile (s12 m6)</span>
                </div>
            </iron-grid>

Karl Tiedt

unread,
Feb 27, 2016, 2:25:37 PM2/27/16
to mogv...@gmail.com, the5h...@gmail.com, Polymer, leif.j...@fact.co.uk

You might check out https://github.com/Saulis/iron-data-table/releases/tag/v1.0.0-alpha3 instead, it may achieve your goals.

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 polymer-dev...@googlegroups.com.
Reply all
Reply to author
Forward
0 new messages