[TASK] Visual tweaks of "Workspaces" backend module 35/47735/2
authorAndreas Fernandez <a.fernandez@scripting-base.de>
Sun, 17 Apr 2016 13:01:08 +0000 (15:01 +0200)
committerBenni Mack <benni@typo3.org>
Sun, 17 Apr 2016 19:00:46 +0000 (21:00 +0200)
- Record table list is responsive on small screens
- Nested records are indented

Resolves: #75720
Releases: master
Change-Id: If64ea18126581249c1b47891de74beec0128b998
Reviewed-on: https://review.typo3.org/47735
Reviewed-by: Wouter Wolters <typo3@wouterwolters.nl>
Reviewed-by: Susanne Moog <typo3@susannemoog.de>
Tested-by: Susanne Moog <typo3@susannemoog.de>
Reviewed-by: Benni Mack <benni@typo3.org>
Tested-by: Benni Mack <benni@typo3.org>
typo3/sysext/workspaces/Resources/Private/Partials/WorkingTable.html
typo3/sysext/workspaces/Resources/Public/JavaScript/Backend.js

index d8e0f00..cfa216b 100644 (file)
                                        <core:icon identifier="apps-pagetree-expand" size="small" />
                                        <core:icon identifier="apps-pagetree-collapse" size="small" />
                                </div>
-                               <table class="table table-striped">
-                                       <thead>
-                                       <tr>
-                                               <th><f:translate key="column.wsTitle" /></th>
-                                               <th><f:translate key="column.liveTitle" /></th>
-                                               <th><f:translate key="column.stage" /></th>
-                                               <th><f:translate key="column.integrity" /></th>
-                                               <th><core:icon identifier="flags-multiple" size="small" /></th>
-                                               <th class="text-right">
-                                                       <button type="button" class="btn btn-default t3js-toggle-all"><span class="t3-icon fa fa-check-square-o"></span></button>
-                                               </th>
-                                       </tr>
-                                       </thead>
-                                       <tbody>
-                                       </tbody>
-                               </table>
+                               <div class="table-fit">
+                                       <table class="table table-striped">
+                                               <thead>
+                                               <tr>
+                                                       <th><f:translate key="column.wsTitle" /></th>
+                                                       <th><f:translate key="column.liveTitle" /></th>
+                                                       <th><f:translate key="column.stage" /></th>
+                                                       <th><f:translate key="column.integrity" /></th>
+                                                       <th><core:icon identifier="flags-multiple" size="small" /></th>
+                                                       <th class="text-right">
+                                                               <button type="button" class="btn btn-default t3js-toggle-all"><span class="t3-icon fa fa-check-square-o"></span></button>
+                                                       </th>
+                                               </tr>
+                                               </thead>
+                                               <tbody>
+                                               </tbody>
+                                       </table>
+                               </div>
                                <form id="workspace-actions-form" class="form-inline form-inline-spaced">
                                        <div class="form-group">
                                                <select name="stage-action" class="form-control" disabled>
index bbea867..3050b75 100644 (file)
@@ -64,7 +64,8 @@ define([
                allToggled: false,
                elements: {}, // filled in Backend.getElements()
                latestPath: '',
-               markedRecordsForMassAction: []
+               markedRecordsForMassAction: [],
+               indentationPadding: 26
        };
 
        Backend.initialize = function() {
@@ -541,7 +542,7 @@ define([
 
                        Backend.elements.$tableBody.append(
                                $('<tr />', rowConfiguration).append(
-                                       $('<td />', {class: 't3js-title-workspace'}).html(item.icon_Workspace + '&nbsp;' + '<a href="#" data-action="changes"><span class="item-state-' + item.state_Workspace + '">' + item.label_Workspace + '</span></a>'),
+                                       $('<td />', {class: 't3js-title-workspace', style: item.Workspaces_CollectionLevel > 0 ? 'padding-left: ' + Backend.indentationPadding * item.Workspaces_CollectionLevel + 'px' : ''}).html(item.icon_Workspace + '&nbsp;' + '<a href="#" data-action="changes"><span class="item-state-' + item.state_Workspace + '">' + item.label_Workspace + '</span></a>'),
                                        $('<td />', {class: 't3js-title-live'}).html(item.icon_Live + '&nbsp;' + item.label_Live),
                                        $('<td />').text(item.label_Stage),
                                        $('<td />').html($integrityIcon),