[TASK] Streamline page position map 63/37063/5
authorBenjamin Kott <benjamin.kott@outlook.com>
Sat, 21 Feb 2015 00:50:25 +0000 (01:50 +0100)
committerWouter Wolters <typo3@wouterwolters.nl>
Sat, 21 Feb 2015 13:19:06 +0000 (14:19 +0100)
- Reduce usage of custom CSS in page position map
  for inserting/moving content elements.
- Add missing language file
- Remove unused CSS

Releases: master
Resolves: #65210
Change-Id: Icfec5fbc927d291129fd2dc663633b76ebb2ad7e
Reviewed-on: http://review.typo3.org/37063
Reviewed-by: Nicole Cordes <typo3@cordes.co>
Tested-by: Nicole Cordes <typo3@cordes.co>
Reviewed-by: Wouter Wolters <typo3@wouterwolters.nl>
Tested-by: Wouter Wolters <typo3@wouterwolters.nl>
typo3/sysext/backend/Classes/Controller/ContentElement/NewContentElementController.php
typo3/sysext/backend/Classes/Tree/View/PagePositionMap.php
typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/_element_table.less
typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/structure/_element_move_element.less [deleted file]
typo3/sysext/t3skin/Resources/Private/Styles/t3skin.less
typo3/sysext/t3skin/Resources/Public/Css/visual/t3skin.css

