Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Docs clean up - unnecessary role attributes, callout clarifications #15125

Merged
merged 3 commits into from
Nov 17, 2014
Merged

Docs clean up - unnecessary role attributes, callout clarifications #15125

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
27d9d35
Expand caveat for disabled fieldsets and links
patrickhlauke Nov 14, 2014
25cac1e
Redundant role="form" on <form>s
patrickhlauke Nov 14, 2014
bab3622
Redundant role="navigation" on <nav>s
patrickhlauke Nov 14, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions docs/_includes/components/input-groups.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ <h2 id="input-groups-basic">Basic example</h2>
<p>Place one add-on or button on either side of an input. You may also place one on both sides of an input.</p>
<p><strong class="text-danger">We do not support multiple add-ons on a single side.</strong></p>
<p><strong class="text-danger">We do not support multiple form-controls in a single input group.</strong></p>
<form class="bs-example bs-example-form" role="form">
<form class="bs-example bs-example-form">
<div class="input-group">
<span class="input-group-addon">@</span>
<input type="text" class="form-control" placeholder="Username">
Expand Down Expand Up @@ -59,7 +59,7 @@ <h2 id="input-groups-basic">Basic example</h2>

<h2 id="input-groups-sizing">Sizing</h2>
<p>Add the relative form sizing classes to the <code>.input-group</code> itself and contents within will automatically resize—no need for repeating the form control size classes on each element.</p>
<form class="bs-example bs-example-form" role="form">
<form class="bs-example bs-example-form">
<div class="input-group input-group-lg">
<span class="input-group-addon">@</span>
<input type="text" class="form-control" placeholder="Username">
Expand Down Expand Up @@ -182,7 +182,7 @@ <h2 id="input-groups-buttons">Button addons</h2>

<h2 id="input-groups-buttons-dropdowns">Buttons with dropdowns</h2>
<p></p>
<form class="bs-example bs-example-form" role="form">
<form class="bs-example bs-example-form">
<div class="row">
<div class="col-lg-6">
<div class="input-group">
Expand Down Expand Up @@ -252,7 +252,7 @@ <h2 id="input-groups-buttons-dropdowns">Buttons with dropdowns</h2>
{% endhighlight %}

<h2 id="input-groups-buttons-segmented">Segmented buttons</h2>
<form class="bs-example bs-example-form" role="form">
<form class="bs-example bs-example-form">
<div class="row">
<div class="col-lg-6">
<div class="input-group">
Expand Down
34 changes: 17 additions & 17 deletions docs/_includes/components/navbar.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,11 +25,11 @@ <h4>Changing the collapsed mobile navbar breakpoint</h4>
</div>
<div class="bs-callout bs-callout-warning" id="callout-navbar-role">
<h4>Make navbars accessible</h4>
<p>Be sure to add a <code>role="navigation"</code> to every navbar to help with accessibility.</p>
<p>Be sure to use a <code>&lt;nav&gt;</code> element or, if using a more generic element such as a <code>&lt;div&gt;</code>, add a <code>role="navigation"</code> to every navbar to explicitly identify it as a landmark region for users of assistive technologies.</p>
</div>

