Merge branch '168-use-correct-semantic-html-elements' into 'master'

Resolve "Use correct semantic html elements"

Closes #168

See merge request !203

CHANGELOG.rst

@@ -12,6 +12,7 @@ Unreleased
 Changed
 ~~~~~~~
 * Show 'Lesson documentations' tab on person overview only if the person is a teacher.
+* Use semantically correct html elements for headings and alerts.
 
 Fixed
 ~~~~~

aleksis/apps/alsijil/static/css/alsijil/person.css

@@ -93,3 +93,9 @@ td.material-icons {
 .overflow-x-scroll {
     overflow-x: scroll;
 }
+
+figure.modal-content figcaption {
+    font-weight: 300;
+    font-size: 2.28rem;
+    line-height: 110%;
+}

aleksis/apps/alsijil/templates/alsijil/absences/register_confirm.html

@@ -21,15 +21,13 @@
           <i class="material-icons left">date_range</i>
           {{ form_data.date_start }}, {{ form_data.from_period }}. – {{ form_data.date_end }}, {{ form_data.to_period }}.
           {% if form_data.date_start != form_data.date_end %}
-            <div class="alert warning">
-              <div>
-                <i class="material-icons left">warning</i>
-                {% blocktrans %}
-                  As the length of this absence is longer than one day,
-                  please double check the correctness of your entry.
-                {% endblocktrans %}
-              </div>
-            </div>
+            <figure class="alert warning">
+              <i class="material-icons left">warning</i>
+              {% blocktrans %}
+                As the length of this absence is longer than one day,
+                please double check the correctness of your entry.
+              {% endblocktrans %}
+            </figure>
           {% endif %}
         </div>
         <div class="collection-item">

aleksis/apps/alsijil/templates/alsijil/class_register/lesson.html

@@ -10,39 +10,40 @@
 {% endblock %}
 
 {% block content %}
-  {% if next_lesson_person or prev_lesson_person or lesson_documentation %}
-    <div class="row no-margin">
-      <div class="col s12 no-padding">
-        {# Back to week view #}
-        {% if back_to_week_url %}
-          <a href="{{ back_to_week_url }}"
-             class="btn primary-color waves-light waves-effect alsijil-top-button">
-            <i class="material-icons left">chevron_left</i> {% trans "Back to week view" %}
-          </a>
-        {% endif %}
-
-        {# Next lesson #}
-        {% if prev_lesson_person %}
-          <a class="btn primary waves-effect waves-light alsijil-top-button"
-             href="{% url "lesson_period" prev_lesson_person.week.year prev_lesson_person.week.week prev_lesson_person.id %}">
+  <h1>
+    {% if next_lesson_person or prev_lesson_person or lesson_documentation %}
+      <div class="row no-margin">
+        <div class="col s12 no-padding">
+          {# Back to week view #}
+          {% if back_to_week_url %}
+            <a href="{{ back_to_week_url }}"
+               class="btn primary-color waves-light waves-effect alsijil-top-button">
+              <i class="material-icons left">chevron_left</i> {% trans "Back to week view" %}
+            </a>
+          {% endif %}
+
+          {# Next lesson #}
+          {% if prev_lesson_person %}
+            <a class="btn primary waves-effect waves-light alsijil-top-button"
+               href="{% url " lesson_period" prev_lesson_person.week.year prev_lesson_person.week.week prev_lesson_person.id %}">
             <i class="material-icons left">arrow_back</i>
             {% trans "My previous lesson" %}
-          </a>
-        {% endif %}
+            </a>
+          {% endif %}
 
-        {# Previous lesson #}
-        {% if next_lesson_person %}
-          <a class="btn primary right waves-effect waves-light alsijil-top-button"
-             href="{% url "lesson_period" next_lesson_person.week.year next_lesson_person.week.week next_lesson_person.id %}">
+          {# Previous lesson #}
+          {% if next_lesson_person %}
+            <a class="btn primary right waves-effect waves-light alsijil-top-button"
+               href="{% url " lesson_period" next_lesson_person.week.year next_lesson_person.week.week next_lesson_person.id %}">
             <i class="material-icons right">arrow_forward</i>
             {% trans "My next lesson" %}
-          </a>
-        {% endif %}
+            </a>
+          {% endif %}
+        </div>
       </div>
-    </div>
-  {% endif %}
+    {% endif %}
+
 
-  <h4>
     {% if register_object.label_ == "event" %}
       {{ register_object.date_start }} {{ register_object.period_from.period }}.–{{ register_object.date_end }}
       {{ register_object.period_to.period }}.,
@@ -63,7 +64,7 @@
     <span class="right">
       {% include "alsijil/partials/lesson_status_icon.html" with register_object=register_object css_class="medium" %}
     </span>
-  </h4>
+  </h1>
   <br/>
 
   {% has_perm "alsijil.view_lessondocumentation_rule" user register_object as can_view_lesson_documentation %}

aleksis/apps/alsijil/templates/alsijil/class_register/person.html

@@ -62,12 +62,12 @@
   <!-- Personal Note Tab -->
   <div class="col s12" id="personal-notes">
     <div class="col s12" id="overview">
-      <h5>{% trans "Relevant personal notes" %}</h5>
+      <h2>{% trans "Relevant personal notes" %}</h2>
       <form class="modal" id="filter-modal">
-        <div class="modal-content">
-          <h4>{% trans "Filter personal notes" %}</h4>
+        <figure class="modal-content">
+          <figcaption>{% trans "Filter personal notes" %}</figcaption>
           {% form form=personal_note_filter_form %}{% endform %}
-        </div>
+        </figure>
         <div class="modal-footer">
           <button type="button" class="btn-flat secondary-color-text waves-effect waves-ripple" id="remove-filters">
             <i class="material-icons left">clear</i>{% trans "Clear all filters" %}
@@ -116,7 +116,7 @@
   <!-- Statistics Tab -->
   {% if stats %}
     <div class="col s12" id="statistics">
-      <h5>{% trans "Statistics on absences, tardiness and remarks" %}</h5>
+      <h2>{% trans "Statistics on absences, tardiness and remarks" %}</h2>
       <ul class="collapsible">
         {% for school_term, stat in stats %}
           <li {% if forloop.first %}class="active"{% endif %}>

aleksis/apps/alsijil/templates/alsijil/class_register/persons.html

@@ -32,9 +32,9 @@
               </a>
             </span>
 
-            <h6>{{ group.name }}
+            <h2>{{ group.name }}
               <span class="chip">{{ group.school_term }}</span>
-            </h6>
+            </h2>
 
             <p class="show-on-active hide-on-med-and-up">
               <a class="btn primary-color waves-effect waves-light hundred-percent"

aleksis/apps/alsijil/templates/alsijil/excuse_type/warning.html

 {% load i18n %}
-<div class="alert warning">
-  <p>
-    <i class="material-icons left">warning</i>
-    {% blocktrans %}
-      This function should only be used to define alternatives to the default excuse which also will be counted extra.
-      Don't use this to create a default excuse or if you don't divide between different types of excuse.
-    {% endblocktrans %}
-  </p>
-</div>
+<figure class="alert warning">
+  <i class="material-icons left">warning</i>
+  {% blocktrans %}
+    This function should only be used to define alternatives to the default excuse which also will be counted extra.
+    Don't use this to create a default excuse or if you don't divide between different types of excuse.
+  {% endblocktrans %}
+</figure>

aleksis/apps/alsijil/templates/alsijil/group_role/partials/assigned_roles.html

@@ -36,12 +36,10 @@
   {% endfor %}
 </div>
 
-<div class="alert primary">
-  <div>
-    <i class="material-icons left">info</i>
-    {% blocktrans %}
-      You can get some additional actions for each group role assignment if you click on the name of the
-      corresponding person.
-    {% endblocktrans %}
-  </div>
+<figure class="alert primary">
+  <i class="material-icons left">info</i>
+  {% blocktrans %}
+    You can get some additional actions for each group role assignment if you click on the name of the
+    corresponding person.
+  {% endblocktrans %}
+</figure>
\ No newline at end of file
-</div>
\ No newline at end of file

aleksis/apps/alsijil/templates/alsijil/group_role/warning.html

 {% load i18n %}
-<div class="alert warning">
-  <p>
-    <i class="material-icons left">warning</i>
-    {% blocktrans %}
-      This function should only be used to define alternatives to the default excuse which also will be counted extra.
-      Don't use this to create a default excuse or if you don't divide between different types of excuse.
-    {% endblocktrans %}
-  </p>
-</div>
+<figure class="alert warning">
+  <i class="material-icons left">warning</i>
+  {% blocktrans %}
+    This function should only be used to define alternatives to the default excuse which also will be counted extra.
+    Don't use this to create a default excuse or if you don't divide between different types of excuse.
+  {% endblocktrans %}
+</figure>

aleksis/apps/alsijil/templates/alsijil/partials/persons_with_stats.html

 {% load data_helpers time_helpers i18n rules %}
 
 {% if not persons %}
-  <div class="alert primary">
-    <div>
-      <i class="material-icons left">warning</i>
-      {% blocktrans %}No students available.{% endblocktrans %}
-    </div>
-  </div>
+  <figure class="alert primary">
+    <i class="material-icons left">warning</i>
+    {% blocktrans %}No students available.{% endblocktrans %}
+  </figure>
 {% else %}
   <table class="highlight responsive-table">
   <thead>