index 9572b0e..54078b3 100644 (file)
@@ -155,10 +155,7 @@ class NewContentElementController {
                        // ***************************
                        // Creating content
                        // ***************************
-                       // use a wrapper div
-                       $this->content .= '<div id="user-setup-wrapper">';
                        $this->content .= $this->doc->header($GLOBALS['LANG']->getLL('newContentElement'));
-                       $this->content .= $this->doc->spacer(5);
                        // Wizard
                        $code = '';
                        $wizardItems = $this->getWizardItems();
@@ -240,9 +237,9 @@ class NewContentElementController {
                        }
                        // Add the wizard table to the content, wrapped in tabs:
                        if ($this->config['renderMode'] == 'tabs') {
-                               $code = $GLOBALS['LANG']->getLL('sel1', 1) . '<br /><br />' . $this->doc->getDynTabMenu($menuItems, 'new-content-element-wizard', FALSE, FALSE);
+                               $code = '<p>' . $GLOBALS['LANG']->getLL('sel1', 1) . '</p>' . $this->doc->getDynTabMenu($menuItems, 'new-content-element-wizard', FALSE, FALSE);
                        } else {
-                               $code = $GLOBALS['LANG']->getLL('sel1', 1) . '<br /><br />';
+                               $code = '<p>' . $GLOBALS['LANG']->getLL('sel1', 1) . '</p>';
                                foreach ($menuItems as $section) {
                                        $code .= '<h3 class="divider">' . $section['label'] . '</h3>' . $section['content'];
                                }
@@ -252,9 +249,8 @@ class NewContentElementController {
                        if (!$this->onClickEvent) {
                                // Add anchor "sel2"
                                $this->content .= $this->doc->section('', '<a name="sel2"></a>');
-                               $this->content .= $this->doc->spacer(20);
                                // Select position
-                               $code = $GLOBALS['LANG']->getLL('sel2', 1) . '<br /><br />';
+                               $code = '<p>' . $GLOBALS['LANG']->getLL('sel2', 1) . '</p>';
 
                                // Load SHARED page-TSconfig settings and retrieve column list from there, if applicable:
                                $colPosArray = GeneralUtility::callUserFunction(\TYPO3\CMS\Backend\View\BackendLayoutView::class . '->getColPosListItemsParsed', $this->id, $this);
@@ -265,8 +261,6 @@ class NewContentElementController {
                                $code .= $posMap->printContentElementColumns($this->id, 0, $colPosList, 1, $this->R_URI);
                                $this->content .= $this->doc->section($GLOBALS['LANG']->getLL('2_selectPosition'), $code, 0, 1);
                        }
-                       // Close wrapper div
-                       $this->content .= '</div>';
                } else {
                        // In case of no access:
                        $this->content = '';
index 2fe7e36..c993ea5 100644 (file)
@@ -390,12 +390,11 @@ class PagePositionMap {
         * @return string HTML
         */
        public function printRecordMap($lines, $colPosArray, $pid = 0) {
-               $row1 = '';
-               $row2 = '';
                $count = \TYPO3\CMS\Core\Utility\MathUtility::forceIntegerInRange(count($colPosArray), 1);
                $backendLayout = GeneralUtility::callUserFunction(\TYPO3\CMS\Backend\View\BackendLayoutView::class . '->getSelectedBackendLayout', $pid, $this);
                if (isset($backendLayout['__config']['backend_layout.'])) {
-                       $table = '<div class="t3-gridContainer"><table border="0" cellspacing="0" cellpadding="0" id="typo3-ttContentList">';
+                       $GLOBALS['LANG']->includeLLFile('EXT:cms/layout/locallang.xlf');
+                       $table = '<div class="table-fit"><table class="table table-condensed table-bordered table-vertical-top">';
                        $colCount = (int)$backendLayout['__config']['backend_layout.']['colCount'];
                        $rowCount = (int)$backendLayout['__config']['backend_layout.']['rowCount'];
                        $table .= '<colgroup>';
@@ -403,6 +402,7 @@ class PagePositionMap {
                                $table .= '<col style="width:' . 100 / $colCount . '%"></col>';
                        }
                        $table .= '</colgroup>';
+                       $table .= '<tbody>';
                        $tcaItems = GeneralUtility::callUserFunction(\TYPO3\CMS\Backend\View\BackendLayoutView::class . '->getColPosListItemsParsed', $pid, $this);
                        // Cycle through rows
                        for ($row = 1; $row <= $rowCount; $row++) {
@@ -425,37 +425,61 @@ class PagePositionMap {
                                                }
                                        }
                                        // Render the grid cell
-                                       $table .= '<td valign="top"' . (isset($columnConfig['colspan']) ? ' colspan="' . $columnConfig['colspan'] . '"' : '') . (isset($columnConfig['rowspan']) ? ' rowspan="' . $columnConfig['rowspan'] . '"' : '') . ' class="t3-gridCell t3-page-column t3-page-column-' . $columnKey . (!isset($columnConfig['colPos']) ? ' t3-gridCell-unassigned' : '') . (isset($columnConfig['colPos']) && !$head ? ' t3-gridCell-restricted' : '') . (isset($columnConfig['colspan']) ? ' t3-gridCell-width' . $columnConfig['colspan'] : '') . (isset($columnConfig['rowspan']) ? ' t3-gridCell-height' . $columnConfig['rowspan'] : '') . '">';
-                                       $table .= '<div class="t3-page-colHeader t3-row-header">';
+                                       $table .= '<td'
+                                               . (isset($columnConfig['colspan']) ? ' colspan="' . $columnConfig['colspan'] . '"' : '')
+                                               . (isset($columnConfig['rowspan']) ? ' rowspan="' . $columnConfig['rowspan'] . '"' : '')
+                                               . ' class="col-nowrap col-min'
+                                               . (!isset($columnConfig['colPos']) ? ' warning' : '')
+                                               . (isset($columnConfig['colPos']) && !$head ? ' danger' : '') . '">';
+                                       // Render header
+                                       $table .= '<p>';
                                        if (isset($columnConfig['colPos']) && $head) {
-                                               $table .= $this->wrapColumnHeader($head, '', '') . '</div>' . implode('<br />', $lines[$columnKey]);
+                                               $table .= '<strong>' . $this->wrapColumnHeader($head, '', '') . '</strong>';
                                        } elseif ($columnConfig['colPos']) {
-                                               $table .= $this->wrapColumnHeader($GLOBALS['LANG']->getLL('noAccess'), '', '') . '</div>';
-                                       } elseif ($columnConfig['name']) {
-                                               $table .= $this->wrapColumnHeader($columnConfig['name'], '', '') . '</div>';
+                                               $table .= '<em>' . $this->wrapColumnHeader($GLOBALS['LANG']->getLL('noAccess'), '', '') . '</em>';
                                        } else {
-                                               $table .= $this->wrapColumnHeader($GLOBALS['LANG']->getLL('notAssigned'), '', '') . '</div>';
+                                               $table .= '<em>' . $this->wrapColumnHeader(($columnConfig['name']?: '') . ' (' . $GLOBALS['LANG']->getLL('notAssigned') . ')', '', '') . '</em>';
+                                       }
+                                       $table .= '</p>';
+                                       // Render lines
+                                       if (isset($columnConfig['colPos']) && $head && !empty($lines[$columnKey])) {
+                                               $table .= '<ul class="list-unstyled">';
+                                               foreach ($lines[$columnKey] as $line) {
+                                                       $table .= '<li>' . $line . '</li>';
+                                               }
+                                               $table .= '</ul>';
                                        }
                                        $table .= '</td>';
                                }
                                $table .= '</tr>';
                        }
+                       $table .= '</tbody>';
                        $table .= '</table></div>';
                } else {
                        // Traverse the columns here:
+                       $row = '';
                        foreach ($colPosArray as $kk => $vv) {
-                               $row1 .= '<td align="center" width="' . round(100 / $count) . '%"><div class="t3-page-colHeader t3-row-header">' . $this->wrapColumnHeader($GLOBALS['LANG']->sL(BackendUtility::getLabelFromItemlist('tt_content', 'colPos', $vv, $pid), TRUE), $vv) . '</div></td>';
-                               $row2 .= '<td valign="top" nowrap="nowrap">' . implode('<br />', $lines[$vv]) . '</td>';
+                               $row .= '<td class="col-nowrap col-min" width="' . round(100 / $count) . '%">';
+                               $row .= '<p><strong>' . $this->wrapColumnHeader($GLOBALS['LANG']->sL(BackendUtility::getLabelFromItemlist('tt_content', 'colPos', $vv, $pid), TRUE), $vv) . '</strong></p>';
+                               if (!empty($lines[$vv])) {
+                                       $row .= '<ul class="list-unstyled">';
+                                       foreach ($lines[$vv] as $line) {
+                                               $row .= '<li>' . $line . '</li>';
+                                       }
+                                       $row .= '</ul>';
+                               }
+                               $row .= '</td>';
                        }
                        $table = '
 
                        <!--
                                Map of records in columns:
                        -->
-                       <table border="0" cellpadding="0" cellspacing="0" id="typo3-ttContentList">
-                               <tr>' . $row1 . '</tr>
-                               <tr>' . $row2 . '</tr>
-                       </table>
+                       <div class="table-fit">
+                               <table class="table table-condensed table-bordered table-vertical-top">
+                                       <tr>' . $row . '</tr>
+                               </table>
+                       </div>
 
                        ';
                }
index 04903e1..81b9fb7 100644 (file)
@@ -64,7 +64,7 @@ table {
                                vertical-align: middle;
                        }
                        > td {
-                               vertical-align: middle!important; // @todo important needs to be removed as soon as .typo3-TCEforms .c-tablayer td is gone
+                               vertical-align: middle;
                        }
                }
        }
@@ -109,9 +109,13 @@ table {
        .col-title {
                width: 99%;
        }
+       .col-nowrap,
        .col-control,
        .col-clipboard {
                white-space: nowrap;
+       }
+       .col-control,
+       .col-clipboard {
                text-align: right;
        }
        .col-control {
@@ -120,6 +124,9 @@ table {
        .col-border-left {
                border-left: 1px solid @table-border-color;
        }
+       .col-min {
+               min-width: 150px;
+       }
 }
 
 //
@@ -159,6 +166,34 @@ table {
 }
 
 //
+// Table cell vertical alignment
+//
+.table-vertical-top {
+       > thead,
+       > tbody,
+       > tfoot {
+               > tr {
+                       > th,
+                       > td {
+                               vertical-align: top;
+                       }
+               }
+       }
+}
+.table-vertical-bottom {
+       > thead,
+       > tbody,
+       > tfoot {
+               > tr {
+                       > th,
+                       > td {
+                               vertical-align: bottom;
+                       }
+               }
+       }
+}
+
+//
 // Fits the table in the viewport and makes overflow possible
 //
 .table-fit {
@@ -174,6 +209,7 @@ table {
                margin-top: 0;
                margin-bottom: 0;
                border: 0;
+               colgroup:first-child + tbody,
                tbody:first-child {
                        tr:first-child {
                                th,
diff --git a/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/structure/_element_move_element.less b/typo3/sysext/t3skin/Resources/Private/Styles/TYPO3/structure/_element_move_element.less
deleted file mode 100644 (file)
index a527a67..0000000
+++ /dev/null
@@ -1,19 +0,0 @@
-//
-// Move Element
-//
-
-table#typo3-ttContentList {
-       border: 1px solid #a2aab8;
-       background-color: #fff;
-}
-body#typo3-move-el-php img {
-       vertical-align: middle;
-}
-body#typo3-move-el-php table#typo3-ttContentList img,
-body#typo3-move-el-php img#c-recIcon {
-       margin-right: 4px;
-}
-
-body#typo3-move-el-php label.t3-label-valign-top {
-       vertical-align: top;
-}
\ No newline at end of file
index 4c72f77..88fe099 100644 (file)
 @import "TYPO3/_module_lang.less";
 @import "TYPO3/_module_beuser.less";
 
-@import "TYPO3/structure/_element_move_element.less";
 @import "TYPO3/structure/_element_version.less";
 @import "TYPO3/structure/_element_wizard.less";
 @import "TYPO3/structure/_module_file_list.less";
index e151935..09b105e 100644 (file)
@@ -8505,7 +8505,7 @@ table {
 .table > thead > tr > td,
 .table > tbody > tr > td,
 .table > tfoot > tr > td {
-  vertical-align: middle!important;
+  vertical-align: middle;
 }
 .table > thead > tr {
   background-color: #ededed;
@@ -8589,9 +8589,13 @@ fieldset[disabled] .table .btn-default.active {
 .table .col-title {
   width: 99%;
 }
+.table .col-nowrap,
 .table .col-control,
 .table .col-clipboard {
   white-space: nowrap;
+}
+.table .col-control,
+.table .col-clipboard {
   text-align: right;
 }
 .table .col-control {
@@ -8600,6 +8604,9 @@ fieldset[disabled] .table .btn-default.active {
 .table .col-border-left {
   border-left: 1px solid #cccccc;
 }
+.table .col-min {
+  min-width: 150px;
+}
 .table-white {
   background-color: #fff;
 }
@@ -8617,6 +8624,22 @@ fieldset[disabled] .table .btn-default.active {
 .table-basic td {
   vertical-align: middle;
 }
+.table-vertical-top > thead > tr > th,
+.table-vertical-top > tbody > tr > th,
+.table-vertical-top > tfoot > tr > th,
+.table-vertical-top > thead > tr > td,
+.table-vertical-top > tbody > tr > td,
+.table-vertical-top > tfoot > tr > td {
+  vertical-align: top;
+}
+.table-vertical-bottom > thead > tr > th,
+.table-vertical-bottom > tbody > tr > th,
+.table-vertical-bottom > tfoot > tr > th,
+.table-vertical-bottom > thead > tr > td,
+.table-vertical-bottom > tbody > tr > td,
+.table-vertical-bottom > tfoot > tr > td {
+  vertical-align: bottom;
+}
 .table-fit {
   width: 100%;
   margin-bottom: 1.5em;
@@ -8631,7 +8654,9 @@ fieldset[disabled] .table .btn-default.active {
   margin-bottom: 0;
   border: 0;
 }
+.table-fit > .table colgroup:first-child + tbody tr:first-child th,
 .table-fit > .table tbody:first-child tr:first-child th,
+.table-fit > .table colgroup:first-child + tbody tr:first-child td,
 .table-fit > .table tbody:first-child tr:first-child td {
   border-top: 0;
 }
@@ -11302,20 +11327,6 @@ div.typo3-module-lang div.progress-bar {
   margin-left: 6px;
   display: block;
 }
-table#typo3-ttContentList {
-  border: 1px solid #a2aab8;
-  background-color: #fff;
-}
-body#typo3-move-el-php img {
-  vertical-align: middle;
-}
-body#typo3-move-el-php table#typo3-ttContentList img,
-body#typo3-move-el-php img#c-recIcon {
-  margin-right: 4px;
-}
-body#typo3-move-el-php label.t3-label-valign-top {
-  vertical-align: top;
-}
 div.workspace-info {
   padding: 7px;
 }