Correct the support for xref page with CSS

Author: fsteimke

src/guide/xml/ch02.xml

@@ -1086,7 +1086,7 @@ xrefstyle="%c"/>.</para>
 
 <informaltable frame="all">
   <tgroup cols="3" rowsep="1" colsep="1">
-    <colspec colname="c1" colwidth="2*" rowsep="1"/>
+    <colspec colname="c1" colwidth="1*" rowsep="1"/>
     <colspec colname="c2" colwidth="1*" rowsep="1"/>
     <colspec colname="c3" colwidth="2*" rowsep="1"/>
 
@@ -1122,10 +1122,7 @@ xrefstyle="%c"/>.</para>
       <row>
         <entry><code>%p</code></entry>
         <entry><phrase outputformat="print"><xref linkend="syntax-highlighting" xrefstyle="%p"/></phrase></entry>
-        <entry>Page number. Intended for print output (PDF). Displayed as <emphasis>"#"</emphasis> in HTML,
-              unless you differentiate between the output formats for print and online. See <xref
-                linkend="using-pagenumber-in-crossreferences" xrefstyle="%label"/> for a possible
-              solution.</entry>
+        <entry>Page number in print output (PDF). Not displayed in HTML.</entry>
       </row>
       <row>
         <entry><code>%label (%c)</code></entry>
@@ -1149,7 +1146,7 @@ xrefstyle="%c"/>.</para>
 
   <informaltable frame="all">
     <tgroup cols="3" colsep="1" rowsep="1">
-      <colspec colname="c1" colwidth="2*" rowsep="1"/>
+      <colspec colname="c1" colwidth="1*" rowsep="1"/>
       <colspec colname="c2" colwidth="1*" rowsep="1"/>
       <colspec colname="c3" colwidth="2*" rowsep="1"/>
 
@@ -1177,36 +1174,6 @@ xrefstyle="%c"/>.</para>
       </tbody>
     </tgroup>
   </informaltable>
-
-  <section xml:id="using-pagenumber-in-crossreferences">
-    <title>Using pagenumber in cross-references</title>
-    <para>The <code>%p</code> makes little sense in HTML output, since there are no page numbers.
-      If you use it anyway, it will be displayed as <emphasis>"#"</emphasis>, which can be
-      confusing for readers. A possible solution for this problem is the use of the
-        <code>outputformat</code> attribute, that was intoduced in <xref linkend="profiling"/> and
-        <xref linkend="table.effectivity-attributes" xrefstyle="%label"/><phrase
-        outputformat="print"> on page <xref linkend="table.effectivity-attributes" xrefstyle="%p"
-        /></phrase>.</para>
-    
-    <para><emphasis>This</emphasis> cross reference to <xref linkend="syntax-highlighting"
-        xrefstyle="%label"/>
-      <phrase outputformat="print"> on <xref linkend="syntax-highlighting" xrefstyle="page %p"
-        /></phrase> will include the target`s page number only when the
-        <code>@profile.outputformat</code> parameter is <emphasis>"print"</emphasis>, but without
-      the annoying <emphasis>#</emphasis> in HTML.</para>
-    
-    <example>
-      <title>Use outputformat to deal with page numbers in cross references</title>
-      <programlisting>This cross reference to 
-&lt;xref linkend=&quot;syntax-highlighting&quot;  xrefstyle="%label/&gt;
-&lt;phrase outputformat=&quot;print&quot;&gt; 
-  on &lt;xref linkend=&quot;syntax-highlighting&quot; xrefstyle=&quot;page %p&quot;/&gt;
-&lt;/phrase&gt;
-will reference the page number only when the
-@profile.outputformat parameter is print, but
-without the annoying # in HTML.</programlisting>
-    </example>
-  </section>
 </section>
 
 <section xml:id="syntax-highlighting">

src/main/scss/media-all.scss

@@ -359,11 +359,6 @@ a.pmuj {
     font-style: italic;
 }
 
-.xref-pagenum {
-    content: target-counter(attr(href), page);
-    font-style:normal;
-}
-
 .xref-area,
 .xref-areaset,
 .xref-co,

src/main/scss/media-paged.scss

@@ -211,3 +211,10 @@ span.footnote p {
     padding-top: 0;
     margin-top: 0;
 }
+
+/* xref with pagenumber ====================================== */
+
+.xref-pagenum::after {
+    content: target-counter(attr(href), page);
+    font-style:normal;
+}

src/main/scss/media-screen.scss

@@ -478,4 +478,4 @@ nav.top div {
     nav.bottom table .next {
         padding-right: 1rem;
     }
-}
+}

src/main/xslt/modules/links.xsl

@@ -245,7 +245,7 @@
                           group-adjacent=". instance of node() and local-name() = ('pagenum')">
         <xsl:choose>
           <xsl:when test="boolean(current-grouping-key())">
-            <a href="#{f:id($target)}" class="xref xref-{local-name($target)} xref-{local-name(.)}">#</a>
+            <a href="#{f:id($target)}" class="xref xref-{local-name($target)} xref-{local-name(.)}"/>
           </xsl:when>
           <xsl:otherwise>
             <a href="#{f:id($target)}" class="xref xref-{local-name($target)}">