Re: [shadow-styling] Scoping at-rules like @font-face in scoped styled and shadow trees?

Tab Atkins Jr. wrote:
> Nobody else has any opinions?  If not, we should go with #1 and settle
> it in a spec.

I don't like #1 at all.  I think the risk of name collision is too great.

Off the top of my head solution to satisfy #2:

* Every style sheet is assigned a unique identifier of some sort 
automatically.

* The name that a given at-rule defines (like the font-family in an 
@font-face, the identifier right after the @keyframes) is implicitly 
prefixed with this unique identifier.

* To reference a name that has been declared in a scoped style sheet you 
use say scoped(name).  This is expanded out to <unique_identifier> + 
name at specified value time.

So:

   <!DOCTYPE html>
   <style>
   @keyframes anim {
     from { color: red; }
     to   { color: blue; }
   }
   p:hover { animation: 2s anim; }
   </style>
   <body>
     <p>one</p>
     <div>
       <style scoped>
         @keyframes anim {
           from { color: green; }
           to   { color: yellow; }
         }
         p.x:hover { animation: 2s scoped(anim); }
       </style>
       <p>two</p>
       <p class=x>three</p>
     </div>
   </body>

would cause the "one" and "two" to animate from red to blue and the 
"three" to animate from green to yellow.

The scoped @keyframes rule defines a globally available keyframes name 
that is <unique_identifier> + "anim", and if you inspected the 
declaration in the scoped style sheet the value for animation-name would 
be <unique_identifier> + "anim" too.


I don't really like that the global ID the UA comes up with is visible 
to script.  We could have it so that the specified value of 
animation-name still looks like "scoped(anim)" even though internally 
it's also stored the unique ID along with it.  Same for the computed value.

Or the global ID could be something like the URL of the style sheet plus 
the index that it appears in document.styleSheets.  Plus something to 
handle style="".

Received on Wednesday, 26 February 2014 05:19:36 UTC