<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
Expand Down Expand Up @@ -84,7 +84,7 @@ <h4>Make navbars accessible</h4>
</nav>
</div>
{% highlight html %}
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
Expand Down Expand Up @@ -143,7 +143,7 @@ <h4>Make navbars accessible</h4>
<h2 id="navbar-brand-image">Brand image</h2>
<p>Replace the navbar brand with your own image by swapping the text for an <code>&lt;img&gt;</code>. Since the <code>.navbar-brand</code> has its own padding and height, you may need to override some CSS depending on your image.</p>
<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
Expand All @@ -154,7 +154,7 @@ <h2 id="navbar-brand-image">Brand image</h2>
</nav>
</div>
{% highlight html %}
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">
Expand All @@ -170,7 +170,7 @@ <h2 id="navbar-forms">Forms</h2>
<p>Place form content within <code>.navbar-form</code> for proper vertical alignment and collapsed behavior in narrow viewports. Use the alignment options to decide where it resides within the navbar content.</p>
<p>As a heads up, <code>.navbar-form</code> shares much of its code with <code>.form-inline</code> via mixin. <strong class="text-danger">Some form controls, like input groups, may require fixed widths to be show up properly within a navbar.</strong></p>
<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-2">
Expand Down Expand Up @@ -215,7 +215,7 @@ <h4>Always add labels</h4>
<h2 id="navbar-buttons">Buttons</h2>
<p>Add the <code>.navbar-btn</code> class to <code>&lt;button&gt;</code> elements not residing in a <code>&lt;form&gt;</code> to vertically center them in the navbar.</p>
<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-3">
Expand Down Expand Up @@ -244,7 +244,7 @@ <h4>Context-specific usage</h4>
<h2 id="navbar-text">Text</h2>
<p>Wrap strings of text in an element with <code>.navbar-text</code>, usually on a <code>&lt;p&gt;</code> tag for proper leading and color.</p>
<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-4">
Expand All @@ -269,7 +269,7 @@ <h2 id="navbar-text">Text</h2>
<h2 id="navbar-links">Non-nav links</h2>
<p>For folks using standard links that are not within the regular navbar navigation component, use the <code>.navbar-link</code> class to add the proper colors for the default and inverse navbar options.</p>
<div class="bs-example">
<nav class="navbar navbar-default" role="navigation">
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-5">
Expand Down Expand Up @@ -304,7 +304,7 @@ <h4>Right aligning multiple components</h4>
<h2 id="navbar-fixed-top">Fixed to top</h2>
<p>Add <code>.navbar-fixed-top</code> and include a <code>.container</code> or <code>.container-fluid</code> to center and pad navbar content.</p>
<div class="bs-example bs-navbar-top-example">
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<nav class="navbar navbar-default navbar-fixed-top">
<!-- We use the fluid option here to avoid overriding the fixed width of a normal container within the narrow content columns. -->
<div class="container-fluid">
<div class="navbar-header">
Expand All @@ -328,7 +328,7 @@ <h2 id="navbar-fixed-top">Fixed to top</h2>
</nav>
</div><!-- /example -->
{% highlight html %}
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
...
</div>
Expand All @@ -348,7 +348,7 @@ <h4>Body padding required</h4>
<h2 id="navbar-fixed-bottom">Fixed to bottom</h2>
<p>Add <code>.navbar-fixed-bottom</code> and include a <code>.container</code> or <code>.container-fluid</code> to center and pad navbar content.</p>
<div class="bs-example bs-navbar-bottom-example">
<nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
<nav class="navbar navbar-default navbar-fixed-bottom">
<!-- We use the fluid option here to avoid overriding the fixed width of a normal container within the narrow content columns. -->
<div class="container-fluid">
<div class="navbar-header">
Expand All @@ -372,7 +372,7 @@ <h2 id="navbar-fixed-bottom">Fixed to bottom</h2>
</nav>
</div><!-- /example -->
{% highlight html %}
<nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
<nav class="navbar navbar-default navbar-fixed-bottom">
<div class="container">
...
</div>
Expand All @@ -393,7 +393,7 @@ <h2 id="navbar-static-top">Static top</h2>
<p>Create a full-width navbar that scrolls away with the page by adding <code>.navbar-static-top</code> and include a <code>.container</code> or <code>.container-fluid</code> to center and pad navbar content.</p>
<p>Unlike the <code>.navbar-fixed-*</code> classes, you do not need to change any padding on the <code>body</code>.</p>
<div class="bs-example bs-navbar-top-example">
<nav class="navbar navbar-default navbar-static-top" role="navigation">
<nav class="navbar navbar-default navbar-static-top">
<!-- We use the fluid option here to avoid overriding the fixed width of a normal container within the narrow content columns. -->
<div class="container-fluid">
<div class="navbar-header">
Expand All @@ -418,7 +418,7 @@ <h2 id="navbar-static-top">Static top</h2>
</nav>
</div><!-- /example -->
{% highlight html %}
<nav class="navbar navbar-default navbar-static-top" role="navigation">
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
...
</div>
Expand All @@ -429,7 +429,7 @@ <h2 id="navbar-static-top">Static top</h2>
<h2 id="navbar-inverted">Inverted navbar</h2>
<p>Modify the look of the navbar by adding <code>.navbar-inverse</code>.</p>
<div class="bs-example">
<nav class="navbar navbar-inverse" role="navigation">
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
Expand All @@ -454,7 +454,7 @@ <h2 id="navbar-inverted">Inverted navbar</h2>
</nav>
</div><!-- /example -->
{% highlight html %}
<nav class="navbar navbar-inverse" role="navigation">
<nav class="navbar navbar-inverse">
...
</nav>
{% endhighlight %}
Expand Down
Loading