Skip to content

Loading…

Patch 6 -- Replace invalid use of legend tag #48

Closed
wants to merge 19 commits into from

2 participants

@jmjf

Problem:
In the_bootstrap_comment_form_default a legend element styles the comment form title. W3C says the legend element should only be used as the first child of a fieldset element. http://www.w3.org/TR/html-markup/legend.html

Changes:
Replace the legend element with span.legend.
Add .legend to style.css (copied from Bootstrap legend element style).

Warnings:
My git-foo is weak, so I may have packaged this wrong. Make sure the only changes coming with this pull are to functions.php (the_bootstrap_comment_form_defaults) and style.css (add .legend in classes section).

People who customize Bootstrap.css with non-standard font-size, line-height, color, etc. will need to override the default .legend styles.

This could create some challenges with the included Bootswatchr themes.

It is possible that the full .legend styling is not needed. For example, testing suggests the width, padding, and color attributes don't affect appearance. Removing these may prevent some of the potential Bootswatchr problems.

jmjf added some commits
@jmjf jmjf Update index.php
Add HTML5.1 main tag in place of div for role="main"
7e96148
@jmjf jmjf Update templates/_full_width.php
Add HTML5.1 main tag in place of div for role="main"
562dacc
@jmjf jmjf Update archive.php
Add HTML5.1 main tag in place of div for role="main"
e2830d9
@jmjf jmjf Update category.php
Add HTML5.1 main tag in place of div for role="main"
a2b608d
@jmjf jmjf Update single.php
Add HTML5.1 main tag in place of div for role="main"
feb78e7
@jmjf jmjf Update author.php
Add HTML5.1 main tag in place of div for role="main"
10cfc65
@jmjf jmjf Update page.php
Add HTML5.1 main tag in place of div for role="main"
53564d4
@jmjf jmjf Update 404.php
Add HTML5.1 main tag in place of div for role="main"
c677594
@jmjf jmjf Update search.php
Add HTML5.1 main tag in place of div for role="main"
5dc766a
@jmjf jmjf Update image.php
Add HTML5.1 main tag in place of div for role="main"
f7fc3aa
@jmjf jmjf Update tag.php
Add HTML5.1 main tag in place of div for role="main"
7873f9b
@jmjf jmjf Update js/html5shiv.min.js
Add support for HTML5.1 main element
ab69df0
@jmjf jmjf Update functions.php
Remove legend tag used outside fieldset.
5e0b517
@jmjf jmjf Update style.css
Add legend class to apply to span in comment header (that replaced invalid use of legend tag).
7b856fa
@jmjf jmjf Update style.css b22122a
@jmjf jmjf Update functions.php db36407
@jmjf jmjf Update functions.php
In the_bootstrap_comment_form_defaults, the legend element is used as a child of an h3 element (presumably for styling). According to W3C, legend is only valid as the first child of a fieldset. http://www.w3.org/TR/html-markup/legend.html The HTML it throwing validator errors as a result.

Replace the legend element with span.legend so it can be styled.
42330e8
@jmjf jmjf Update functions.php 8de8f95
@jmjf jmjf Update style.css
Add legend class so span on the comment form title can be styled.
11b9591
@obenland obenland closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Commits on Feb 5, 2013
  1. @jmjf

    Update index.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  2. @jmjf

    Update templates/_full_width.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  3. @jmjf

    Update archive.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  4. @jmjf

    Update category.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  5. @jmjf

    Update single.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  6. @jmjf

    Update author.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  7. @jmjf

    Update page.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  8. @jmjf

    Update 404.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  9. @jmjf

    Update search.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  10. @jmjf

    Update image.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  11. @jmjf

    Update tag.php

    jmjf committed
    Add HTML5.1 main tag in place of div for role="main"
  12. @jmjf

    Update js/html5shiv.min.js

    jmjf committed
    Add support for HTML5.1 main element
Commits on Feb 8, 2013
  1. @jmjf

    Update functions.php

    jmjf committed
    Remove legend tag used outside fieldset.
  2. @jmjf

    Update style.css

    jmjf committed
    Add legend class to apply to span in comment header (that replaced invalid use of legend tag).
  3. @jmjf

    Update style.css

    jmjf committed
  4. @jmjf

    Update functions.php

    jmjf committed
  5. @jmjf

    Update functions.php

    jmjf committed
    In the_bootstrap_comment_form_defaults, the legend element is used as a child of an h3 element (presumably for styling). According to W3C, legend is only valid as the first child of a fieldset. http://www.w3.org/TR/html-markup/legend.html The HTML it throwing validator errors as a result.
    
    Replace the legend element with span.legend so it can be styled.
  6. @jmjf

    Update functions.php

    jmjf committed
  7. @jmjf

    Update style.css

    jmjf committed
    Add legend class so span on the comment form title can be styled.
