First draft of layout changes for results page on pa11y dashboard.

This commit is contained in:
Sangita Mane
2021-10-28 18:01:23 +02:00
parent 4c0bd924ab
commit bb0491858b
6 changed files with 77 additions and 100 deletions

View File

@@ -15,56 +15,18 @@ You should have received a copy of the GNU General Public License
along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
}}
<div class="col-md-3 aside">
<div class="row">
<div class="action-buttons col-md-12 col-sm-6">
<div class="row">
<div class="col-md-12 col-sm-6 col-xs-12">
<a href="{{mainResult.hrefCsv}}" class="btn-full-width btn btn-default" data-test="download-csv">
Download CSV <span class="glyphicon glyphicon-download" aria-hidden="true"></span>
</a>
</div>
<div class="col-md-12 col-sm-6 col-xs-12">
<a href="{{mainResult.hrefJson}}" class="btn-full-width btn btn-default" data-test="download-json">
Download JSON <span class="glyphicon glyphicon-download" aria-hidden="true"></span>
</a>
</div>
</div>
</div>
<section class="col-md-12">
<h2 id="tabSectionHeading" class="crunch-top">Results for {{date-format task.lastResult.date format="DD MMM YYYY"}}</h2>
<div class="results-download">
<a href="{{mainResult.hrefCsv}}" class="btn btn-default" data-test="download-csv">
Download CSV <span class="glyphicon glyphicon-download" aria-hidden="true"></span>
</a>
<a href="{{mainResult.hrefJson}}" class="btn btn-default" data-test="download-json">
Download JSON <span class="glyphicon glyphicon-download" aria-hidden="true"></span>
</a>
</div>
<div class="row date-selector-row">
<div id="top" class="col-md-12 col-sm-12 clearfix">
<div class="well dark-well">
<div class="date-selector">
<div class="btn-group block-level clearfix">
<h2 class="h4">
<span class="glyphicon glyphicon-calendar" aria-hidden="true"></span>&nbsp;&nbsp;{{date-format task.lastResult.date format="DD MMM YYYY"}}
</h2>
<h3 class="h5 show-stats" id="dates-navigation">Select a date to show stats for:</h3>
<nav aria-labelledby="dates-navigation">
<ul class="dates-list">
{{#results}}
<li><a class="" href="{{href}}">{{date-format date format="DD MMM YYYY"}}</a></li>
{{/results}}
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12 clearfix">
<div class="well">
<h4 class="crunch-top">View results in browser</h4>
<p class="crunch-bottom">Pa11y uses HTML_CodeSniffer to find accessibility issues. <a href="http://squizlabs.github.io/HTML_CodeSniffer/">Use their bookmarklet</a> to view results on the page you are testing.</p>
</div>
</div>
</div>
</div>
<div class="col-md-9">
<ul class="nav nav-tabs category-list" role="tablist">
<ul id="top" class="nav nav-tabs category-list">
<li class="category-list__item category-list__item_type_error active" role="presentation">
<a class="category-list__link" id="errors" href="#errors-list" aria-controls="errors-list" role="tab" data-toggle="tab" data-test="task-errors">
Errors ( {{mainResult.count.error}} )
@@ -322,5 +284,9 @@ along with Pa11y Dashboard. If not, see <http://www.gnu.org/licenses/>.
<div class="text">You have no ignored rules.</div>
{{/if}}
</div>
</div>
<div class="well">
<h3 class="crunch-top h3">View results in browser</h3>
<p class="crunch-bottom">Pa11y uses HTML_CodeSniffer to find accessibility issues. <a href="http://squizlabs.github.io/HTML_CodeSniffer/">Use their bookmarklet</a> to view results on the page you are testing.</p>
</div>
</div>
</section>