Commit abb72b2f authored by Felix Kopp's avatar Felix Kopp Committed by Wouter Wolters
Browse files

[FEATURE] Group-work for HTML5 [x] checkbox-label-groups

Kick-Off patch to bring semantic HTML5 for checkbox+label groups
in the backend. Bootstrap compatible HTML5 mark-up for improved
semantics.

Adapts Web>Page and Web>List and Tools>Config.

Resolves: #61577
Releases: master
Change-Id: Ia0f030a3e3970462390563722d51f0bb0d4eb4de
Reviewed-on: http://review.typo3.org/32762


Reviewed-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Reviewed-by: default avatarFrank Nägler <typo3@naegler.net>
Tested-by: default avatarFrank Nägler <typo3@naegler.net>
Reviewed-by: Wouter Wolters's avatarWouter Wolters <typo3@wouterwolters.nl>
Tested-by: Wouter Wolters's avatarWouter Wolters <typo3@wouterwolters.nl>
parent 447a29d3
......@@ -821,13 +821,36 @@ class PageLayoutController {
}
// Bottom controls (function menus):
$q_count = $this->getNumberOfHiddenElements();
$h_func_b = BackendUtility::getFuncCheck($this->id, 'SET[tt_content_showHidden]', $this->MOD_SETTINGS['tt_content_showHidden'], 'db_layout.php', '', 'id="checkTt_content_showHidden"') . '<label for="checkTt_content_showHidden">' . (!$q_count ? $GLOBALS['TBE_TEMPLATE']->dfw($GLOBALS['LANG']->getLL('hiddenCE', TRUE)) : $GLOBALS['LANG']->getLL('hiddenCE', TRUE) . ' (' . $q_count . ')') . '</label>';
$h_func_b .= '<br />' . BackendUtility::getFuncCheck($this->id, 'SET[showPalettes]', $this->MOD_SETTINGS['showPalettes'], 'db_layout.php', '', 'id="checkShowPalettes"') . '<label for="checkShowPalettes">' . $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.showPalettes', TRUE) . '</label>';
$h_func_b = '<div class="checkbox">' .
'<label for="checkTt_content_showHidden">' .
BackendUtility::getFuncCheck($this->id, 'SET[tt_content_showHidden]', $this->MOD_SETTINGS['tt_content_showHidden'], 'db_layout.php', '', 'id="checkTt_content_showHidden"') .
(!$q_count ? $GLOBALS['TBE_TEMPLATE']->dfw($GLOBALS['LANG']->getLL('hiddenCE', TRUE)) : $GLOBALS['LANG']->getLL('hiddenCE', TRUE) . ' (' . $q_count . ')') .
'</label>' .
'</div>';
$h_func_b .= '<div class="checkbox">' .
'<label for="checkShowPalettes">' .
BackendUtility::getFuncCheck($this->id, 'SET[showPalettes]', $this->MOD_SETTINGS['showPalettes'], 'db_layout.php', '', 'id="checkShowPalettes"') .
$GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.showPalettes', TRUE) .
'</label>' .
'</div>';
if (ExtensionManagementUtility::isLoaded('context_help')) {
$h_func_b .= '<br />' . BackendUtility::getFuncCheck($this->id, 'SET[showDescriptions]', $this->MOD_SETTINGS['showDescriptions'], 'db_layout.php', '', 'id="checkShowDescriptions"') . '<label for="checkShowDescriptions">' . $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.showDescriptions', TRUE) . '</label>';
$h_func_b .= '<div class="checkbox">' .
'<label for="checkShowDescriptions">' .
BackendUtility::getFuncCheck($this->id, 'SET[showDescriptions]', $this->MOD_SETTINGS['showDescriptions'], 'db_layout.php', '', 'id="checkShowDescriptions"') .
$GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.showDescriptions', TRUE) .
'</label>' .
'</div>';
}
if ($GLOBALS['BE_USER']->isRTE()) {
$h_func_b .= '<br />' . BackendUtility::getFuncCheck($this->id, 'SET[disableRTE]', $this->MOD_SETTINGS['disableRTE'], 'db_layout.php', '', 'id="checkDisableRTE"') . '<label for="checkDisableRTE">' . $GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.disableRTE', TRUE) . '</label>';
$h_func_b .= '<div class="checkbox">' .
'<label for="checkDisableRTE">' .
BackendUtility::getFuncCheck($this->id, 'SET[disableRTE]', $this->MOD_SETTINGS['disableRTE'], 'db_layout.php', '', 'id="checkDisableRTE"') .
$GLOBALS['LANG']->sL('LLL:EXT:lang/locallang_core.xlf:labels.disableRTE', TRUE) .
'</label>' .
'</div>';
}
// Add the function menus to bottom:
$content .= $this->doc->section('', $h_func_b, 0, 0);
......@@ -898,7 +921,14 @@ class PageLayoutController {
foreach ($dblist->activeTables as $table => $value) {
if (!isset($dblist->externalTables[$table])) {
$q_count = $this->getNumberOfHiddenElements();
$h_func_b = BackendUtility::getFuncCheck($this->id, 'SET[tt_content_showHidden]', $this->MOD_SETTINGS['tt_content_showHidden'], 'db_layout.php', '', 'id="checkTt_content_showHidden"') . '<label for="checkTt_content_showHidden">' . (!$q_count ? $GLOBALS['TBE_TEMPLATE']->dfw($GLOBALS['LANG']->getLL('hiddenCE')) : $GLOBALS['LANG']->getLL('hiddenCE') . ' (' . $q_count . ')') . '</label>';
$h_func_b = '<div class="checkbox">' .
'<label for="checkTt_content_showHidden">' .
BackendUtility::getFuncCheck($this->id, 'SET[tt_content_showHidden]', $this->MOD_SETTINGS['tt_content_showHidden'], 'db_layout.php', '', 'id="checkTt_content_showHidden"') .
(!$q_count ? $GLOBALS['TBE_TEMPLATE']->dfw($GLOBALS['LANG']->getLL('hiddenCE')) : $GLOBALS['LANG']->getLL('hiddenCE') . ' (' . $q_count . ')') .
'</label>' .
'</div>';
// Boolean: Display up/down arrows and edit icons for tt_content records
$dblist->tt_contentConfig['showCommands'] = 1;
// Boolean: Display info-marks or not
......
===========================================================
Feature: #61577 - Backend markup for checkboxes with labels
===========================================================
Description
===========
A typical checkbox with label form element should now be rendered as:
::
<div class="checkbox">
<label for="someId">
<input type="checkbox" id="someId" />
Label text
</label>
</div>
..
Impact
======
If this HTML markup is applied, CSS styles by the TYPO3 core will take care of optimized view
and custom CSS is obsolete.
\ No newline at end of file
......@@ -130,9 +130,23 @@ class ConfigurationView {
<label for="search_field">' . $GLOBALS['LANG']->getLL('enterSearchPhrase', TRUE) . '</label>
<input type="text" id="search_field" name="search_field" value="' . htmlspecialchars($search_field) . '"' . $GLOBALS['TBE_TEMPLATE']->formWidth(20) . ' />
<input type="submit" name="search" id="search" value="' . $GLOBALS['LANG']->getLL('search', TRUE) . '" />';
$this->content .= BackendUtility::getFuncCheck(0, 'SET[regexsearch]', $this->MOD_SETTINGS['regexsearch'], '', '', 'id="checkRegexsearch"') . '<label for="checkRegexsearch">' . $GLOBALS['LANG']->getLL('useRegExp', TRUE) . '</label>';
$this->content .= BackendUtility::getFuncCheck(0, 'SET[fixedLgd]', $this->MOD_SETTINGS['fixedLgd'], '', '', 'id="checkFixedLgd"') . '<label for="checkFixedLgd">' . $GLOBALS['LANG']->getLL('cropLines', TRUE) . '</label>
</div>';
$this->content .= '<div class="checkbox">' .
'<label for="checkRegexsearch">' .
BackendUtility::getFuncCheck(0, 'SET[regexsearch]', $this->MOD_SETTINGS['regexsearch'], '', '', 'id="checkRegexsearch"') .
$GLOBALS['LANG']->getLL('useRegExp', TRUE) .
'</label>' .
'</div>';
$this->content .= '<div class="checkbox">' .
'<label for="checkFixedLgd">' .
BackendUtility::getFuncCheck(0, 'SET[fixedLgd]', $this->MOD_SETTINGS['fixedLgd'], '', '', 'id="checkFixedLgd"') .
$GLOBALS['LANG']->getLL('cropLines', TRUE) .
'</label>' .
'</div>';
$this->content .= '</div>';
$this->content .= $this->doc->spacer(5);
switch ($this->MOD_SETTINGS['function']) {
case 0:
......
......@@ -226,6 +226,7 @@ class RecordList {
// Loading current page record and checking access:
$this->pageinfo = BackendUtility::readPageAccess($this->id, $this->perms_clause);
$access = is_array($this->pageinfo) ? 1 : 0;
// Apply predefined values for hidden checkboxes
// Set predefined value for DisplayBigControlPanel:
if ($this->modTSconfig['properties']['enableDisplayBigControlPanel'] === 'activated') {
......@@ -245,6 +246,7 @@ class RecordList {
} elseif ($this->modTSconfig['properties']['enableLocalizationView'] === 'deactivated') {
$this->MOD_SETTINGS['localization'] = FALSE;
}
// Initialize the dblist object:
/** @var $dblist \TYPO3\CMS\Recordlist\RecordList\DatabaseRecordList */
$dblist = GeneralUtility::makeInstance('TYPO3\\CMS\\Recordlist\\RecordList\\DatabaseRecordList');
......@@ -401,23 +403,39 @@ class RecordList {
-->
<div id="typo3-listOptions">
<form action="" method="post">';
// Add "display bigControlPanel" checkbox:
if ($this->modTSconfig['properties']['enableDisplayBigControlPanel'] === 'selectable') {
$this->body .= BackendUtility::getFuncCheck($this->id, 'SET[bigControlPanel]', $this->MOD_SETTINGS['bigControlPanel'], '', $this->table ? '&table=' . $this->table : '', 'id="checkLargeControl"');
$this->body .= '<label for="checkLargeControl">' . BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('largeControl', TRUE)) . '</label><br />';
$this->body .= '<div class="checkbox">' .
'<label for="checkLargeControl">' .
BackendUtility::getFuncCheck($this->id, 'SET[bigControlPanel]', $this->MOD_SETTINGS['bigControlPanel'], '', $this->table ? '&table=' . $this->table : '', 'id="checkLargeControl"') .
BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('largeControl', TRUE)) .
'</label>' .
'</div>';
}
// Add "clipboard" checkbox:
if ($this->modTSconfig['properties']['enableClipBoard'] === 'selectable') {
if ($dblist->showClipboard) {
$this->body .= BackendUtility::getFuncCheck($this->id, 'SET[clipBoard]', $this->MOD_SETTINGS['clipBoard'], '', $this->table ? '&table=' . $this->table : '', 'id="checkShowClipBoard"');
$this->body .= '<label for="checkShowClipBoard">' . BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('showClipBoard', TRUE)) . '</label><br />';
$this->body .= '<div class="checkbox">' .
'<label for="checkShowClipBoard">' .
BackendUtility::getFuncCheck($this->id, 'SET[clipBoard]', $this->MOD_SETTINGS['clipBoard'], '', $this->table ? '&table=' . $this->table : '', 'id="checkShowClipBoard"') .
BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('showClipBoard', TRUE)) .
'</label>' .
'</div>';
}
}
// Add "localization view" checkbox:
if ($this->modTSconfig['properties']['enableLocalizationView'] === 'selectable') {
$this->body .= BackendUtility::getFuncCheck($this->id, 'SET[localization]', $this->MOD_SETTINGS['localization'], '', $this->table ? '&table=' . $this->table : '', 'id="checkLocalization"');
$this->body .= '<label for="checkLocalization">' . BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('localization', TRUE)) . '</label><br />';
$this->body .= '<div class="checkbox">' .
'<label for="checkLocalization">' .
BackendUtility::getFuncCheck($this->id, 'SET[localization]', $this->MOD_SETTINGS['localization'], '', $this->table ? '&table=' . $this->table : '', 'id="checkLocalization"') .
BackendUtility::wrapInHelp('xMOD_csh_corebe', 'list_options', $GLOBALS['LANG']->getLL('localization', TRUE)) .
'</label>' .
'</div>';
}
$this->body .= '
</form>
</div>';
......
......@@ -15,39 +15,15 @@
Form
- - - - - - - - - - - - - - - - - - - - - */
form {
margin: 0;
}
#typo3-docbody form {
margin-bottom: 1.25em;
}
.t3-button,
input,
textarea,
button {
display: inline-block;
margin: 0 0.5em 0.5em 0;
padding: 3px 6px;
vertical-align: middle;
}
input[type=checkbox] {
padding: 0;
}
label {
vertical-align: middle;
min-height: 25px;
line-height: 25px;
}
.checkbox,
.radio,
.checkbox:hover {
height: 13px;
margin-right: 5px;
vertical-align: middle;
width: 13px;
}
\ No newline at end of file
......@@ -9188,14 +9188,10 @@ Decorations (shadows etc.)
/* - - - - - - - - - - - - - - - - - - - - -
Form
- - - - - - - - - - - - - - - - - - - - - */
form {
margin: 0;
}
#typo3-docbody form {
margin-bottom: 1.25em;
}
.t3-button,
input,
textarea,
button {
display: inline-block;
......@@ -9203,22 +9199,6 @@ button {
padding: 3px 6px;
vertical-align: middle;
}
input[type=checkbox] {
padding: 0;
}
label {
vertical-align: middle;
min-height: 25px;
line-height: 25px;
}
.checkbox,
.radio,
.checkbox:hover {
height: 13px;
margin-right: 5px;
vertical-align: middle;
width: 13px;
}
/**
* This file is part of the TYPO3 CMS project.
*
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment