Skip to content

Commit

Permalink
Reposition In Brief content (#3867)
Browse files Browse the repository at this point in the history
  • Loading branch information
iadawn committed Jun 6, 2024
1 parent f741aaa commit 0bf98c8
Show file tree
Hide file tree
Showing 5 changed files with 48 additions and 47 deletions.
14 changes: 14 additions & 0 deletions css/base.css
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,13 @@ h2:hover .fragmentlink svg {
visibility: visible;
}

#success-criterion h2, #guideline h2, #technique h2 {
margin: 0;
}

.navtoc ul {
margin: 0.5em 0;
}

dt div {
font-weight: normal;
Expand Down Expand Up @@ -379,4 +386,11 @@ margin-right:.8em;
#examples video
{
max-width: 100%;
}

#brief {
margin-bottom: 3em;
}
#brief dl {
margin-left: 2em;
}
10 changes: 5 additions & 5 deletions techniques/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,9 @@

<div class="default-grid with-gap leftcol">
<aside class="box nav-hack sidebar standalone-resource__sidebar ">
<nav>
<header class="box-h ">Page Contents</header>
<div class="box-i">
<header class="box-h ">Page Contents</header>
<div class="box-i">
<nav aria-label="page contents" class="navtoc">
<ul>
<li><a href="#aria">ARIA Techniques</a></li>
<li><a href="#client-side-script">Client-Side Script Techniques</a></li>
Expand All @@ -29,8 +29,8 @@
<li><a href="#text">Plain-Text Techniques</a></li>
<li><a href="#changelog">Change Log</a></li>
</ul>
</div>
</nav>
</nav>
</div>
</aside>

<main id="main" class="main-content standalone-resource__main">
Expand Down
10 changes: 5 additions & 5 deletions understanding/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,18 +13,18 @@

<div class="default-grid with-gap leftcol">
<aside class="box nav-hack sidebar standalone-resource__sidebar ">
<nav>
<header class="box-h ">Page Contents</header>
<div class="box-i">
<header class="box-h ">Page Contents</header>
<div class="box-i">
<nav aria-label="page contents" class="navtoc">
<ul>
<li><a href="#perceivable">Perceivable</a></li>
<li><a href="#operable">Operable</a></li>
<li><a href="#understandable">Understandable</a></li>
<li><a href="#robust">Robust</a></li>
<li><a href="#other">Other Understanding Documents</a></li>
</ul>
</div>
</nav>
</nav>
</div>
</aside>

<main id="main" class="main-content standalone-resource__main">
Expand Down
21 changes: 10 additions & 11 deletions xslt/generate-techniques.xslt
Original file line number Diff line number Diff line change
Expand Up @@ -91,9 +91,10 @@

<xsl:template name="navtoc">
<xsl:param name="meta" tunnel="yes"/>
<nav class="navtoc">
<ul id="navbar">
<nav aria-label="page contents" class="navtoc">
<ul>
<!-- <li><a href="#important-information">Important Information about Techniques</a></li> -->
<li><a href="#technique">About this Technique</a></li>
<li><a href="#applicability">Applicability</a></li>
<li><a href="#description">Description</a></li>
<xsl:if test="wcag:section-meaningfully-exists('examples', //html:section[@id = 'examples'])"><li><a href="#examples">Examples</a></li></xsl:if>
Expand Down Expand Up @@ -246,10 +247,10 @@
</xsl:template>

<xsl:template name="most-important-meta">
<aside class="box">
<header class="box-h box-h-icon">
<aside id="technique" class="box">
<h2 class="box-h box-h-icon">
About this Technique
</header>
</h2>
<div class="box-i">
<xsl:call-template name="about-this-technique"/>
</div>
Expand All @@ -271,12 +272,10 @@

<xsl:template name="sidebar">
<aside class="box nav-hack sidebar standalone-resource__sidebar" aria-labelledby="page-contents">
<nav>
<header class="box-h" id="page-contents">Page Contents</header>
<div class="box-i">
<xsl:call-template name="navtoc"/>
</div>
</nav>
<header class="box-h" id="page-contents">Page Contents</header>
<div class="box-i">
<xsl:call-template name="navtoc"/>
</div>
</aside>
</xsl:template>

Expand Down
40 changes: 14 additions & 26 deletions xslt/generate-understanding.xslt
Original file line number Diff line number Diff line change
Expand Up @@ -665,13 +665,17 @@

<xsl:template name="navtoc">
<xsl:param name="meta" tunnel="yes"/>
<nav aria-label="page contents" class="navtoc">
<ul>
<xsl:if test="name($meta) = 'success-criterion'">
<xsl:if test="wcag:section-meaningfully-exists('brief', //html:section[@id = 'brief'])">
<li>
<a href="#brief">In Brief</a>
</li>
</xsl:if>
<li>
<a href="#success-criterion">Success Criterion</a>
</li>
<li>
<a href="#intent">Intent</a>
</li>
Expand Down Expand Up @@ -729,6 +733,7 @@
<li><a href="#test-rules">Test Rules</a></li>
</xsl:if>
</ul>
</nav>
</xsl:template>


Expand Down Expand Up @@ -910,19 +915,19 @@
</h1>
<xsl:choose>
<xsl:when test="name($meta) = 'guideline' or name($meta) = 'success-criterion'">
<aside class="box">
<header class="box-h box-h-icon">
<xsl:apply-templates select="//html:section[@id = 'brief']"/>
<section id="{name($meta)}" class="box">
<h2 class="box-h box-h-icon">
<xsl:choose>
<xsl:when test="name($meta) = 'guideline'">Guideline </xsl:when>
<xsl:when test="name($meta) = 'success-criterion'">Success Criterion (SC) </xsl:when>
</xsl:choose></header>
</xsl:choose></h2>
<div class="box-i">
<xsl:apply-templates select="$meta/content/html:*" />
</div>
</aside>
</section>
<div class="excol-all"/>
<xsl:apply-templates select="//html:section[@id = 'status']"/>
<xsl:apply-templates select="//html:section[@id = 'brief']"/>
<xsl:apply-templates select="//html:section[@id = 'intent']"/>
<xsl:apply-templates select="//html:section[@id = 'benefits']"/>
<xsl:apply-templates select="//html:section[@id = 'examples']"/>
Expand Down Expand Up @@ -962,27 +967,10 @@
<xsl:template name="sidebar">
<xsl:param name="meta" tunnel="yes"/>
<aside class="box nav-hack sidebar standalone-resource__sidebar ">
<!--
<nav>
<h2 style="margin-top: 0; margin-bottom: 0; padding-bottom: 0; font-size: 1rem" id="about-this-page">Navigation</h2>
<ul>
<xsl:call-template name="prevnext">
<xsl:with-param name="which">side</xsl:with-param>
</xsl:call-template>
</ul>
</nav>
-->
<nav>
<header class="box-h ">Page Contents</header>
<div class="box-i">
<xsl:call-template name="navtoc"/>
</div>
</nav>
<!--
<p>
<em>This Understanding document is not normative, which means it is <a href="about"> not required to meet WCAG</a>.</em>
</p>
-->
<header class="box-h ">Page Contents</header>
<div class="box-i">
<xsl:call-template name="navtoc"/>
</div>
</aside>
</xsl:template>

Expand Down

0 comments on commit 0bf98c8

Please sign in to comment.