[css-syntax] Add column combinator.

Author: tabatkins

css-syntax/Diagrams.src.html

@@ -171,6 +171,8 @@ <h3>Parsing</h3>
 
 add('SUBSTRING-MATCH', Diagram('*='));
 
+add('COLUMN', Diagram('||'));
+
 add('CDO', Diagram('<' + '!--'));
 
 add('CDC', Diagram('-' + '->'));

css-syntax/Overview.html

@@ -11,7 +11,7 @@
 
   <meta content="CSS Syntax Module Level 3 (CSS3 Syntax)" name=dc.title>
   <meta content=text name=dc.type>
-  <meta content=2013-04-03 name=dc.date>
+  <meta content=2013-04-04 name=dc.date>
   <meta content="Tab Atkins Jr." name=dc.creator>
   <meta content=W3C name=dc.publisher>
   <meta content="http://dev.w3.org/csswg/css3-syntax/" name=dc.identifier>
@@ -31,7 +31,7 @@
    <h1 class=p-name>CSS Syntax Module Level 3</h1>
 
    <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft <time
-    class=dt-updated datetime=20130403> 3 April 2013</time></h2>
+    class=dt-updated datetime=20130404> 4 April 2013</time></h2>
 
    <dl>
     <dt>This version:
@@ -677,7 +677,8 @@ <h2 id=tokenization><span class=secno>4. </span> Tokenization</h2>
    following tokens: ident, function, at-keyword, hash, string, bad-string,
    url, bad-url, delim, number, percentage, dimension, unicode-range,
    include-match, dash-match, prefix-match, suffix-match, substring-match,
-   whitespace, cdo, cdc, colon, semicolon, comma, [, ], (, ), {, and }.
+   column, whitespace, cdo, cdc, colon, semicolon, comma, [, ], (, ), {, and
+   }.
 
   <p> Ident, function, at-keyword, hash, string, and url tokens have a value
    composed of zero or more characters. Additionally, hash tokens have a type
@@ -1347,6 +1348,16 @@ <h3 id=token-diagrams><span class=secno>4.1. </span> Token Railroad
     y=20></rect><text x=68 y=35>*=</text></g><path d="M86 31h10"></path><path
     d="M 96 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g></svg>
 
+   <dt id=column-diagram>COLUMN
+
+   <dd><svg class=railroad-diagram height=62 width=137><g
+    transform="translate(.5 .5)"><path
+    d="M 20 21 v 20 m 10 -20 v 20 m -10 -10 h 20.5"></path><path
+    d="M40 31h10"></path><g><path d="M50 31h0"></path><path
+    d="M86 31h0"></path><rect height=22 rx=10 ry=10 width=36 x=50
+    y=20></rect><text x=68 y=35>||</text></g><path d="M86 31h10"></path><path
+    d="M 96 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g></svg>
+
    <dt id=cdo-diagram>CDO
 
    <dd><svg class=railroad-diagram height=62 width=153><g
@@ -1686,6 +1697,10 @@ <h4 id=data-state><span class=secno>4.4.1. </span> <dfn id=data-state0>Data
    <dd> If the <a href="#next-input-character"><i>next input
     character</i></a> is U+003D EQUALS SIGN (=), consume it and emit a
     dash-match token. Remain in this state.
+    <p> Otherwise, if the <a href="#next-input-character"><i>next input
+     character</i></a> is U+0073 VERTICAL LINE (|), consume it and emit a
+     column token. Remain in this state.
+
     <p> Otherwise, emit a delim token with its value set to the <a
      href="#current-input-character"><i>current input character</i></a>.
      Remain in this state.

css-syntax/Overview.src.html

@@ -424,6 +424,7 @@ <h2>
 		prefix-match,
 		suffix-match,
 		substring-match,
+		column,
 		whitespace,
 		cdo,
 		cdc,
@@ -541,6 +542,9 @@ <h3 id='token-diagrams'>
 		<dt id="substring-match-diagram">SUBSTRING-MATCH</dt>
 		<dd><svg class="railroad-diagram" width="137" height="62"><g transform="translate(.5 .5)"><path d="M 20 21 v 20 m 10 -20 v 20 m -10 -10 h 20.5"></path><path d="M40 31h10"></path><g><path d="M50 31h0"></path><path d="M86 31h0"></path><rect x="50" y="20" width="36" height="22" rx="10" ry="10"></rect><text x="68" y="35">*=</text></g><path d="M86 31h10"></path><path d="M 96 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g></svg></dd>
 
+		<dt id="column-diagram">COLUMN</dt>
+		<dd><svg class="railroad-diagram" width="137" height="62"><g transform="translate(.5 .5)"><path d="M 20 21 v 20 m 10 -20 v 20 m -10 -10 h 20.5"></path><path d="M40 31h10"></path><g><path d="M50 31h0"></path><path d="M86 31h0"></path><rect x="50" y="20" width="36" height="22" rx="10" ry="10"></rect><text x="68" y="35">||</text></g><path d="M86 31h10"></path><path d="M 96 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g></svg></dd>
+
 		<dt id="cdo-diagram">CDO</dt>
 		<dd><svg class="railroad-diagram" width="153" height="62"><g transform="translate(.5 .5)"><path d="M 20 21 v 20 m 10 -20 v 20 m -10 -10 h 20.5"></path><path d="M40 31h10"></path><g><path d="M50 31h0"></path><path d="M102 31h0"></path><rect x="50" y="20" width="52" height="22" rx="10" ry="10"></rect><text x="76" y="35">&lt;!--</text></g><path d="M102 31h10"></path><path d="M 112 31 h 20 m -10 -10 v 20 m 10 -20 v 20"></path></g></svg></dd>
 
@@ -897,6 +901,14 @@ <h4>
 			and emit a dash-match token.
 			Remain in this state.
 
+			<p>
+				Otherwise,
+				if the <i>next input character</i> is
+				U+0073 VERTICAL LINE (|),
+				consume it
+				and emit a column token.
+				Remain in this state.
+
 			<p>
 				Otherwise,
 				emit a delim token