Showing with 49 additions and 42 deletions.
  1. +3 −3 404.php
  2. +3 −3 archive.php
  3. +3 −3 author.php
  4. +3 −3 category.php
  5. +3 −3 functions.php
  6. +3 −3 image.php
  7. +3 −3 index.php
  8. +1 −5 js/html5shiv.min.js
  9. +3 −3 page.php
  10. +3 −3 search.php
  11. +3 −3 single.php
  12. +12 −1 style.css
  13. +3 −3 tag.php
  14. +3 −3 templates/_full_width.php
View
6 404.php
@@ -13,7 +13,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top(); ?>
<?php tha_entry_before(); ?>
@@ -51,7 +51,7 @@
<?php tha_entry_after(); ?>
<?php tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -61,4 +61,4 @@
/* End of file 404.php */
-/* Location: ./wp-content/themes/the-bootstrap/404.php */
+/* Location: ./wp-content/themes/the-bootstrap/404.php */
View
6 archive.php
@@ -18,7 +18,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) : ?>
@@ -49,7 +49,7 @@
endif;
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -59,4 +59,4 @@
/* End of file archive.php */
-/* Location: ./wp-content/themes/the-bootstrap/archive.php */
+/* Location: ./wp-content/themes/the-bootstrap/archive.php */
View
6 author.php
@@ -13,7 +13,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) :
@@ -48,7 +48,7 @@
endif;
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -58,4 +58,4 @@
/* End of file author.php */
-/* Location: ./wp-content/themes/the-bootstrap/author.php */
+/* Location: ./wp-content/themes/the-bootstrap/author.php */
View
6 category.php
@@ -13,7 +13,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) : ?>
@@ -39,7 +39,7 @@
endif;
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -49,4 +49,4 @@
/* End of file index.php */
-/* Location: ./wp-content/themes/the-bootstrap/category.php */
+/* Location: ./wp-content/themes/the-bootstrap/category.php */
View
6 functions.php
@@ -561,8 +561,8 @@ function the_bootstrap_comment_form_defaults( $defaults ) {
'comment_notes_before' => '',
'comment_notes_after' => '<div class="form-allowed-tags control-group"><label class="control-label">' . sprintf( __( 'You may use these <abbr title="HyperText Markup Language">HTML</abbr> tags and attributes: %s', 'the-bootstrap' ), '</label><div class="controls"><pre>' . allowed_tags() . '</pre></div>' ) . '</div>
<div class="form-actions">',
- 'title_reply' => '<legend>' . __( 'Leave a reply', 'the-bootstrap' ) . '</legend>',
- 'title_reply_to' => '<legend>' . __( 'Leave a reply to %s', 'the-bootstrap' ). '</legend>',
+ 'title_reply' => '<span class="legend">' . __( 'Leave a reply', 'the-bootstrap' ) . '</span>',
+ 'title_reply_to' => '<span class="legend">' . __( 'Leave a reply to %s', 'the-bootstrap' ). '</span>',
'must_log_in' => '<div class="must-log-in control-group controls">' . sprintf( __( 'You must be <a href="%s">logged in</a> to post a comment.', 'the-bootstrap' ), wp_login_url( apply_filters( 'the_permalink', get_permalink( get_the_ID() ) ) ) ) . '</div>',
'logged_in_as' => '<div class="logged-in-as control-group controls">' . sprintf( __( 'Logged in as <a href="%1$s">%2$s</a>. <a href="%3$s" title="Log out of this account">Log out?</a>', 'the-bootstrap' ), admin_url( 'profile.php' ), wp_get_current_user()->display_name, wp_logout_url( apply_filters( 'the_permalink', get_permalink( get_the_ID() ) ) ) ) . '</div>',
), $defaults );
@@ -1078,4 +1078,4 @@ function _the_bootstrap_version() {
/* End of file functions.php */
-/* Location: ./wp-content/themes/the-bootstrap/functions.php */
+/* Location: ./wp-content/themes/the-bootstrap/functions.php */
View
6 image.php
@@ -33,7 +33,7 @@
<section id="primary" class="image-attachment span12">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top(); ?>
<nav id="nav-single" class="well clearfix">
@@ -101,7 +101,7 @@
<?php tha_entry_after(); ?>
<?php tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
<div id="attachment-comment" class="span8"><?php comments_template(); ?></div>
@@ -111,4 +111,4 @@
/* End of file image.php */
-/* Location: ./wp-content/themes/the-bootstrap/image.php */
+/* Location: ./wp-content/themes/the-bootstrap/image.php */
View
6 index.php
@@ -18,7 +18,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) {
@@ -33,7 +33,7 @@
}
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -43,4 +43,4 @@
/* End of file index.php */
-/* Location: ./wp-content/themes/the-bootstrap/index.php */
+/* Location: ./wp-content/themes/the-bootstrap/index.php */
View
6 js/html5shiv.min.js
@@ -1,5 +1 @@
-(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
-a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/\w+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}</style>";
-c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
-"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);if(g)return a.createDocumentFragment();
-for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
+(function(e,t){function c(e,t){var n=e.createElement("p"),r=e.getElementsByTagName("head")[0]||e.documentElement;n.innerHTML="x<style>"+t+"</style>";return r.insertBefore(n.lastChild,r.firstChild)}function h(){var e=y.elements;return typeof e=="string"?e.split(" "):e}function p(e){var t=f[e[u]];if(!t){t={};a++;e[u]=a;f[a]=t}return t}function d(e,n,r){if(!n){n=t}if(l){return n.createElement(e)}if(!r){r=p(n)}var o;if(r.cache[e]){o=r.cache[e].cloneNode()}else if(s.test(e)){o=(r.cache[e]=r.createElem(e)).cloneNode()}else{o=r.createElem(e)}return o.canHaveChildren&&!i.test(e)?r.frag.appendChild(o):o}function v(e,n){if(!e){e=t}if(l){return e.createDocumentFragment()}n=n||p(e);var r=n.frag.cloneNode(),i=0,s=h(),o=s.length;for(;i<o;i++){r.createElement(s[i])}return r}function m(e,t){if(!t.cache){t.cache={};t.createElem=e.createElement;t.createFrag=e.createDocumentFragment;t.frag=t.createFrag()}e.createElement=function(n){if(!y.shivMethods){return t.createElem(n)}return d(n,e,t)};e.createDocumentFragment=Function("h,f","return function(){"+"var n=f.cloneNode(),c=n.createElement;"+"h.shivMethods&&("+h().join().replace(/\w+/g,function(e){t.createElem(e);t.frag.createElement(e);return'c("'+e+'")'})+");return n}")(y,t.frag)}function g(e){if(!e){e=t}var n=p(e);if(y.shivCSS&&!o&&!n.hasCSS){n.hasCSS=!!c(e,"article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}"+"mark{background:#FF0;color:#000}")}if(!l){m(e,n)}return e}function S(e){var t,n=e.getElementsByTagName("*"),r=n.length,i=RegExp("^(?:"+h().join("|")+")$","i"),s=[];while(r--){t=n[r];if(i.test(t.nodeName)){s.push(t.applyElement(x(t)))}}return s}function x(e){var t,n=e.attributes,r=n.length,i=e.ownerDocument.createElement(w+":"+e.nodeName);while(r--){t=n[r];t.specified&&i.setAttribute(t.nodeName,t.nodeValue)}i.style.cssText=e.style.cssText;return i}function T(e){var t,n=e.split("{"),r=n.length,i=RegExp("(^|[\\s,>+~])("+h().join("|")+")(?=[[\\s,>+~#.:]|$)","gi"),s="$1"+w+"\\:$2";while(r--){t=n[r]=n[r].split("}");t[t.length-1]=t[t.length-1].replace(i,s);n[r]=t.join("}")}return n.join("{")}function N(e){var t=e.length;while(t--){e[t].removeNode()}}function C(e){function o(){clearTimeout(r._removeSheetTimer);if(t){t.removeNode(true)}t=null}var t,n,r=p(e),i=e.namespaces,s=e.parentWindow;if(!E||e.printShived){return e}if(typeof i[w]=="undefined"){i.add(w)}s.attachEvent("onbeforeprint",function(){o();var r,i,s,u=e.styleSheets,a=[],f=u.length,l=Array(f);while(f--){l[f]=u[f]}while(s=l.pop()){if(!s.disabled&&b.test(s.media)){try{r=s.imports;i=r.length}catch(h){i=0}for(f=0;f<i;f++){l.push(r[f])}try{a.push(s.cssText)}catch(h){}}}a=T(a.reverse().join(""));n=S(e);t=c(e,a)});s.attachEvent("onafterprint",function(){N(n);clearTimeout(r._removeSheetTimer);r._removeSheetTimer=setTimeout(o,500)});e.printShived=true;return e}var n="3.6.2pre";var r=e.html5||{};var i=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i;var s=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i;var o;var u="_html5shiv";var a=0;var f={};var l;(function(){try{var e=t.createElement("a");e.innerHTML="<xyz></xyz>";o="hidden"in e;l=e.childNodes.length==1||function(){t.createElement("a");var e=t.createDocumentFragment();return typeof e.cloneNode=="undefined"||typeof e.createDocumentFragment=="undefined"||typeof e.createElement=="undefined"}()}catch(n){o=true;l=true}})();var y={elements:r.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup main mark meter nav output progress section summary time video",version:n,shivCSS:r.shivCSS!==false,supportsUnknownElements:l,shivMethods:r.shivMethods!==false,type:"default",shivDocument:g,createElement:d,createDocumentFragment:v};e.html5=y;g(t);var b=/^$|\b(?:all|print)\b/;var w="html5shiv";var E=!l&&function(){var n=t.documentElement;return!(typeof t.namespaces=="undefined"||typeof t.parentWindow=="undefined"||typeof n.applyElement=="undefined"||typeof n.removeNode=="undefined"||typeof e.attachEvent=="undefined")}();y.type+=" print";y.shivPrint=C;C(t)})(this,document)
View
6 page.php
@@ -17,7 +17,7 @@
<div id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
the_post();
@@ -25,7 +25,7 @@
comments_template();
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</div><!-- #primary -->
@@ -35,4 +35,4 @@
/* End of file page.php */
-/* Location: ./wp-content/themes/the-bootstrap/page.php */
+/* Location: ./wp-content/themes/the-bootstrap/page.php */
View
6 search.php
@@ -12,7 +12,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) : ?>
@@ -32,7 +32,7 @@
endif;
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -42,4 +42,4 @@
/* End of file search.php */
-/* Location: ./wp-content/themes/the-bootstrap/search.php */
+/* Location: ./wp-content/themes/the-bootstrap/search.php */
View
6 single.php
@@ -13,7 +13,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
while ( have_posts() ) {
@@ -29,7 +29,7 @@
</nav><!-- #nav-single -->
<?php tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -39,4 +39,4 @@
/* End of file index.php */
-/* Location: ./wp-content/themes/the-bootstrap/single.php */
+/* Location: ./wp-content/themes/the-bootstrap/single.php */
View
13 style.css
@@ -77,6 +77,17 @@ body > .container {
display: block;
}
+.legend {
+ display: block;
+ width: 100%;
+ padding: 0;
+ margin-bottom: 20px;
+ font-size: 21px;
+ line-height: 40px;
+ color: #333333;
+ border: 0;
+ border-bottom: 1px solid #e5e5e5;
+}
/* =Page
-------------------------------------------------------------- */
@@ -458,4 +469,4 @@ table .label {
/* End of file style.css */
-/* Location: ./wp-content/themes/the-bootstrap/style.css */
+/* Location: ./wp-content/themes/the-bootstrap/style.css */
View
6 tag.php
@@ -13,7 +13,7 @@
<section id="primary" class="span8">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
if ( have_posts() ) : ?>
@@ -39,7 +39,7 @@
endif;
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -49,4 +49,4 @@
/* End of file index.php */
-/* Location: ./wp-content/themes/the-bootstrap/tag.php */
+/* Location: ./wp-content/themes/the-bootstrap/tag.php */
View
6 templates/_full_width.php
@@ -12,7 +12,7 @@
<section id="primary" class="span12">
<?php tha_content_before(); ?>
- <div id="content" role="main">
+ <main id="content" role="main">
<?php tha_content_top();
the_post();
@@ -20,7 +20,7 @@
comments_template( '', true );
tha_content_bottom(); ?>
- </div><!-- #content -->
+ </main><!-- #content -->
<?php tha_content_after(); ?>
</section><!-- #primary -->
@@ -29,4 +29,4 @@
/* End of file _full_width.php */
-/* Location: ./wp-content/themes/the-bootstrap/_full_width.php */
+/* Location: ./wp-content/themes/the-bootstrap/_full_width.php */
Something went wrong with that request. Please try again.