search

bkardell / common-panel

An effort to define a new element with clear semantics and separation
14 stars 3 forks source link

How to control rendering style #25

Open chaals opened 9 years ago

chaals commented 9 years ago

How do we use CSS to set the rendering style? Should there be an attribute, like preferredForm? …

bkardell commented 9 years ago

This is probably the single most difficult question because it definitely should be governed by CSS, but we probably don't want this proposal (or prollyfill implementations) dependent on another, or more complex one which isn't a thing yet. The obvious choice to avoid this seems to be an attribute, but CSS can't control attribute values and it never will be able to because that creates circular logic. Currently the prototype uses (and links to) a minimal prototype/proposal for 'preferred display' but that actually does have the stuff expressed in (custom) CSS controlling an attribute (because there's really no other way of having the actual CSS style it otherwise - there's no way to say 'accordion titles look like this' without a selector to base it on).

The most obvious answer to me seems that if you can spec it in such a way that you dont say 'this attribute definitely does style it a certain way' but rather can play in the overall scheme (ie, be trumped by CSS and then still used to style) - but I'm just not sure how to propose something that doesn't paint you into potential corners.

LJWatson commented 9 years ago

On the assumption there will need to be (at the least) a basic browser styling for a panel/panelset, the trick will be finding something appropriate. That may even be outside of the scope for this extension – to some extent it’s a UA implementation choice.

The critical thing will be that authors can completely override the browser styling. We don’t want a repeat of the current restrictions on styling interactive elements!

chaals commented 9 years ago

To make this work we need browser implementation anyway. Which is good, because any CSS we want has to be implemented, or it disappears from browser engines.

Assuming we have defined some CSS property, you can put that in a style attribute, and manipulate it with javascript.

What is important is that it is possible to style all the things, in a way that allows for override.

So we need to define something like a box model, and the pieces in it - which is what the multi-coloured image in the spec does, right?

And then we need to figure out, especially for deck mode which is basically full-screen, what happens so the user doesn't get phished…

…which we can probably do in part by piggy-backing on fullscreen.