I’m trying to help out our frontend guy by making a page a single page
that
contains every kind of situation our site uses. So there should be a
header, a nav in a few various states, a new form, a form with errors,
etc.
Then I also want to figure out some way to show what it will look like
in a
few different screen sizes (I’m thinking of starting with a pair of
iframes
that show the same content, one at 320px and the other taking the
remaining
width. Eventually it’d be configurable somehow).
Do you guys have any suggestions of how to implement this nicely, or
should
I just go about slapping out some Haml that emulates what my existing
site
does?
I ended up doing this. It works better than I thought: Though it starts
on
the initial page, the individual
Note that I still need to tweak the dimensions to get it perfect. Right
now
the scrollbars take up some of the 320x480 window, so it’s not
completely
realistic. But it works well enough that I can see the results of all my @media queries at once.
—☈
params = { src: '/my/starting/page }
%style
:sass #test-boxes
text-align: center
iframe
border: thin dotted black
vertical-align: top