Fixed bug #17044: Styling of TCEforms with renderMode=checkbox
authorSteffen Gebert <steffen.gebert@typo3.org>
Thu, 20 Jan 2011 09:20:03 +0000 (09:20 +0000)
committerSteffen Gebert <steffen.gebert@typo3.org>
Thu, 20 Jan 2011 09:20:03 +0000 (09:20 +0000)
git-svn-id: https://svn.typo3.org/TYPO3v4/Core/trunk@10153 709f56b5-9817-0410-a4d7-c38de5d9e867

ChangeLog
t3lib/class.t3lib_tceforms.php
typo3/sysext/t3skin/stylesheets/structure/element_tceforms.css
typo3/sysext/t3skin/stylesheets/visual/element_tceforms.css

index bd89db3..0ff9a07 100755 (executable)
--- a/ChangeLog
+++ b/ChangeLog
@@ -1,3 +1,7 @@
+2011-01-20  Steffen Gebert  <steffen@steffen-gebert.de>
+
+       * Fixed bug #17044: Styling of TCEforms with renderMode=checkbox
+
 2011-01-20  Ernesto Baschny  <ernst@cron-it.de>
 
        * Fixed issue #17109: Make the t3lib_utility_Mail hook subscriber optional / configureable
index 7daa08a..a37ff16 100644 (file)
@@ -1773,7 +1773,12 @@ class t3lib_TCEforms {
         * @return      string          The HTML code for the item
         * @see getSingleField_typeSelect()
         */
-       function getSingleField_typeSelect_checkbox($table, $field, $row, &$PA, $config, $selItems, $nMV_label) {
+       function getSingleField_typeSelect_checkbox(
+               $table, $field, $row, &$PA, $config, $selItems, $nMV_label) {
+
+               if (empty($selItems)) {
+                       return '';
+               }
 
                        // Get values in an array (and make unique, which is fine because there can be no duplicates anyway):
                $itemArray = array_flip($this->extractValuesOnlyFromValueLabelList($PA['itemFormElValue']));
@@ -1793,22 +1798,6 @@ class t3lib_TCEforms {
                        foreach ($selItems as $p) {
                                        // Non-selectable element:
                                if (!strcmp($p[1], '--div--')) {
-                                       if (count($setAll)) {
-                                               $tRows[] = '
-                                                               <tr class="c-header-checkbox-controls">
-                                                                       <td colspan="3">' .
-                                                                  '<a href="#" onclick="' . htmlspecialchars(implode('', $setAll) . ' return false;') . '">' .
-                                                                  htmlspecialchars($this->getLL('l_checkAll')) .
-                                                                  '</a>
-                                                                               <a href="#" onclick="' . htmlspecialchars(implode('', $unSetAll) . ' return false;') . '">' .
-                                                                  htmlspecialchars($this->getLL('l_uncheckAll')) .
-                                                                  '</a>
-                                                                       </td>
-                                                               </tr>';
-                                               $setAll = array();
-                                               $unSetAll = array();
-                                       }
-
                                        $tRows[] = '
                                                <tr class="c-header">
                                                        <td colspan="3">' . htmlspecialchars($p[0]) . '</td>
@@ -1843,7 +1832,7 @@ class t3lib_TCEforms {
                                        $hasHelp = ($p[3] != '');
 
                                        $label = t3lib_div::deHSCentities(htmlspecialchars($p[0]));
-                                       $help = $hasHelp ? '<span class="typo3-csh-inline show-right"><span class="header">' . $label . '</span>' .
+                                       $help = $hasHelp ? '<span class="typo3-csh-inline"><span class="header">' . $label . '</span>' .
                                                                           '<span class="paragraph">' . $GLOBALS['LANG']->hscAndCharConv(nl2br(trim(htmlspecialchars($p[3]))), false) . '</span></span>' : '';
 
                                        if ($hasHelp && $this->edit_showFieldHelp == 'icon') {
@@ -1856,7 +1845,7 @@ class t3lib_TCEforms {
 
                                        $tRows[] = '
                                                <tr id="' . $rowId . '" class="' . ($sM ? 'c-selectedItem' : 'c-unselectedItem') . '" onclick="' . htmlspecialchars($onClick) . '" style="cursor: pointer;">
-                                                       <td width="12"><input type="checkbox"' . $this->insertDefStyle('check') . ' name="' . htmlspecialchars($PA['itemFormElName'] . '[' . $c . ']') . '" value="' . htmlspecialchars($p[1]) . '"' . $sM . ' onclick="' . htmlspecialchars($sOnChange) . '"' . $PA['onFocus'] . ' /></td>
+                                                       <td class="c-checkbox"><input type="checkbox"' . $this->insertDefStyle('check') . ' name="' . htmlspecialchars($PA['itemFormElName'] . '[' . $c . ']') . '" value="' . htmlspecialchars($p[1]) . '"' . $sM . ' onclick="' . htmlspecialchars($sOnChange) . '"' . $PA['onFocus'] . ' /></td>
                                                        <td class="c-labelCell" onclick="' . htmlspecialchars($onClickCell) . '">' .
                                                           $this->getIconHtml($selIcon) .
                                                           $label .
@@ -1866,21 +1855,6 @@ class t3lib_TCEforms {
                                        $c++;
                                }
                        }
-
-                               // Remaining checkboxes will get their set-all link:
-                       if (count($setAll)) {
-                               $tRows[] = '
-                                               <tr class="c-header-checkbox-controls">
-                                                       <td colspan="3">' .
-                                                  '<a href="#" onclick="' . htmlspecialchars(implode('', $setAll) . ' return false;') . '">' .
-                                                  htmlspecialchars($this->getLL('l_checkAll')) .
-                                                  '</a>
-                                                               <a href="#" onclick="' . htmlspecialchars(implode('', $unSetAll) . ' return false;') . '">' .
-                                                  htmlspecialchars($this->getLL('l_uncheckAll')) .
-                                                  '</a>
-                                                       </td>
-                                               </tr>';
-                       }
                }
 
                        // Remaining values (invalid):
@@ -1889,7 +1863,7 @@ class t3lib_TCEforms {
                                        // Compile <checkboxes> tag:
                                array_unshift($tRows, '
                                                <tr class="c-invalidItem">
-                                                       <td><input type="checkbox"' . $this->insertDefStyle('check') . ' name="' . htmlspecialchars($PA['itemFormElName'] . '[' . $c . ']') . '" value="' . htmlspecialchars($theNoMatchValue) . '" checked="checked" onclick="' . htmlspecialchars($sOnChange) . '"' . $PA['onFocus'] . $disabled . ' /></td>
+                                                       <td class="c-checkbox"><input type="checkbox"' . $this->insertDefStyle('check') . ' name="' . htmlspecialchars($PA['itemFormElName'] . '[' . $c . ']') . '" value="' . htmlspecialchars($theNoMatchValue) . '" checked="checked" onclick="' . htmlspecialchars($sOnChange) . '"' . $PA['onFocus'] . $disabled . ' /></td>
                                                        <td class="c-labelCell">' .
                                                                          t3lib_div::deHSCentities(htmlspecialchars(@sprintf($nMV_label, $theNoMatchValue))) .
                                                                          '</td><td>&nbsp;</td>
@@ -1901,18 +1875,31 @@ class t3lib_TCEforms {
                        // Add an empty hidden field which will send a blank value if all items are unselected.
                $item .= '<input type="hidden" name="' . htmlspecialchars($PA['itemFormElName']) . '" value="" />';
 
-                       // Add revert icon
-               if (is_array($restoreCmd)) {
-                       $item .= '<a href="#" onclick="' . implode('', $restoreCmd) . ' return false;' . '">' .
-                                        t3lib_iconWorks::getSpriteIcon('actions-edit-undo', array('title' => htmlspecialchars($this->getLL('l_revertSelection')))) . '</a>';
+                       // Remaining checkboxes will get their set-all link:
+               if (count($setAll)) {
+                       $tableHead = '<thead>
+                                       <tr class="c-header-checkbox-controls t3-row-header">
+                                               <td class="c-checkbox">
+                                               <input type="checkbox" class="checkbox" onclick="if (checked) {' . htmlspecialchars(implode('', $setAll) . '} else {' .  implode('', $unSetAll) . '}') . '">
+                                               </td>
+                                               <td colspan="2">
+                                               </td>
+                                       </tr></thead>';
                }
                        // Implode rows in table:
                $item .= '
                        <table border="0" cellpadding="0" cellspacing="0" class="typo3-TCEforms-select-checkbox">' .
-                                implode('', $tRows) . '
+                               $tableHead .
+                               '<tbody>' . implode('', $tRows) . '</tbody>
                        </table>
                        ';
 
+                       // Add revert icon
+               if (is_array($restoreCmd)) {
+                       $item .= '<a href="#" onclick="' . implode('', $restoreCmd) . ' return false;' . '">' .
+                                        t3lib_iconWorks::getSpriteIcon('actions-edit-undo', array('title' => htmlspecialchars($this->getLL('l_revertSelection')))) . '</a>';
+               }
+
                return $item;
        }
 
index 926fe4c..366fc41 100644 (file)
@@ -111,32 +111,34 @@ table.typo3-TCEforms select.icon-select option {
 
 table.typo3-TCEforms table.typo3-TCEforms-select-checkbox {
        margin-bottom: 10px;
-       width: 98%;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td {
-       padding: 1px 3px 1px 3px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tbody {
+       display: block;
+       max-height: 300px;
+       overflow-y: scroll;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
-       padding-right: 30px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td {
+       vertical-align: middle;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell P.c-descr {
-       margin-left: 30px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td,
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-checkbox,
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
+       padding: 1px 3px;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
-       padding-left: 4px;
-       padding-top: 10px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
+       min-width: 300px;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header-checkbox-controls td {
-       padding-right: 16px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell img {
+       margin-right: 5px;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header-checkbox-controls td a {
-       padding-left: 16px;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox td.c-descr {
+       width: 40px;
 }
 
 table.typo3-TCEforms table.typo3-TCEforms-select-checkbox td.c-descr img {
index ebee515..1dab1d7 100644 (file)
@@ -113,48 +113,42 @@ table.typo3-TCEforms span.typo3-TCEforms-helpText {
        color: #fff;
 }
 
-table.typo3-TCEforms-select-checkbox  {
-       background-color: #efeff4;
+table.typo3-TCEforms-select-checkbox {
+       background-color: #ffffff;
        border: 1px solid #aaa;
 }
 
-table.typo3-TCEforms-select-checkbox tr {
-       background-color: #efeff4;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
+       background-color: #fff;
+       font-weight: bold;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem {
-       background-color: #d7dbe2;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:nth-child(2n) {
+       background-color: #f7f7f7;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-unselectedItem {
-       background-color: #efeff4;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem {
+       background-color: #d8ecd0;
 }
 
 table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem {
-       background-color: #ff6600;
+       color: #dddddd;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header-checkbox-controls td {
-       background-color: #b8bec9;
-       text-align: right;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr:hover {
+       background-color: #dedede;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header-checkbox-controls td a {
-       color: white;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-selectedItem:hover {
+       background-color: #abd99a;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-header td {
-       background-color: #fff;
-       border-bottom: 1px solid #999999;
-       font-weight: bold;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr.c-invalidItem:hover {
+       background-color: transparent;
 }
 
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td {
-       border-bottom: 1px #999 dashed;
-}
-
-table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell p.c-descr {
-       font-style: italic;
+table.typo3-TCEforms table.typo3-TCEforms-select-checkbox tr td.c-labelCell {
+       white-space: nowrap;
 }
 
 table.typo3-TCEforms optgroup.c-divider,