Mon, 24 Jun 2013 17:43:42 -0700
[css-ruby] Define auto-hiding behavior for handling furigana.
css-ruby/Overview.html | file | annotate | diff | comparison | revisions | |
css-ruby/Overview.src.html | file | annotate | diff | comparison | revisions | |
default.css | file | annotate | diff | comparison | revisions |
1.1 --- a/css-ruby/Overview.html Mon Jun 24 14:42:20 2013 -0700 1.2 +++ b/css-ruby/Overview.html Mon Jun 24 17:43:42 2013 -0700 1.3 @@ -5,6 +5,8 @@ 1.4 line breaking 1.5 bidi 1.6 1.7 +Redo all examples with consistent font. (M+ 2p?) 1.8 + 1.9 --> 1.10 <!DOCTYPE html> 1.11 1.12 @@ -19,7 +21,7 @@ 1.13 1.14 <meta content="CSS Ruby Module Level 1" name=dcterms.title> 1.15 <meta content=text name=dcterms.type> 1.16 - <meta content=2013-06-22 name=dcterms.date> 1.17 + <meta content=2013-06-25 name=dcterms.date> 1.18 <meta content="Elika J. Etemad" name=dcterms.creator> 1.19 <meta content="Koji Ishii" name=dcterms.creator> 1.20 <meta content="Richard Ishida" name=dcterms.creator> 1.21 @@ -40,8 +42,8 @@ 1.22 <h1 class=p-name>CSS Ruby Module Level 1</h1> 1.23 1.24 <h2 class="no-num no-toc" id=longstatus-date->Editor's Draft <time 1.25 - class=dt-updated datetime=20130622>22 June 2013</time> 1.26 - <!-- for HTML4 doctype: <span class="value-title" title="20130622">22 June 2013</span></span> --></h2> 1.27 + class=dt-updated datetime=20130625>25 June 2013</time> 1.28 + <!-- for HTML4 doctype: <span class="value-title" title="20130625">25 June 2013</span></span> --></h2> 1.29 1.30 <dl> 1.31 <dt>This version: 1.32 @@ -204,10 +206,13 @@ 1.33 Ruby</a> 1.34 </ul> 1.35 1.36 - <li><a href="#white-space"><span class=secno>2.4. </span> White 1.37 + <li><a href="#autohide"><span class=secno>2.4. </span> Autohiding 1.38 + Annotations</a> 1.39 + 1.40 + <li><a href="#white-space"><span class=secno>2.5. </span> White 1.41 Space</a> 1.42 1.43 - <li><a href="#line-breaking"><span class=secno>2.5. </span> Ruby box and 1.44 + <li><a href="#line-breaking"><span class=secno>2.6. </span> Ruby box and 1.45 line breaking</a> 1.46 </ul> 1.47 1.48 @@ -646,7 +651,56 @@ 1.49 <p class=issue>This shouldn't belong in Level 1. But HTML5 allows it, so we 1.50 have to handle it. Yay HTML5. 1.51 1.52 - <h3 id=white-space><span class=secno>2.4. </span> White Space</h3> 1.53 + <h3 id=autohide><span class=secno>2.4. </span> Autohiding Annotations</h3> 1.54 + 1.55 + <p>If a <a href="#ruby-annotation-box"><i>ruby annotation</i></a> has the 1.56 + exact same content as its base, it is <dfn id=hidden 1.57 + title="hidden ruby annotation | hidden annotation">hidden</dfn>. Hiding a 1.58 + <a href="#ruby-annotation-box"><i>ruby annotation</i></a> does not affect 1.59 + annotation pairing or the block-axis positioning of boxes in other <a 1.60 + href="#level"><i>levels</i></a>. However the <a href="#hidden"><i>hidden 1.61 + annotation</i></a> is not visible, and it has no impact on layout other 1.62 + than to separate adjacent sequences of <a 1.63 + href="#ruby-annotation-box"><i>ruby annotation boxes</i></a> within its 1.64 + level, as if they belonged to separate segments and the <a 1.65 + href="#hidden"><i>hidden annotation</i></a>’s base were not a <a 1.66 + href="#ruby-base-box"><i>ruby base</i></a> but an intervening inline. 1.67 + 1.68 + <div class=example> 1.69 + <p>This is to allow correct inlined display of annotations for Japanese 1.70 + words that are a mix of kanji and hirangana. For example, the word 1.71 + <i>振り仮名</i> should be inlined as 1.72 + 1.73 + <p class=figure>振り仮名(ふりがな) 1.74 + 1.75 + <p>and therefore marked up as 1.76 + 1.77 + <pre> 1.78 +<!-- --><ruby> 1.79 +<!-- --> <rb>振</rb><rb>り</rb><rb>仮</rb><rb>名</rb> 1.80 +<!-- --> <rp>(</rp><rt>ふ</rt><rt>り</rt><rt>が</rt><rt>な</rt><rp>)</rp> 1.81 +<!-- --><ruby></pre> 1.82 + 1.83 + <p>However, when displayed as ruby, the “り” should be hidden 1.84 + 1.85 + <div class=figure> 1.86 + <p><img 1.87 + alt="Hiragana annotations for 振り仮名 appear, each above its base character." 1.88 + src="images/furigana-separate.png"> 1.89 + 1.90 + <p class=caption>Hiragana ruby for 振り仮名 1.91 + </div> 1.92 + </div> 1.93 + 1.94 + <p class=note> Future levels of CSS Ruby may add controls for this, however 1.95 + in this level it is always forced. 1.96 + 1.97 + <p>The content comparison for this auto-hiding behavior takes place prior 1.98 + to white space collapsing. <span class=issue>Is this easier? Or after 1.99 + collapsing is easier? We should do whatever is easier, as it really 1.100 + doesn't matter much which way to go. </span> 1.101 + 1.102 + <h3 id=white-space><span class=secno>2.5. </span> White Space</h3> 1.103 1.104 <p class=issue>I'm unsure exactly where space should be trimmed. :/ But 1.105 pretty sure we need to keep spaces between things, otherwise ruby only 1.106 @@ -660,8 +714,8 @@ 1.107 only contents. Between <a href="#ruby-segments"><i>ruby segments</i></a>, 1.108 between <a href="#ruby-base-box"><i>ruby bases</i></a>, and between <a 1.109 href="#ruby-annotation-box"><i>ruby annotations</i></a>, however, white 1.110 - space is not discarded. If such the white space is <i>collapsible</i>, it 1.111 - will collapse following the standard <a 1.112 + space is not discarded. If such white space is <i>collapsible</i>, it will 1.113 + collapse following the standard <a 1.114 href="http://www.w3.org/TR/css3-text/#white-space-rules">white space 1.115 processing rules</a>. [[!CSS3-TEXT]] Between <a 1.116 href="#ruby-segments"><i>ruby segments</i></a>, however, the contextual 1.117 @@ -720,7 +774,7 @@ 1.118 1.119 <p class=issue>Specify how this impacts layout, or not. 1.120 1.121 - <h3 id=line-breaking><span class=secno>2.5. </span> Ruby box and line 1.122 + <h3 id=line-breaking><span class=secno>2.6. </span> Ruby box and line 1.123 breaking</h3> 1.124 1.125 <p>When there is not enough space for an entire <a 1.126 @@ -1983,6 +2037,12 @@ 1.127 <li>authoring tool, <a href="#authoring-tool" 1.128 title="section 6.2."><strong>6.2.</strong></a> 1.129 1.130 + <li>hidden annotation, <a href="#hidden" 1.131 + title="section 2.4."><strong>2.4.</strong></a> 1.132 + 1.133 + <li>hidden ruby annotation, <a href="#hidden" 1.134 + title="section 2.4."><strong>2.4.</strong></a> 1.135 + 1.136 <li>level, <a href="#level" title="section 2.3."><strong>2.3.</strong></a> 1.137 1.138 <li>renderer, <a href="#renderer"
2.1 --- a/css-ruby/Overview.src.html Mon Jun 24 14:42:20 2013 -0700 2.2 +++ b/css-ruby/Overview.src.html Mon Jun 24 17:43:42 2013 -0700 2.3 @@ -5,6 +5,8 @@ 2.4 line breaking 2.5 bidi 2.6 2.7 +Redo all examples with consistent font. (M+ 2p?) 2.8 + 2.9 --> 2.10 2.11 <!DOCTYPE html> 2.12 @@ -381,6 +383,46 @@ 2.13 2.14 <p class="issue">This shouldn't belong in Level 1. But HTML5 allows it, so we have to handle it. Yay HTML5. 2.15 2.16 +<h3 id="autohide"> 2.17 +Autohiding Annotations</h3> 2.18 + 2.19 + <p>If a <i>ruby annotation</i> has the exact same content as its base, 2.20 + it is <dfn title="hidden ruby annotation | hidden annotation">hidden</dfn>. 2.21 + Hiding a <i>ruby annotation</i> does not affect annotation pairing 2.22 + or the block-axis positioning of boxes in other <i>levels</i>. 2.23 + However the <i>hidden annotation</i> is not visible, 2.24 + and it has no impact on layout 2.25 + other than to separate adjacent sequences of <i>ruby annotation boxes</i> within its level, 2.26 + as if they belonged to separate segments 2.27 + and the <i>hidden annotation</i>’s base were not a <i>ruby base</i> but an intervening inline. 2.28 + 2.29 + <div class="example"> 2.30 + <p>This is to allow correct inlined display of annotations 2.31 + for Japanese words that are a mix of kanji and hirangana. 2.32 + For example, the word <i>振り仮名</i> should be inlined as 2.33 + <p class="figure">振り仮名(ふりがな) 2.34 + <p>and therefore marked up as 2.35 + <pre> 2.36 +<!-- --><ruby> 2.37 +<!-- --> <rb>振</rb><rb>り</rb><rb>仮</rb><rb>名</rb> 2.38 +<!-- --> <rp>(</rp><rt>ふ</rt><rt>り</rt><rt>が</rt><rt>な</rt><rp>)</rp> 2.39 +<!-- --><ruby></pre> 2.40 + <p>However, when displayed as ruby, the “り” should be hidden 2.41 + <div class="figure"> 2.42 + <p><img src="images/furigana-separate.png" 2.43 + alt="Hiragana annotations for 振り仮名 appear, each above its base character."> 2.44 + <p class="caption">Hiragana ruby for 振り仮名 2.45 + </div> 2.46 + </div> 2.47 + 2.48 + <p class="note"> 2.49 + Future levels of CSS Ruby may add controls for this, 2.50 + however in this level it is always forced. 2.51 + 2.52 + <p>The content comparison for this auto-hiding behavior 2.53 + takes place prior to white space collapsing. 2.54 + <span class="issue">Is this easier? Or after collapsing is easier? We should do whatever is easier, as it really doesn't matter much which way to go. 2.55 + 2.56 <h3 id="white-space"> 2.57 White Space</h3> 2.58
3.1 --- a/default.css Mon Jun 24 14:42:20 2013 -0700 3.2 +++ b/default.css Mon Jun 24 17:43:42 2013 -0700 3.3 @@ -228,7 +228,7 @@ 3.4 s, del {text-decoration: line-through; color: red} 3.5 u, ins {text-decoration: underline; background: #bfa} 3.6 3.7 -div.figure, div.sidefigure, figure { 3.8 +div.figure, p.figure, div.sidefigure, figure { 3.9 text-align: center; 3.10 margin: 2.5em 0; 3.11 }