Commit cbeb3392 authored by Felix Kopp's avatar Felix Kopp Committed by Christian Kuhn
Browse files

[BUGFIX] FormEngine paddings, margins, colors, borders

Fixes several layout issues with the FormEngine form:

Adds space between checkbox+label.
Forms element browser link as default button.
Form field header will be a headline h4.
Repairs outer padding and inner padding and borders.

Resolves: #62466
Releases: master
Change-Id: I0dcf1cd2206c0cee63a8353516a3b41b94fd670b
Reviewed-on: http://review.typo3.org/33520

Reviewed-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
Tested-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
Reviewed-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: Christian Kuhn's avatarChristian Kuhn <lolli@schwarzbu.ch>
parent 298f0cc0
......@@ -104,7 +104,7 @@ class CheckboxElement extends AbstractFormElement {
$checkboxId = $additionalInformation['itemFormElID'] . '_' . $c;
$item .= ($c > 0 ? '<br />' : '') . '<input type="checkbox"' . $this->formEngine->insertDefStyle('check')
. ' value="1" name="' . $checkboxName . '"' . $checkboxParameters . $additionalInformation['onFocus'] . $disabled
. ' id="' . $checkboxId . '" />'
. ' id="' . $checkboxId . '" /> '
. '<label for="' . $checkboxId . '">' . htmlspecialchars($selectedItem[0]) . '</label>';
}
}
......
......@@ -2331,7 +2331,7 @@ class FormEngine {
$spriteIcon = IconUtility::getSpriteIcon('actions-insert-record', array(
'title' => htmlspecialchars($this->getLL('l_browse_' . ($mode == 'db' ? 'db' : 'file')))
));
$icons['R'][] = '<a href="#" onclick="' . htmlspecialchars($aOnClick) . '">' . $spriteIcon . '</a>';
$icons['R'][] = '<a href="#" onclick="' . htmlspecialchars($aOnClick) . '" class="btn btn-default">' . $spriteIcon . '</a>';
}
if (!$params['dontShowMoveIcons']) {
if ($sSize >= 5) {
......
......@@ -10,7 +10,9 @@
<!-- ###FIELDTEMPLATE### begin -->
<tr>
<td colspan="2" class="formField-header"><strong>###FIELD_NAME###</strong></td>
<td colspan="2" class="formField-header">
<h4>###FIELD_NAME###</h4>
</td>
</tr>
<tr>
<td colspan="2" class="formField-field">
......
......@@ -15,6 +15,56 @@
TCEforms
- - - - - - - - - - - - - - - - - - - - - */
// Special handling of Tabs within FormEngine
.typo3-TCEforms {
div.typo3-dyntabmenu-divs {
// Override .tab inner padding: for section border
padding: 0;
}
.table {
margin-bottom: 0;
> tbody {
> tr {
> td {
background: none;
&.palette-header {
border-top: 1px solid @gray-light;
h3 {
// Padding and margin are created by table <td>
margin-top: @padding-large-vertical;
margin-bottom: 0;
}
}
.t3-form-palette-fieldset {
margin-bottom: @padding-large-vertical;
.t3-form-palette-field-container {
margin-bottom: @padding-base-vertical;
}
}
table.t3-form-field-group-file {
td {
// Padding coming from outer wrap
padding-left: 0;
}
}
}
}
}
}
}
img.t3-TCEforms-reqImg {
display: block;
position: absolute;
......@@ -96,10 +146,6 @@ td.palette-header {
padding-left: 10px;
}
.typo3-TCEforms .palette-header h3 {
margin-top: 10px;
}
.typo3-TCEforms .bgColor2,
.typo3-TCEforms tr.bgColor2 td {
padding-bottom: 5px;
......@@ -265,6 +311,7 @@ div.typo3-TCEforms div.c-tablayer table > tbody > tr > td > table.wrapperTable >
display: inline-block;
vertical-align: top;
padding-right: 25px;
margin-bottom: 0.5em;
}
.t3-form-palette-field-container .t3-form-palette-field-label,
......@@ -357,11 +404,6 @@ input.typo3-TCEforms-suggest-search {
/* - - - - - - - - - - - - - - - - - - - - -
TCEforms Flexforms
- - - - - - - - - - - - - - - - - - - - - */
/** tabs inside the table => flexforms */
.typo3-TCEforms .typo3-dyntabmenu-divs {
margin-right: 20px;
margin-bottom: 10px;
}
.t3-form-field-label-flex {
border-top: 1px solid #c0c0c0;
......@@ -757,10 +799,6 @@ select option.c-divider {
border-bottom: 1px solid #c0c0c0;
}
.t3-form-palette-fieldset {
border:none;
}
input.typo3-TCEforms-suggest-search {
background-image: url('../../../../icons/gfx/zoom.gif');
background-position: 2px center;
......@@ -903,7 +941,7 @@ TCEforms Sections
.t3-form-field-item {
position: relative;
border: 1px solid transparent;
padding: 7px 0;
padding: 0;
}
.t3-tceforms-widget-null-wrapper + .t3-form-field-item {
......
......@@ -8651,6 +8651,31 @@ table.t3-table > tbody > tr:hover > th {
/* - - - - - - - - - - - - - - - - - - - - -
TCEforms
- - - - - - - - - - - - - - - - - - - - - */
.typo3-TCEforms div.typo3-dyntabmenu-divs {
padding: 0;
}
.typo3-TCEforms .table {
margin-bottom: 0;
}
.typo3-TCEforms .table > tbody > tr > td {
background: none;
}
.typo3-TCEforms .table > tbody > tr > td.palette-header {
border-top: 1px solid #d7d7d7;
}
.typo3-TCEforms .table > tbody > tr > td.palette-header h3 {
margin-top: 12px;
margin-bottom: 0;
}
.typo3-TCEforms .table > tbody > tr > td .t3-form-palette-fieldset {
margin-bottom: 12px;
}
.typo3-TCEforms .table > tbody > tr > td .t3-form-palette-fieldset .t3-form-palette-field-container {
margin-bottom: 6px;
}
.typo3-TCEforms .table > tbody > tr > td table.t3-form-field-group-file td {
padding-left: 0;
}
img.t3-TCEforms-reqImg {
display: block;
position: absolute;
......@@ -8723,9 +8748,6 @@ img.t3-TCEforms-contentchangedPaletteImg {
td.palette-header {
padding-left: 10px;
}
.typo3-TCEforms .palette-header h3 {
margin-top: 10px;
}
.typo3-TCEforms .bgColor2,
.typo3-TCEforms tr.bgColor2 td {
padding-bottom: 5px;
......@@ -8861,6 +8883,7 @@ div.typo3-TCEforms div.c-tablayer table > tbody > tr > td > table.wrapperTable >
display: inline-block;
vertical-align: top;
padding-right: 25px;
margin-bottom: 0.5em;
}
.t3-form-palette-field-container .t3-form-palette-field-label,
.t3-form-palette-field-container .t3-form-palette-field {
......@@ -8938,11 +8961,6 @@ input.typo3-TCEforms-suggest-search {
/* - - - - - - - - - - - - - - - - - - - - -
TCEforms Flexforms
- - - - - - - - - - - - - - - - - - - - - */
/** tabs inside the table => flexforms */
.typo3-TCEforms .typo3-dyntabmenu-divs {
margin-right: 20px;
margin-bottom: 10px;
}
.t3-form-field-label-flex {
border-top: 1px solid #c0c0c0;
padding: 5px;
......@@ -9261,9 +9279,6 @@ select option.c-divider {
border: none;
border-bottom: 1px solid #c0c0c0;
}
.t3-form-palette-fieldset {
border: none;
}
input.typo3-TCEforms-suggest-search {
background-image: url('../../../../icons/gfx/zoom.gif');
background-position: 2px center;
......@@ -9377,7 +9392,7 @@ TCEforms Sections
.t3-form-field-item {
position: relative;
border: 1px solid transparent;
padding: 7px 0;
padding: 0;
}
.t3-tceforms-widget-null-wrapper + .t3-form-field-item {
display: inline-block;
......
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