[yelp-xsl/wip/html5: 1/4] Initial work on new HTML5 layout

From: Shaun McCance <shaunm src gnome org>
To: commits-list gnome org
Cc:
Subject: [yelp-xsl/wip/html5: 1/4] Initial work on new HTML5 layout
Date: Mon, 26 Oct 2015 20:40:37 +0000 (UTC)
commit 36a41b61afa9ddaddd20cd61a8f854ff5a12166d
Author: Shaun McCance <shaunm redhat com>
Date:   Sun Oct 18 13:26:31 2015 -0400

    Initial work on new HTML5 layout
    
    New semantic elements, 960 base width, flexbox, even more responsive

 xslt/common/html.xsl                 |  181 ++++++++++++++++------------------
 xslt/mallard/html/mal2html-links.xsl |    6 +-
 xslt/mallard/html/mal2html-page.xsl  |  119 +++++++++++++---------
 3 files changed, 160 insertions(+), 146 deletions(-)
---
diff --git a/xslt/common/html.xsl b/xslt/common/html.xsl
index 9629821..9b7eb8e 100644
--- a/xslt/common/html.xsl
+++ b/xslt/common/html.xsl
@@ -325,21 +325,21 @@ as ${node} to this template.
         <xsl:with-param name="node" select="$node"/>
       </xsl:call-template>
       <div class="page" role="main">
-        <div class="header"> 
+        <header>
           <xsl:call-template name="html.header.custom">
             <xsl:with-param name="node" select="$node"/>
           </xsl:call-template>
           <xsl:apply-templates mode="html.header.mode" select="$node"/>
-        </div>
-        <div class="body">
+        </header>
+        <article>
           <xsl:apply-templates mode="html.body.mode" select="$node"/>
-        </div>
-        <div class="footer">
+        </article>
+        <footer>
           <xsl:apply-templates mode="html.footer.mode" select="$node"/>
           <xsl:call-template name="html.footer.custom">
             <xsl:with-param name="node" select="$node"/>
           </xsl:call-template>
-        </div>
+        </footer>
       </div>
       <xsl:call-template name="html.bottom.custom">
         <xsl:with-param name="node" select="$node"/>
@@ -748,22 +748,36 @@ body {
     <xsl:value-of select="$color.text"/><xsl:text>;
   direction: </xsl:text><xsl:value-of select="$direction"/><xsl:text>;
 }
+article, aside, nav, header, footer, section {
+  display: block;
+  margin: 0;
+  padding: 0;
+}
 div.page {
-  margin: 1em auto 1em auto;
-  max-width: 60em;
-  border: solid 1px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  margin: 0;
+  display: flex;
+  flex-flow: column;
+  align-items: stretch;
+  justify-content: flext-start;
+  max-width: 960px;
+  min-height: 100vh;
+  margin: 0 auto;
+}
+div.page > article {
+  flex: 1 0 100%;
+  padding: 10px;
+}
+div.page > header {
+  flex: 0 1 auto;
+}
+div.page > footer {
+  flex: 0 1 auto;
 }
 div.body {
-  margin: 0;
-  padding-left: 1em;
-  padding-right: 1em;
-  padding-bottom: 1em;
   min-height: 20em;
   background-color: </xsl:text><xsl:value-of select="$color.background"/><xsl:text>;
+  padding: 10px;
 }
