Organise UI into rows: each row holding related data.

1 files changed, 76 insertions, 70 deletions

diff --git a/gn2/wqflask/templates/oauth2/view-resource-role.html b/gn2/wqflask/templates/oauth2/view-resource-role.html
index a1aa8676..c4c9d3fc 100644
--- a/gn2/wqflask/templates/oauth2/view-resource-role.html
+++ b/gn2/wqflask/templates/oauth2/view-resource-role.html
@@ -18,82 +18,88 @@
 {%endmacro%}
 
 <div class="container">
-  {{profile_nav(uipages, user_privileges)}}
-  {{flash_me()}}
-  {%if resource_error is defined%}
-  {{display_error("Resource", resource_error)}}
-  {%else%}
-  <h3>Role for Resource '{{resource.resource_name}}'</h3>
-  {%if role_error is defined%}
-  {{display_error("Role", role_error)}}
-  {%else%}
-  <table class="table">
-    <caption>Role '{{role.role_name}}' for resource '{{resource.resource_name}}'</caption>
-    <thead>
-      <tr>
-        <th>Role Name</th>
-        <th>Privilege</th>
-        <th>Action</th>
-      </tr>
-    </thead>
+  <div class="row">
+    {{profile_nav(uipages, user_privileges)}}
+    {{flash_me()}}
+    {%if resource_error is defined%}
+    {{display_error("Resource", resource_error)}}
+    {%else%}
+    <h3>Role for Resource '{{resource.resource_name}}'</h3>
+    {%if role_error is defined%}
+    {{display_error("Role", role_error)}}
+    {%else%}
+    <table class="table">
+      <caption>Role '{{role.role_name}}' for resource '{{resource.resource_name}}'</caption>
+      <thead>
+        <tr>
+          <th>Role Name</th>
+          <th>Privilege</th>
+          <th>Action</th>
+        </tr>
+      </thead>
 
-    <tbody>
-      {%for priv in role.privileges%}
-      {%if loop.index0 == 0%}
-      <tr>
-        <td rowspan="{{role.privileges | length}}"
-            style="text-align: center;vertical-align: middle;">
-          {{role.role_name}}</td>
-        <td>{{priv.privilege_description}}</td>
-        <td>{{unassign_button(resource.resource_id, role.role_id, priv.privilege_id)}}</td>
-      </tr>
+      <tbody>
+        {%for priv in role.privileges%}
+        {%if loop.index0 == 0%}
+        <tr>
+          <td rowspan="{{role.privileges | length}}"
+              style="text-align: center;vertical-align: middle;">
+            {{role.role_name}}</td>
+          <td>{{priv.privilege_description}}</td>
+          <td>{{unassign_button(resource.resource_id, role.role_id, priv.privilege_id)}}</td>
+        </tr>
+        {%else%}
+        <tr>
+          <td>{{priv.privilege_description}}</td>
+          <td>{{unassign_button(resource.resource_id, role.role_id, priv.privilege_id)}}</td>
+        </tr>
+        {%endif%}
+        {%else%}
+        <tr>
+          <td colspan="3">
+            <p class="text-info">
+              <span class="glyphicon glyphicon-info-sign text-info"></span>
+              &nbsp;
+              This role has no privileges.
+            </p>
+          </td>
+        </tr>
+        {%endfor%}
+      </tbody>
+    </table>
+  </div>
+
+  <div class="row">
+    <form id="frm_assign_privileges" method="POST" action="#">
+      <input type="hidden" name="resource_id" value="{{resource_id}}" />
+      <input type="hidden" name="role_id" value="{{role_id}}" />
+      {%if unassigned_privileges | length == 0%}
+      <p class="text-info">
+        <strong>{{title}}</strong>:
+        <span class="glyphicon glyphicon-info-sign text-info"></span>
+        &nbsp;
+        There are no more privileges left to assign.
+      </p>
       {%else%}
-      <tr>
-        <td>{{priv.privilege_description}}</td>
-        <td>{{unassign_button(resource.resource_id, role.role_id, priv.privilege_id)}}</td>
-      </tr>
+      <fieldset>
+        <legend>Select privileges to assign to this role</legend>
+        {%for priv in unassigned_privileges%}
+        <div class="checkbox">
+          <label for="rdo_{{priv.privilege_id}}">
+            <input type="checkbox" value="{{priv.privilege_id}}" />
+            {{priv.privilege_description}}
+          </label>
+        </div>
+        {%endfor%}
+      </fieldset>
+
+      <input type="submit" class="btn btn-primary" value="Assign" />
       {%endif%}
-      {%else%}
-      <tr>
-        <td colspan="3">
-          <p class="text-info">
-            <strong>{{title}}</strong>:
-            <span class="glyphicon glyphicon-info-sign text-info"></span>
-            &nbsp;
-            This role has no privileges.
-          </p>
-        </td>
-      </tr>
-      {%endfor%}
-    </tbody>
-  </table>
+    </form>
+  </div>
 
-  <form id="frm_assign_privileges" method="POST" action="#">
-    <input type="hidden" name="resource_id" value="{{resource_id}}" />
-    <input type="hidden" name="role_id" value="{{role_id}}" />
-    {%if unassigned_privileges | length == 0%}
-    <p class="text-info">
-      <strong>{{title}}</strong>:
-      <span class="glyphicon glyphicon-info-sign text-info"></span>
       &nbsp;
-      There are no more privileges left to assign.
     </p>
-    {%else%}
-    <fieldset>
-      <legend>Select privileges to assign to this role</legend>
-      {%for priv in unassigned_privileges%}
-      <div class="checkbox">
-        <label for="rdo_{{priv.privilege_id}}">
-          <input type="checkbox" value="{{priv.privilege_id}}" />
-          {{priv.privilege_description}}
-        </label>
-      </div>
-      {%endfor%}
-    </fieldset>
-
-    <input type="submit" class="btn btn-primary" value="Assign" />
-    {%endif%}
-  </form>
   {%endif%}
   {%endif%}
 </div>