Implement locking in new layout

Signed-off-by: Michal Čihař <michal@cihar.com>

weblate/html/translation.html

@@ -38,9 +38,10 @@
     </a>
     <ul class="dropdown-menu">
       <li><a href="{% url 'data_project' project=object.subproject.project.slug  %}">{% trans "Data exports" %}</a></li>
-        {% if perms.trans.commit_translation or perms.trans.update_translation %}
-        <li><a href="#git" data-toggle="pill" data-href="{% url 'git_status_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Git maintenance" %}</a></li>
-        {% endif %}
+      <li><a href="#locking" data-toggle="pill">{% trans "Locking" %}</a></li>
+      {% if perms.trans.commit_translation or perms.trans.update_translation %}
+      <li><a href="#git" data-toggle="pill" data-href="{% url 'git_status_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Git maintenance" %}</a></li>
+      {% endif %}
       {% if autoform %}
       <li><a href="#auto" data-toggle="pill">{% trans "Automatic translation" %}</a></li>
       {% endif %}
@@ -241,15 +242,10 @@
 </div>
 {% endif %}
 
-<h2>{% trans "Tools" %}</h2>
-
-<div class="tabs" id="translation-tabs">
-<ul>
-<li><a href="#locking">{% trans "Locking" %}</a></li>
-<li><a href="{% url 'view_activity_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Activity" %}</a></li>
-</ul>
-
-<div id="locking">
+<div class="tab-pane" id="locking">
+<div class="panel panel-primary">
+<div class="panel-heading"><h4 class="panel-title">{% trans "Locking" %}</h4></div>
+<div class="panel-body">
 <p>{% trans "Locking the translation will prevent others to work on translation." %}</p>
 {% if object.is_user_locked %}
 <p>{% trans "Locked by:" %} {{ object.get_lock_user_display }}</p>
@@ -259,13 +255,25 @@
 {% endif %}
 {% if perms.trans.lock_translation %}
 {% if object.lock_user == request.user %}
-<a class="button" href="{% url 'unlock_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Unlock" %}</a>
+<a class="btn btn-default" href="{% url 'unlock_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Unlock" %}</a>
 {% elif not object.is_user_locked %}
-<a class="button" href="{% url 'lock_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Lock" %}</a>
+<a class="btn btn-default" href="{% url 'lock_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Lock" %}</a>
 {% endif %}
 {% endif %}
 </div>
 
+</div>
+</div>
+
+
+
+<h2>{% trans "Tools" %}</h2>
+
+<div class="tabs" id="translation-tabs">
+<ul>
+<li><a href="{% url 'view_activity_translation' project=object.subproject.project.slug subproject=object.subproject.slug lang=object.language.code %}">{% trans "Activity" %}</a></li>
+</ul>
+
 </div>
 
 {% endblock %}