use tooltips for settings, to explain path usage in particular

This commit is contained in:
2021-09-06 19:16:24 +10:00
parent 35a096c79d
commit 57281be3d1
3 changed files with 29 additions and 8 deletions

View File

@@ -15,7 +15,7 @@
<!-- code to get bootstrap to work -->
<script src="{{ url_for( 'internal', filename='upstream/jquery-3.6.0.min.js')}}"></script>
<script src="{{ url_for( 'internal', filename='upstream/bootstrap-5.0.2-dist/js/bootstrap.min.js')}}"></script>
<script src="{{ url_for( 'internal', filename='upstream/bootstrap-5.0.2-dist/js/bootstrap.bundle.min.js')}}"></script>
<script src="{{ url_for( 'internal', filename='upstream/jquery.contextMenu.min.js')}}"></script>
<script src="{{ url_for( 'internal', filename='upstream/jquery.ui.position.min.js')}}"></script>

View File

@@ -1,6 +1,6 @@
{% extends "base.html" %} {% block main_content %}
<div class="container-fluid">
<h3 class="offset-2">{{page_title}}</h3>
<h3 class="offset-3">{{page_title}}</h3>
<div class="row">
<form action="" method="POST">
{% for field in form %}
@@ -8,7 +8,7 @@
{{field}}
{% elif field.type != 'SubmitField' %}
<div class="input-group">
{{ field.label( class="input-group-text col-3 justify-content-end" ) }}
{{ field.label( class="input-group-text col-3 justify-content-end", title=HELP[field.name] ) }}
{% if field.type == 'SelectField' %}
{{ field( class="form-select col-9" ) }}
{% else %}
@@ -24,3 +24,15 @@
</div class="row">
</div class="container">
{% endblock main_content %}
{% block script_content %}
<script>
$("label").each( function() {
$(this).attr('data-bs-toggle', "tooltip")
$(this).attr('data-bs-placement', "right")
} )
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl)
})
</script>
{% endblock script_content %}