arona/PyRIGS
1
0
Fork 0
mirror of https://github.com/nottinghamtec/PyRIGS.git synced 2026-02-20 21:39:41 +00:00
Code Issues Projects Releases Wiki Activity

Add a skip link for keyboard users

Browse Source 
Someone might use it...
This commit is contained in:
FreneticScribbler
2020-03-18 15:07:29 +00:00
parent e42989637e
commit 264b306b2f
7 changed files with 56 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
RIGS/static/css/screen.css
View File

File diff suppressed because one or more lines are too long

16
RIGS/static/scss/screen.scss
View File

@@ -78,6 +78,22 @@ ins {
color: $gray-400 !important; color: $gray-400 !important;
} }
.skip-link {
background: $info;
color: $white;
outline: unset;
height: 30px;
left: 50%;
padding: 8px;
position: absolute;
transform: translateY(-100%);
transition: transform 0.3s;
}
.skip-link:focus {
transform: translateY(0%);
}
html.embedded { html.embedded {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

0
templates/base_rigs.html → RIGS/templates/base_rigs.html
View File

4
RIGS/templates/event_form.html
View File

@@ -92,8 +92,8 @@
.attr({type : 'text/css', rel : 'stylesheet'}) .attr({type : 'text/css', rel : 'stylesheet'})
.attr('href', '{% static "css/bootstrap-datetimepicker.min.css" %}'); .attr('href', '{% static "css/bootstrap-datetimepicker.min.css" %}');
$.when( $.when(
$.getScript( "{% static "js/moment.min.js" %}" ), $.getScript( "{% static "js/moment.js" %}" ),
$.getScript( "{% static "js/bootstrap-datetimepicker.min.js" %}" ), $.getScript( "{% static "js/bootstrap-datetimepicker.js" %}" ),
$.Deferred(function( deferred ){ $.Deferred(function( deferred ){
$( deferred.resolve ); $( deferred.resolve );
}) })

18
assets/templates/asset_activity_table.html
View File

@@ -10,7 +10,7 @@
{% block js %} {% block js %}
<script src="{% static "js/tooltip.js" %}"></script> <script src="{% static "js/tooltip.js" %}"></script>
<script src="{% static "js/popover.js" %}"></script> <script src="{% static "js/popover.js" %}"></script>
<script src="{% static "js/moment.min.js" %}"></script> <script src="{% static "js/moment.js" %}"></script>
<script> <script>
$(function () { $(function () {
$('[data-toggle="popover"]').popover().click(function(){ $('[data-toggle="popover"]').popover().click(function(){
@@ -18,28 +18,12 @@
window.location.href = $(this).attr('href'); window.location.href = $(this).attr('href');
} }
}); });
// This keeps timeago values correct, but uses an insane amount of resources
// $(function () {
// setInterval(function() {
// $('.date').each(function (index, dateElem) {
// var $dateElem = $(dateElem);
// var formatted = moment($dateElem.attr('data-date')).fromNow();
// $dateElem.text(formatted);
// })
// });
// }, 10000);
$('.date').each(function (index, dateElem) { $('.date').each(function (index, dateElem) {
var $dateElem = $(dateElem); var $dateElem = $(dateElem);
var formatted = moment($dateElem.attr('data-date')).fromNow(); var formatted = moment($dateElem.attr('data-date')).fromNow();
$dateElem.text(formatted); $dateElem.text(formatted);
}); });
}) })
</script> </script>
{% endblock %} {% endblock %}

0
templates/base_assets.html → assets/templates/base_assets.html
View File

10
templates/base.html
View File

@@ -31,9 +31,10 @@
</head> </head>
<body> <body>
<a class="skip-link" href='#main'>Skip to content</a>
{% include "analytics.html" %} {% include "analytics.html" %}
{% block navbar %} {% block navbar %}
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark" role="navigation"> <nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark" role="navigation">
<div class="container"> <div class="container">
{% block titleheader %} {% block titleheader %}
{% endblock %} {% endblock %}
@@ -47,10 +48,9 @@
</ul> </ul>
</div> </div>
</div> </div>
</nav> </nav>
{% endblock %} {% endblock %}
<div class="container py-4" id="main">
<div class="container py-4">
{% block content-header %} {% block content-header %}
{% if error %} {% if error %}
<div class="error">{{ error }}</div>{% endif %} <div class="error">{{ error }}</div>{% endif %}