-div.header { margin: 0; }
-div.footer { margin: 0; }
 div.sect {
   margin-top: 2.4em;
   clear: both;
@@ -773,33 +787,38 @@ div.sect div.sect {
 }
 div.trails {
   margin: 0;
-  padding: 0.5em 1em 0.5em 1em;
+  padding: 0.2em 10px;
   background-color: </xsl:text><xsl:value-of select="$color.gray_background"/><xsl:text>;
 }
 div.trail {
-  margin: 0.2em 0 0 0;
+  margin: 0.2em 0;
   padding: 0 1em 0 1em;
   text-indent: -1em;
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
 }
 a.trail { white-space: nowrap; }
 div.hgroup {
-  margin: 1em 0 0.5em 0;
+  margin: 0 0 0.5em 0;
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
 }
-div.sect div.hgroup {
+div.sect > div.inner > div.hgroup {
   margin-top: 0;
   border-bottom: solid 1px </xsl:text>
     <xsl:value-of select="$color.gray_border"/><xsl:text>;
+  margin-left: -10px;
+  margin-right: -10px;
+  padding-left: 10px;
+  padding-right: 10px;
 }
-div.sect-links div.hgroup {
+div.sect-links > div.hgroup {
   border-bottom: solid 2px </xsl:text>
     <xsl:value-of select="$color.blue_border"/><xsl:text>;
+  margin-left: -10px;
+  margin-right: -10px;
+  padding-left: 10px;
+  padding-right: 10px;
 }
-div.sect div.sect-links {
-  margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 0;
-}
-div.sect div.sect-links div.hgroup {
+div.sect div.sect-links > div.hgroup {
   border: none;
 }
 h1, h2, h3, h4, h5, h6, h7 {
@@ -811,15 +830,12 @@ h1 { font-size: 2em; }
 h2 { font-size: 1.44em; }
 h3.title, h4.title, h5.title, h6.title, h7.title { font-size: 1.2em; }
 h3, h4, h5, h6, h7 { font-size: 1em; }
-
-p { line-height: 1.72em; }
-div, pre, p { margin: 1em 0 0 0; padding: 0; }
-div.contents > *:first-child,
-th > *:first-child, td > *:first-child,
-dt > *:first-child, dd > *:first-child,
-li > *:first-child { margin-top: 0; }
-div.inner, div.region, div.contents, pre.contents { margin-top: 0; }
-pre.contents div { margin-top: 0 !important; }
+p { line-height: 1.44em; }
+div, pre, p { margin: 0; padding: 0; }
+div.contents > * + *,
+th > * + *, td > * + *,
+dt > * + *, dd > * + *,
+li > * + * { margin-top: 1em; }
 p img { vertical-align: middle; }
 p.lead { font-size: 1.2em; }
 div.clear {
@@ -831,6 +847,8 @@ div.clear {
 
 div.about {
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
+  margin: 0;
+  background-color: </xsl:text><xsl:value-of select="$color.background"/><xsl:text>;
 }
 div.about > div.inner > div.hgroup {
   margin: 0; padding: 0;
@@ -844,19 +862,33 @@ div.about > div.inner > div.hgroup > h2 {
 div.about.ui-expander > div.inner > div.hgroup span.title:before {
   content: "";
 }
+div.about > div.inner > div.region > div.contents {
+  display: flex;
+  flex-flow: row wrap;
+  align-items: stretch;
+  justify-content: flex-start;
+  vertical-align: top;
+}
 div.copyrights {
-  margin: 1em;
   text-align: center;
+  flex: 1 1 100%;
+  padding: 10px;
 }
 div.copyright {
   margin: 0;
 }
 div.aboutblurb {
-  display: inline-block;
   vertical-align: top;
   text-align: left;
-  max-width: 18em;
-  margin: 0 1em 1em 1em;
+  flex: 0 1 300px;
+  margin: 0;
+  padding: 10px;
+}
+ media (max-width: 974px) {
+  div.aboutblurb { flex: 1 1 300px; }
+}
+ media (max-width: 640px) {
+  div.aboutblurb { flex: 1 0 100%; }
 }
 ul.credits, ul.credits li {
   margin: 0; padding: 0;
@@ -896,6 +928,11 @@ li {
   padding: 0;
 }
 li:first-child { margin-top: 0; }
+ media (max-width: 480px) {
+  li {
+    margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 1.44em;
+  }
+}
 dt { margin-top: 1em; }
 dt:first-child { margin-top: 0; }
 dt + dt { margin-top: 0; }
@@ -927,33 +964,6 @@ p a {
     <xsl:value-of select="$color.blue_border"/><xsl:text>;
 }
 a img { border: none; }
- media only screen and (max-width: 400px) {
-  div.page {
-    margin: 0;
-    border: none;
-  }
-  div.body {
-    padding-left: 0;
-    padding-right: 0;
-  }
-  div.body > div.hgroup,
-  div.body > div.region > div.contents > *,
-  div.body > div.region > div.sect > div.inner > div.hgroup > *,
-  div.body > div.region > div.sect > div.inner > div.region > div.contents > * {
-    margin-left: 12px;
-    margin-right: 12px;
-  }
-  div.body > div.region > div.sect-links {
-    margin-left: 0;
-    margin-right: 0;
-  }
-  div.trails {
-    padding: 12px;
-  }
-  li {
-    margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 1.44em;
-  }
-}
 </xsl:text>
 </xsl:template>
 
@@ -1017,7 +1027,6 @@ div.links ul ul {
 li.links {
   margin: 0.5em 0 0.5em 0;
   padding: 0;
-  padding-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 1em;
   list-style-type: none;
 }
 div.sectionlinks {
@@ -1282,10 +1291,6 @@ ol.steps, ul.steps {
   padding: 0.5em 1em 0.5em 1em;
   border-</xsl:text><xsl:value-of select="$left"/><xsl:text>: solid 4px </xsl:text>
     <xsl:value-of select="$color.yellow_border"/><xsl:text>;
-  -moz-box-shadow: 0 1px 2px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
-  -webkit-box-shadow: 0 1px 2px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
   box-shadow: 0 1px 2px </xsl:text>
     <xsl:value-of select="$color.gray_border"/><xsl:text>;
 }
@@ -1293,8 +1298,6 @@ ol.steps .steps {
   padding: 0;
   border: none;
   background-color: none;
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
   box-shadow: none;
 }
 li.steps { margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 1.44em; }
@@ -1370,10 +1373,6 @@ kbd {
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
   border-radius: 2px;
-  -moz-box-shadow: 1px 1px 2px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
-  -webkit-box-shadow: 1px 1px 2px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
   box-shadow: 1px 1px 2px </xsl:text>
     <xsl:value-of select="$color.gray_border"/><xsl:text>;
   margin: 0 0.2em 0 0.2em;
@@ -1485,10 +1484,6 @@ div.media-ttml-p {
     <xsl:value-of select="$color.yellow_border"/><xsl:text>;
   background-color: </xsl:text>
     <xsl:value-of select="$color.yellow_background"/><xsl:text>;
-  -moz-box-shadow: 2px 2px 4px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
-  -webkit-box-shadow: 2px 2px 4px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
   box-shadow: 2px 2px 4px </xsl:text>
     <xsl:value-of select="$color.gray_border"/><xsl:text>;
 }
@@ -1520,28 +1515,26 @@ div.ui-expander > div.inner > div.hgroup:hover * {
 div.ui-expander > div.inner > div.hgroup > .subtitle {
   margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 2em;
 }
- media only screen and (max-width: 400px) {
-  div.links {
-    margin-left: 12px;
-    margin-right: 12px;
-  } 
-  li.links { padding: 0; }
+ media only screen and (max-width: 480px) {
   div.body > div.region > div.contents > div.example,
   div.body > div.region > div.contents > div.steps,
   div.body > div.region > div.contents > div.note,
   div.body > div.region > div.sect > div.inner > div.region > div.contents > div.example,
   div.body > div.region > div.sect > div.inner > div.region > div.contents > div.steps,
   div.body > div.region > div.sect > div.inner > div.region > div.contents > div.note {
-    margin-left: 0;
-    margin-right: 0;
+    margin-left: -10px;
+    margin-right: -10px;
   }
   div.steps > div.inner > div.title {
-    margin-left: 18px;
-    margin-right: 18px;
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+  div.body > div.region > div.contents > div.note,
+  div.body > div.region > div.sect > div.inner > div.region > div.contents > div.note {
+    border-left: none;
+    border-right: none;
   }
   ol.steps, ul.steps {
-    -moz-box-shadow: none;
-    -webkit-box-shadow: none;
     box-shadow: none;
   }
   div.note-sidebar {
@@ -1554,8 +1547,8 @@ div.ui-expander > div.inner > div.hgroup > .subtitle {
   }
   div.note-sidebar > div.inner > div.title,
   div.note-sidebar > div.inner > div.region > div.contents {
-    margin-left: 12px;
-    margin-right: 12px;
+    margin-left: 10px;
+    margin-right: 10px;
   }
 }
 </xsl:text>
diff --git a/xslt/mallard/html/mal2html-links.xsl b/xslt/mallard/html/mal2html-links.xsl
index af0004e..86c5252 100644
--- a/xslt/mallard/html/mal2html-links.xsl
+++ b/xslt/mallard/html/mal2html-links.xsl
@@ -214,8 +214,6 @@ parameter will be used if provided.
                 <xsl:with-param name="nodesc" select="$nodesc"/>
                 <xsl:with-param name="max" select="$coltot"/>
               </xsl:call-template>
-            </div>
-            <div class="links-twocolumn">
               <xsl:call-template name="_mal2html.links.divs">
                 <xsl:with-param name="node" select="$node"/>
                 <xsl:with-param name="links" select="$links"/>
@@ -921,6 +919,7 @@ when determining which links to output.
   <xsl:param name="node"/>
   <xsl:param name="links"/>
   <xsl:param name="role"/>
+  <div class="links-grid-container">
   <xsl:for-each select="$links">
     <xsl:sort data-type="number" select="@groupsort"/>
     <xsl:sort select="mal:title[ type = 'sort']"/>
@@ -976,6 +975,7 @@ when determining which links to output.
       </xsl:for-each>
     </div>
   </xsl:for-each>
+  </div>
 </xsl:template>
 
 <!--#* _mal2html.links.norwich -->
@@ -1112,6 +1112,7 @@ when determining which links to output.
   <xsl:param name="nodesc" select="false()"/>
   <xsl:param name="min" select="-1"/>
   <xsl:param name="max" select="-1"/>
+  <div class="links-divs">
   <xsl:for-each select="$links">
     <xsl:sort data-type="number" select="@groupsort"/>
     <xsl:sort select="mal:title[ type = 'sort']"/>
@@ -1182,6 +1183,7 @@ when determining which links to output.
       </xsl:for-each>
     </xsl:if>
   </xsl:for-each>
+  </div>
 </xsl:template>
 
 <!--#% _mal2html.links.divs.nolink.mode -->
diff --git a/xslt/mallard/html/mal2html-page.xsl b/xslt/mallard/html/mal2html-page.xsl
index 79724aa..db2e2b0 100644
--- a/xslt/mallard/html/mal2html-page.xsl
+++ b/xslt/mallard/html/mal2html-page.xsl
@@ -887,6 +887,16 @@ are processed in %{mal2html.block.mode}.
     </xsl:call-template>
   </xsl:param>
 <xsl:text>
+<!-- links -->
+div.links .desc a {
+  color: inherit;
+}
+div.links .desc a:hover {
+  color: </xsl:text><xsl:value-of select="$color.link"/><xsl:text>;
+}
+a.bold { font-weight: bold; }
+
+<!-- link/@style = 'button' -->
 div.link-button {
   font-size: 1.2em;
   font-weight: bold;
@@ -902,8 +912,6 @@ div.link-button {
   border: solid 1px </xsl:text>
     <xsl:value-of select="$color.link"/><xsl:text>;
   padding: 0.2em 0.5em 0.2em 0.5em;
-  -moz-border-radius: 2px;
-  -webkit-border-radius: 2px;
   border-radius: 2px;
 }
 .link-button a:visited {
@@ -924,6 +932,8 @@ div.link-button a .desc {
   color: </xsl:text>
     <xsl:value-of select="$color.gray_background"/><xsl:text>;
 }
+
+<!-- @style = 'float*' -->
 div.floatleft {
   float: left;
   margin-right: 1em;
@@ -941,6 +951,7 @@ div.floatend {
   margin-</xsl:text><xsl:value-of select="$left"/><xsl:text>: 1em;
 }
 
+<!-- FIXME -->
 div.title-heading h1, div.title-heading h2, div.title-heading h3,
 div.title-heading h4, div.title-heading h5, div.title-heading h6 {
   font-size: 1.72em;
@@ -950,6 +961,7 @@ ul.links-heading > li { margin: 2em 0 2em 0; padding: 0; }
 div.links-heading > a { font-size: 1.72em; font-weight: bold; }
 ul.links-heading > li > div.desc { margin-top: 0.5em; }
 
+<!-- FIXME -->
 div.mouseovers {
   width: 250px;
   height: 200px;
@@ -972,7 +984,7 @@ ul.mouseovers a img {
   position: absolute;
   margin: 0; padding: 0;
 }
- media only screen and (max-width: 400px) {
+ media only screen and (max-width: 480px) {
   ul.mouseovers a {
     display: block;
     padding: 12px;
@@ -982,6 +994,7 @@ ul.mouseovers a img {
   div.mouseovers { display: none; }
 }
 
+<!-- FIXME -->
 div.ui-screen {
   display: none;
   position: fixed;
@@ -1038,6 +1051,7 @@ a.ui-overlay-close {
 a.ui-overlay-close:hover {
 }
 
+<!-- FIXME -->
 div.ui-tile {
   display: inline-block;
   vertical-align: top;
@@ -1086,6 +1100,7 @@ div.ui-tile > a > span.ui-tile-text > span.desc {
 }
 span.ui-tile-img { text-align: center; }
 
+<!-- FIXME -->
 div.links-ui-hover {
   text-align: center;
   margin: 0;
@@ -1111,7 +1126,7 @@ span.links-ui-hover-img {
   background: </xsl:text><xsl:value-of select="$color.blue_background"/><xsl:text>;
   text-align: center;
 }
- media only screen and (max-width: 400px) {
+ media only screen and (max-width: 480px) {
   ul.links-ui-hover a {
     display: block;
     padding: 12px;
@@ -1121,28 +1136,37 @@ span.links-ui-hover-img {
   div.links-ui-hover { display: none; }
 }
 
-div.links-grid {
-  display: inline-block;
-  clear: both
-  margin-top: 1em;
-  width: 30%;
-  margin-</xsl:text><xsl:value-of select="$right"/><xsl:text>: 2%;
+<!-- links/@style = 'grid' -->
+div.links-grid-container {
+  margin-left: -10px;
+  margin-right: -10px;
+  display: flex;
+  flex-flow: row wrap;
+  align-items: stretch;
+  justify-content: flex-start;
   vertical-align: top;
+  clear: both
+}
+div.links-grid { flex: 0 0 300px; }
+ media (max-width: 960px) {
+  div.links-grid { flex: 0 1 50%; }
+}
+ media (max-width: 640px) {
+  div.links-grid { flex: 0 1 100%; }
 }
 div.links-grid-link {
   margin: 0;
+  padding: 10px 10px 2px 10px;
   font-weight: bold;
 }
 div.links-grid > div.desc {
   margin: 0;
+  padding: 0 10px;
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
 }
- media only screen and (max-width: 400px) {
-  div.links-grid {
-    width: 47%;
-  }
-}
 
+<!-- FIXME -->
+<!-- links/@style = 'norwich' -->
 div.links-norwich {
   width: 900px;
 }
@@ -1238,32 +1262,15 @@ div.links-norwich-small a:hover {
   }
 }
 
-div.links-twocolumn {
-  display: inline-block;
-  width: 48%;
-  margin-top: 0;
-  margin-</xsl:text><xsl:value-of select="$right"/><xsl:text>: 1%;
-  vertical-align: top;
-}
- media only screen and (max-width: 400px) {
-  div.links-twocolumn {
-    width: 100%;
-    margin-</xsl:text><xsl:value-of select="$right"/><xsl:text>: 0;
-  }
-}
-
-div.links .desc a {
-  color: inherit;
+<!-- links/@type = 'topic' and @style = '2column' -->
+div.links-divs {
+  margin-left: -10px;
+  margin-right: -10px;
 }
-div.links .desc a:hover {
-  color: </xsl:text><xsl:value-of select="$color.link"/><xsl:text>;
-}
-a.bold { font-weight: bold; }
-div.linkdiv { margin: 0; padding: 0; }
 a.linkdiv {
   display: block;
   margin: 0;
-  padding: 0.5em;
+  padding: 10px;
   border-bottom: none;
 }
 a.linkdiv:hover {
@@ -1284,17 +1291,27 @@ a.linkdiv > span.desc {
   color: </xsl:text><xsl:value-of select="$color.text_light"/><xsl:text>;
 }
 span.linkdiv-dash { display: none; }
- media only screen and (max-width: 400px) {
-  div.linkdiv {
-    margin-left: -12px;
-    margin-right: -12px;
-  }
-  div.linkdiv a {
-    padding-left: 12px;
-    padding-right: 12px;
+div.links-twocolumn {
+  display: flex;
+  flex-flow: row wrap;
+  align-items: stretch;
+  justify-content: flex-start;
+  vertical-align: top;
+  margin-left: -10px;
+  margin-right: -10px;
+}
+div.links-twocolumn > div.links-divs {
+  flex: 0 1 50%;
+  vertical-align: top;
+  margin: 0;
+}
+ media (max-width: 640px) {
+  div.links-twocolumn > div.links-divs {
+    flex: 0 1 100%;
   }
 }
 
+<!-- FIXME -->
 div.comment {
   padding: 0.5em;
   border: solid 2px </xsl:text>
@@ -1310,6 +1327,7 @@ div.comment div.cite {
   font-style: italic;
 }
 
+<!-- FIXME -->
 div.tree > div.inner > div.title { margin-bottom: 0.5em; }
 ul.tree {
   margin: 0; padding: 0;
@@ -1322,11 +1340,13 @@ ul.tree ul.tree {
 }
 div.tree-lines ul.tree { margin-left: 0; }
 
+<!-- FIXME -->
 span.hi {
   background-color: </xsl:text>
     <xsl:value-of select="$color.yellow_background"/><xsl:text>;
 }
 
+<!-- FIXME -->
 div.facets {
   display: inline-block;
   padding: 6px;
@@ -1351,6 +1371,8 @@ div.facet input {
   vertical-align: middle;
   margin: 0;
 }
+
+<!-- FIXME -->
 dt.gloss-term {
   margin-top: 1.2em;
   font-weight: bold;
@@ -1390,14 +1412,11 @@ span.gloss-desc {
     <xsl:value-of select="$color.yellow_background"/><xsl:text>;
   border: solid 1px </xsl:text>
     <xsl:value-of select="$color.yellow_border"/><xsl:text>;
-  -moz-box-shadow: 2px 2px 4px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
-  -webkit-box-shadow: 2px 2px 4px </xsl:text>
-    <xsl:value-of select="$color.gray_border"/><xsl:text>;
   box-shadow: 2px 2px 4px </xsl:text>
     <xsl:value-of select="$color.gray_border"/><xsl:text>;
 }
 
+<!-- conditional processing -->
 .if-if { display: none; }
 .if-choose, .if-when, .if-else { margin: 0; padding: 0; }
 .if-choose > .if-when { display: none; }
@@ -1405,7 +1424,7 @@ span.gloss-desc {
 .if-if.if__not-target-mobile { display: block; }
 .if-choose.if__not-target-mobile > .if-when { display: block; }
 .if-choose.if__not-target-mobile > .if-else { display: none; }
- media only screen and (max-width: 400px) {
+ media only screen and (max-width: 480px) {
   .if-if.if__target-mobile { display: block; }
   .if-if.if__not-target-mobile { display: none; }
   .if-choose.if__target-mobile > .if-when { display: block; }
[Date Prev][Date Next] [Thread Prev][Thread Next] [Thread Index] [Date Index] [Author Index]