Fix use of semantic HTML5 elements
All checks were successful
continuous-integration/drone/push Build is passing

Fixes #281
Fixes #282
This commit is contained in:
Reinhard Müller 2020-05-26 18:21:46 +02:00
parent 098b4ce99b
commit 1b01e753b9
6 changed files with 28 additions and 33 deletions

View File

@ -3,7 +3,7 @@
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template name="fsfe_followupsection">
<xsl:element name="section">
<xsl:element name="aside">
<xsl:attribute name="id">followup</xsl:attribute>
<!--
TODO Okay, so the idea here is to be able to display different "followup" boxes. I would suggest doing it like this:
@ -87,6 +87,6 @@
</xsl:otherwise>
</xsl:choose>
</xsl:element>
<!--/section#followup-->
<!--/aside#followup-->
</xsl:template>
</xsl:stylesheet>

View File

@ -6,11 +6,8 @@
<xsl:include href="fsfe_sidebar.xsl"/>
<xsl:template name="fsfe_mainsection">
<xsl:element name="section">
<xsl:attribute name="id">main</xsl:attribute>
<xsl:attribute name="role">main</xsl:attribute>
<xsl:element name="article">
<xsl:element name="main">
<xsl:element name="div">
<xsl:attribute name="id">content</xsl:attribute>
<xsl:if test="/buildinfo/document/body/@microformats">
<xsl:attribute name="class"><xsl:value-of select="/buildinfo/document/body/@microformats" /></xsl:attribute>

View File

@ -15,7 +15,6 @@
</xsl:element>
<xsl:element name="footer">
<xsl:attribute name="id">bottom</xsl:attribute>
<xsl:element name="div">
<xsl:attribute name="id">page-info</xsl:attribute>

View File

@ -4,7 +4,7 @@
<xsl:template name="translation_list">
<xsl:if test="not(/buildinfo/document/@external)">
<xsl:element name="div">
<xsl:element name="nav">
<xsl:attribute name="id">translations</xsl:attribute>
<xsl:attribute name="class">alert</xsl:attribute>

View File

@ -17,7 +17,7 @@ body {
font-family: "Roboto", sans-serif;
}
#followup {
aside#followup {
background: url(/graphics/ribbon.svg) no-repeat 100% -40px @body-bg;
text-shadow: rgb(255, 255, 255) 0 0 .5em;
@ -26,7 +26,7 @@ body {
}
}
#followup.join {
aside#followup.join {
background: url(/graphics/fellowship/ribbon_fellowship2.png) no-repeat 100% -30px @body-bg;
@media (min-width: @screen-sm-min) {
@ -214,7 +214,7 @@ body.overview #content {
background: url(/graphics/logov.svg) top left no-repeat;
}
#followup {
aside#followup {
background: url(/graphics/ribbonv.svg) no-repeat 100% -40px @body-bg;
@media (min-width: @screen-sm-min) {

View File

@ -135,8 +135,7 @@ h1, h2, h3, h4, .h1, .h2, .h3, .h4 {
// Translation selector
// ----------------------------------------------------------------------------
#translations {
.container;
nav#translations {
.collapse;
.fade;
background: @body-bg;
@ -167,7 +166,7 @@ h1, h2, h3, h4, .h1, .h2, .h3, .h4 {
}
}
.no-js #translations {
.no-js nav#translations {
.collapse.in;
.fade.in;
position: relative;
@ -346,19 +345,19 @@ div#notifications {
/* grid */
.article {
#content {
div#content {
.make-xs-column(12);
.make-md-column(8);
padding-left: 0;
}
#sidebar {
aside#sidebar {
.make-xs-column(12);
.make-md-column(4);
padding-right: 0;
}
}
#main, #followup {
main, aside#followup {
.container;
background: @body-bg;
margin: 1em auto;
@ -371,7 +370,7 @@ div#notifications {
}
}
#main {
main {
padding-top: 1em;
p {
@ -444,7 +443,7 @@ div#notifications {
}
}
#sidebar {
aside#sidebar {
color: @gray-light;
padding: 2em 0;
@ -505,7 +504,7 @@ div#notifications {
}
#content {
div#content {
aside {
@media (min-width: @screen-md-min) {
float: right;
@ -687,19 +686,19 @@ div#notifications {
.full-width {
/* For very particular pages where you need as wide as possible */
#main {
main {
width: 100%;
}
}
.frontpage, .subsite, .full-width {
#content {
div#content {
max-width: none;
}
}
.article {
#content {
div#content {
display: inline-block;
.p-name {
@ -928,7 +927,7 @@ section#related-news article.news:nth-of-type(n+2) {
// Followup boxes
// ----------------------------------------------------------------------------
#followup {
aside#followup {
.clearfix();
h2 {
@ -953,7 +952,7 @@ section#related-news article.news:nth-of-type(n+2) {
}
}
#followup.subscribe-nl {
aside#followup.subscribe-nl {
h2 {
.make-md-column(6);
.make-lg-column(5);
@ -966,7 +965,7 @@ section#related-news article.news:nth-of-type(n+2) {
}
@media (min-width: @screen-md-min) {
#followup.subscribe-nl {
aside#followup.subscribe-nl {
h2 {
margin: 0;
top: 5px;
@ -974,9 +973,9 @@ section#related-news article.news:nth-of-type(n+2) {
}
}
#followup.join,
#followup.support,
#followup.donate {
aside#followup.join,
aside#followup.support,
aside#followup.donate {
h2 {
.make-sm-column(4);
text-align: center;
@ -997,7 +996,7 @@ section#related-news article.news:nth-of-type(n+2) {
// Page footer
// ----------------------------------------------------------------------------
#direct-to-top {
nav#direct-to-top {
.container;
a {
@ -1012,7 +1011,7 @@ section#related-news article.news:nth-of-type(n+2) {
}
}
#bottom {
body > footer {
background: @body-bg;
box-shadow: 1em 0 1em 1em @body-bg;
margin: 40px 0 0 0;
@ -1023,7 +1022,7 @@ section#related-news article.news:nth-of-type(n+2) {
padding: 10px;
}
#page-info {
div#page-info {
.container;
// .make-row; can't use .container and .make-row on same element