webui: update markup

one/templates/box/file/box.html

@@ -9,6 +9,7 @@
 {% endblock title %}
 {% block boxhelp %}
 <div class="boxhelp">
+    <div class="help">
         <div class="icon">
             <img src="{% static "icons/information-frame.png" %}" alt="{% trans "Help" %}" />
         </div>
@@ -25,6 +26,10 @@
             WinSCP) to access your files at {{serv}}. You will need to register a
             public key bellow.{% endblocktrans %}</p>
         </div>
+    </div>
+    <div class="icon">
+        <img src="" alt="toggle" title="{% trans "Show/hide box" %}" class="toggle-box" data-id="files" id="toggle-box-files"/>
+    </div>
 </div>
 {% endblock %}
 

one/templates/box/template/box.html

@@ -10,6 +10,7 @@
 
 {% block boxhelp %}
 <div class="boxhelp">
+    <div class="help">
         <div class="icon">
             <img src="{% static "icons/information-frame.png" %}" alt="{% trans "Help" %}" />
         </div>
@@ -20,6 +21,10 @@
             machine, and it will be ready to run by your students in minutes.
             {% endblocktrans %}</p>
         </div>
+    </div>
+    <div class="icon">
+        <img src="" alt="toggle" title="{% trans "Show/hide box" %}" class="toggle-box" data-id="templates" id="toggle-box-templates"/>
+    </div>
 </div>
 {% endblock %}
 

one/templates/box/vm/box.html

@@ -10,8 +10,9 @@
 
 {% block boxhelp %}
 <div class="boxhelp">
+    <div class="help">
         <div class="icon">
-        <img src="{% static "icons/information-frame.png" %}" alt="{% trans "Help" %}" />
+            <img class="help" src="{% static "icons/information-frame.png" %}" alt="{% trans "Help" %}" />
         </div>
         <div class="boxhelp-box">
             <p>{% blocktrans %}This is the list of your running virtual machines.{% endblocktrans %}</p>
@@ -20,6 +21,10 @@
             <p>{% blocktrans %}Please note, that users and shares both have a limit
             of launchable instances.{% endblocktrans %}</p>
         </div>
+    </div>
+    <div class="icon">
+        <img src="" alt="{% trans "Show/hide box" %}" class="toggle-box" data-id="vms" id="toggle-box-vms"/>
+    </div>
 </div>
 {% endblock %}
 

school/templates/box/group/box.html

@@ -3,6 +3,26 @@
 {% load l10n %}
 {% get_current_language as LANGUAGE_CODE %}
 
+{% block boxhelp %}
+<div class="boxhelp">
+    <div class="help">
+        <div class="icon">
+            <img src="/static/icons/information-frame.png" alt="{% trans "Help" %}" />
+        </div>
+        <div class="boxhelp-box">
+            <p>{% blocktrans %}This is the list of your own templates.{% endblocktrans %}</p>
+            <p>{% blocktrans %}Templates are customized versions of the base images.{% endblocktrans %}</p>
+            <p>{% blocktrans %}You can install all the needed software on a master
+            machine, and it will be ready to run by your students in minutes.
+            {% endblocktrans %}</p>
+        </div>
+    </div>
+    <div class="icon">
+        <img src="" alt="toggle" title="{% trans "Show/hide box" %}" class="toggle-box" data-id="groups" id="toggle-box-groups"/>
+    </div>
+</div>
+{% endblock %}
+
 {% block title %}
     {% trans "My Groups" %}
 {% endblock title %}

school/templates/box/person/box.html

@@ -3,6 +3,26 @@
 {% load l10n %}
 {% get_current_language as LANGUAGE_CODE %}
 
+{% block boxhelp %}
+<div class="boxhelp">
+    <div class="help">
+        <div class="icon">
+            <img src="/static/icons/information-frame.png" alt="{% trans "Help" %}" />
+        </div>
+        <div class="boxhelp-box">
+            <p>{% blocktrans %}This is the list of your own templates.{% endblocktrans %}</p>
+            <p>{% blocktrans %}Templates are customized versions of the base images.{% endblocktrans %}</p>
+            <p>{% blocktrans %}You can install all the needed software on a master
+            machine, and it will be ready to run by your students in minutes.
+            {% endblocktrans %}</p>
+        </div>
+    </div>
+    <div class="icon">
+        <img src="" alt="eye" title="{% trans "Show/hide box" %}" class="toggle-box" data-id="members" id="toggle-box-members"/>
+    </div>
+</div>
+{% endblock %}
+
 {% block title %}
     {% trans "Members of" %}: {{group.name}}
 {% endblock title %}