mirror of
https://github.com/nottinghamtec/PyRIGS.git
synced 2026-02-19 21:09:41 +00:00
Add a skip link for keyboard users
Someone might use it...
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -78,6 +78,22 @@ ins {
|
||||
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 {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@@ -92,8 +92,8 @@
|
||||
.attr({type : 'text/css', rel : 'stylesheet'})
|
||||
.attr('href', '{% static "css/bootstrap-datetimepicker.min.css" %}');
|
||||
$.when(
|
||||
$.getScript( "{% static "js/moment.min.js" %}" ),
|
||||
$.getScript( "{% static "js/bootstrap-datetimepicker.min.js" %}" ),
|
||||
$.getScript( "{% static "js/moment.js" %}" ),
|
||||
$.getScript( "{% static "js/bootstrap-datetimepicker.js" %}" ),
|
||||
$.Deferred(function( deferred ){
|
||||
$( deferred.resolve );
|
||||
})
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
{% block js %}
|
||||
<script src="{% static "js/tooltip.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>
|
||||
$(function () {
|
||||
$('[data-toggle="popover"]').popover().click(function(){
|
||||
@@ -18,28 +18,12 @@
|
||||
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) {
|
||||
var $dateElem = $(dateElem);
|
||||
var formatted = moment($dateElem.attr('data-date')).fromNow();
|
||||
$dateElem.text(formatted);
|
||||
});
|
||||
|
||||
|
||||
})
|
||||
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
|
||||
@@ -31,6 +31,7 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a class="skip-link" href='#main'>Skip to content</a>
|
||||
{% include "analytics.html" %}
|
||||
{% block navbar %}
|
||||
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark" role="navigation">
|
||||
@@ -49,8 +50,7 @@
|
||||
</div>
|
||||
</nav>
|
||||
{% endblock %}
|
||||
|
||||
<div class="container py-4">
|
||||
<div class="container py-4" id="main">
|
||||
{% block content-header %}
|
||||
{% if error %}
|
||||
<div class="error">{{ error }}</div>{% endif %}
|
||||
|
||||
Reference in New Issue
Block a user