New Post: mobile view of nbstore

ok I've applied a quick and dirty set of fixes that make the rows layout, the details view and some parts of the checkout work on a small screen.

This is in the stylesheetoverride.css on your site and anyone else can apply it to theirs as well so long as they are using the productlistrows.flag setting and have the list set to 1 column.

.ListItem.Rows {

height: inherit;
min-height: 180px;
min-width: 270px;
width: 100%;

}
.ListItem.Rows .ImageWrapper {

min-width: 138px;
padding: 4px;
width: 190px;

}
.ListItem.Rows .InfoPanel {

width: 100%;

}
.Detail .PurchasingPanel {

float: left;

}
.NBright_CartOptDiv .ShippingMethods {

white-space: nowrap;

}
.CheckoutSteps .Label {

padding: inherit;

}
.CheckoutSteps td {

padding: inherit;

}
.AddressCollector .Label {

width: 80px;

}
.AddressCollector .NormalTextBox {

max-width: 200px;
width: 100%;

}
.AddressCollector select.NormalTextBox {

width: 100%;
max-width: 200px;

}
.AddressCollector td, .AddressOptions td {

white-space: nowrap;

}
.AddressSelectorFieldset td {

white-space: normal;

}
.AddressOptions{

width: 100%;

}
.SpecialInstructions {

max-width: 450px;
width: 100%;

}


I've done this with no HTML template changes in order to keep it simple.

Note that the checkout other (than the steps) is not templated and therefore can only be made squeezable, which is what I've done.

You might decide you want to revise the checkout header templates to make them more squeezy than I have here.. i.e. remove the first column or change the words to be shorter.

Note also that the comments module on your site is not responsive and doesn't fit in.

Regards
ROb