pseudo classes

[Todd Brannam]

I'd propose supporting pseudo classes that allow styling on device form factor.
as a minimum "phone". "tablet" -

I could see perhaps following the pattern of size-classes instead (width-compact, width-any, width-regular, height-compact, height-any, height-regular)?

It might also be helpful if the Pseudo Class Parse supported multiple Pseudo Classes in a style definition - or is there another way to express this already?

.simple:phone:landscape{
    backgroundColor: red;
}

.simple:phone:portrait{
    backgroundColor: blue;
}

.simple:tablet:portrait{
    backgroundColor: pink;
}
.simple:tablet:landscape{
    backgroundColor: green;
}

[Tobias Löfstrand]

Yes, using pseudo classes for size classes, or actually trait collections, is an idea I'm toying around with.

I haven't decided if I'm gonna go with chained or parameterized pseudo classes yet, although I'm leaning towards the latter. That would look something like this:

.simple:traits(anyWidth, regularHeight) {
    backgroundColor: red;
}

But I'm not ruling out the inclusion of a simpler device idiom pseudo class (with the possibility of chaining with interface orientation pseudo class) on top of this. I'm going to experiment a bit more and see what I come up with.

[Todd Brannam]

Adding multiple Pseudoclass support came just in time. Thanks!

[Tobias Löfstrand]

Glad to hear it! :)