Made ACL forms more compact

misago/forumroles/views.py

@@ -100,6 +100,7 @@ class ACL(FormWidget):
     target_name = 'name'
     notfound_message = _('Requested Forum Role could not be found.')
     submit_fallback = True
+    template = 'acl_form'
     
     def get_form(self, request, target):
         self.form = build_forum_form(request, target)

misago/roles/views.py

@@ -193,6 +193,7 @@ class ACL(FormWidget):
     translate_target_name = True
     notfound_message = _('Requested Role could not be found.')
     submit_fallback = True
+    template = 'acl_form'
     
     def get_form(self, request, target):
         self.form = build_form(request, target)

static/admin/css/admin.css

@@ -871,7 +871,8 @@ td.check-cell,th.check-cell{width:32px;}
 td .checkbox,th .checkbox{margin-bottom:0px;position:relative;bottom:1px;}td .checkbox input,th .checkbox input{position:relative;left:9px;}
 td.lead-cell{font-size:120%;}
 .table td{vertical-align:middle;}
-.table input,.table select,.table .yes-no-switch{margin:0px;}
+.table select,.table .yes-no-switch{margin:0px;}
+.table input{width:90% !important;}
 .table .yes-no-switch{position:relative;top:2px;}
 th.table-sort{padding:0px;}th.table-sort a:link,th.table-sort a:active,th.table-sort a:visited a:hover{display:block;padding:8px;}
 th.table-sort.sort-active-asc a:link,th.table-sort.sort-active-asc a:active,th.table-sort.sort-active-asc a:visited{border-bottom:3px solid #049cdb;padding-bottom:5px;}

static/admin/css/admin/tables.less

@@ -112,10 +112,14 @@ td.lead-cell {
     vertical-align: middle;
   }
   
-  input, select, .yes-no-switch {
+  select, .yes-no-switch {
     margin: 0px;
   }
   
+  input {
+    width: 90% !important;
+  }
+    
   .yes-no-switch {
     position: relative;
     top: 2px;

templates/admin/admin/acl_form.html

@@ -0,0 +1,47 @@
+{% extends "admin/admin/layout.html" %}
+{% load i18n %}
+{% load l10n %}
+{% load url from future %}
+{% import "_forms.html" as form_theme with context %}
+
+{% block action_body %}
+<form action="{{ url }}" method="post">
+  {{ form_theme.form_hidden_widget(form) }}
+  {% for fieldset in form.fieldsets %}
+  <table class="table table-striped">
+    <thead>
+      <tr>
+        <th class="lead">{{ fieldset.legend }}</th>
+        <th>{% trans %}Permission{% endtrans %}</th>
+      </tr>
+    </thead>
+    <tbody>
+      {% for field in fieldset.fields %}
+      <tr>
+        <td>
+          <strong>{{ field.label }}</strong>{% if field.help_text %}<div class="muted">{{ field.help_text }}</div>{% endif %}
+        </td>
+        <td class="span4">
+          {{ form_theme.field_widget(field, width=4) }}
+        </td>
+      </tr>
+      {% endfor %}
+    </tbody>
+  </table>
+  {% endfor %}
+  <div class="form-actions">
+  	{% block form_actions %}
+  	{% block form_submit %}
+  	<button name="save" type="submit" class="btn btn-primary">{{ action.submit_button }}</button>
+  	{% endblock %}
+  	{% if action.get_edit_url -%}
+  	<button name="save_edit" type="submit" class="btn btn-warning">{% trans %}Save and Edit{% endtrans %}</button>
+  	{%- endif %}
+  	{% if action.get_new_url -%}
+  	<button name="save_new" type="submit" class="btn btn-success">{% trans %}Save and Add Another{% endtrans %}</button>
+  	{%- endif %}
+  	{% if fallback %}<a href="{{ fallback }}" class="btn">{% trans %}Cancel{% endtrans %}</a>{% endif %}
+  	{% endblock %}
+  </div>
+</form>
+{% endblock %}

templates/admin/admin/form.html

@@ -11,10 +11,11 @@
   <ul class="nav nav-tabs" id="form-tabs">{% for fieldset in form.fieldsets %}
     <li{% if loop.first %} class="active"{% endif%}><a href="#form-tab-{{ loop.index }}" data-toggle="tab">{{ fieldset.legend }}</a></li>{% endfor %}
   </ul>
-  <div class="tab-content">  	
+  <div class="tab-content">
     {% for fieldset in form.fieldsets %}
     <div class="tab-pane{% if loop.first %} active{% endif%}" id="form-tab-{{ loop.index }}">
-      <fieldset>{% for field in fieldset.fields %}
+      <fieldset>
+        <legend>{{ fieldset.legend }}</legend>{% for field in fieldset.fields %}
           {{ form_theme.row_widget(field) }}{% endfor %}
       </fieldset>
     </div>