diff --git a/Build/Resources/Public/Less/Component/module.less b/Build/Resources/Public/Less/Component/module.less
index 45fe7c1d5efea928b1e1b49944ec9e88248a471a..d3eb97604ff9c7d2367e9e5a6c311f6a69ccbe73 100644
--- a/Build/Resources/Public/Less/Component/module.less
+++ b/Build/Resources/Public/Less/Component/module.less
@@ -71,6 +71,12 @@
min-height: @module-docheader-bar-height;
margin: @module-docheader-bar-margin;
line-height: @module-docheader-bar-height;
+
+ &.row {
+ margin-left: -15px;
+ margin-right: -15px;
+ }
+
label {
margin-top: 0;
margin-bottom: 0;
@@ -101,6 +107,12 @@
padding: ceil(@module-docheader-padding-horizontal / 3) @module-docheader-padding-horizontal;
}
}
+
+ @media (max-width: @screen-sm) {
+ .text-right {
+ text-align: left;
+ }
+ }
}
.module-docheader-bar-search {
margin-bottom: 0;
@@ -113,6 +125,15 @@
}
}
+.module-docheader-bar-navigation {
+ .module-docheader-bar-column-left {
+ white-space: nowrap;
+ }
+ .form-group select {
+ width: 100%;
+ }
+}
+
//
// Body
diff --git a/typo3/sysext/backend/Classes/Template/Components/MetaInformation.php b/typo3/sysext/backend/Classes/Template/Components/MetaInformation.php
index 8452515bd000dca86348350858421184b2a6daed..a5f4e513068ea5cc8652f96a2e836d811ca8d6c4 100644
--- a/typo3/sysext/backend/Classes/Template/Components/MetaInformation.php
+++ b/typo3/sysext/backend/Classes/Template/Components/MetaInformation.php
@@ -19,7 +19,6 @@ use TYPO3\CMS\Core\Imaging\Icon;
use TYPO3\CMS\Core\Imaging\IconFactory;
use TYPO3\CMS\Core\Resource\Exception\InsufficientFolderAccessPermissionsException;
use TYPO3\CMS\Core\Resource\Exception\ResourceDoesNotExistException;
-use TYPO3\CMS\Core\Resource\Folder;
use TYPO3\CMS\Core\Resource\FolderInterface;
use TYPO3\CMS\Core\Resource\ResourceFactory;
use TYPO3\CMS\Core\Utility\GeneralUtility;
@@ -95,10 +94,87 @@ class MetaInformation
* @return string Record info
*/
public function getRecordInformation()
+ {
+ $recordInformations = $this->getRecordInformations();
+ if (!empty($recordInformations)) {
+ $recordInformation = $recordInformations['icon'] .
+ ' <strong>' . htmlspecialchars($recordInformations['title']) . ($recordInformations['uid'] !== '' ? ' [' . $recordInformations['uid'] . ']' : '') . '</strong>' .
+ (!empty($recordInformations['additionalInfo']) ? ' ' . htmlspecialchars($recordInformations['additionalInfo']) : '');
+ } else {
+ $recordInformation = '';
+ }
+ return $recordInformation;
+ }
+
+ /**
+ * Setting page icon
+ *
+ * @return string Record icon
+ */
+ public function getRecordInformationIcon()
+ {
+ $recordInformations = $this->getRecordInformations();
+ if (!empty($recordInformations)) {
+ $recordInformationIcon = $recordInformations['icon'];
+ } else {
+ $recordInformationIcon = null;
+ }
+ return $recordInformationIcon;
+ }
+
+ /**
+ * Setting page title
+ *
+ * @return string Record title
+ */
+ public function getRecordInformationTitle()
+ {
+ $recordInformations = $this->getRecordInformations();
+ if (!empty($recordInformations)) {
+ $title = htmlspecialchars($recordInformations['title']);
+ } else {
+ $title = '';
+ }
+
+ // crop the title to title limit (or 50, if not defined)
+ $beUser = $this->getBackendUser();
+ $cropLength = empty($beUser->uc['titleLen']) ? 50 : $beUser->uc['titleLen'];
+ $croppedTitle = GeneralUtility::fixed_lgd_cs($title, $cropLength);
+ if ($croppedTitle !== $title) {
+ $recordInformationTitle = htmlspecialchars($croppedTitle);
+ } else {
+ $recordInformationTitle = htmlspecialchars($title);
+ }
+
+ return $recordInformationTitle;
+ }
+
+ /**
+ * Setting page uid
+ *
+ * @return null|int Record uid
+ */
+ public function getRecordInformationUid()
+ {
+ $recordInformations = $this->getRecordInformations();
+ if (!empty($recordInformations)) {
+ $recordInformationUid = $recordInformations['uid'];
+ } else {
+ $recordInformationUid = null;
+ }
+ return $recordInformationUid;
+ }
+
+ /**
+ * Setting page array
+ *
+ * @return array Record info
+ */
+ protected function getRecordInformations()
{
$pageRecord = $this->recordArray;
if (empty($pageRecord)) {
- return '';
+ return [];
}
$iconFactory = GeneralUtility::makeInstance(IconFactory::class);
@@ -153,10 +229,13 @@ class MetaInformation
$uid = '0';
$title = $GLOBALS['TYPO3_CONF_VARS']['SYS']['sitename'];
}
- // Setting icon with context menu + uid
- return $theIcon .
- ' <strong>' . htmlspecialchars($title) . ($uid !== '' ? ' [' . $uid . ']' : '') . '</strong>' .
- (!empty($additionalInfo) ? ' ' . htmlspecialchars($additionalInfo) : '');
+ // returns array for icon, title, uid and additional info
+ return [
+ 'uid' => $uid,
+ 'icon' => $theIcon,
+ 'title' => htmlspecialchars($title),
+ 'additionalInfo' => $additionalInfo
+ ];
}
/**
diff --git a/typo3/sysext/backend/Resources/Private/Partials/DocHeader.html b/typo3/sysext/backend/Resources/Private/Partials/DocHeader.html
index 2aa6a33624f14b18e5c422d7b03f47b2f8c75fe0..660d485e6f65008309e21f121c73388dabbeffdf 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/DocHeader.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/DocHeader.html
@@ -1,18 +1,48 @@
<div class="module-loading-indicator"></div>
<div class="module-docheader t3js-module-docheader">
- <div class="module-docheader-bar module-docheader-bar-navigation t3js-module-docheader-bar t3js-module-docheader-bar-navigation">
- <div class="module-docheader-bar-column-left">
- <div class="form-inline">
- <f:for each="{docHeader.menus}" as="menu">
- <div class="form-group form-group-sm">
- <f:render partial="Menus/SelectBoxJumpMenu" arguments="{menu:menu}" />
- </div>
- </f:for>
- </div>
- </div>
- <div class="module-docheader-bar-column-right">
+ <div class="module-docheader-bar module-docheader-bar-navigation t3js-module-docheader-bar t3js-module-docheader-bar-navigation row">
+ <f:if condition="{docHeader.menus}">
+ <f:then>
+ <f:if condition="{docHeader.menus->f:count()} > 1">
+ <f:then>
+ <div class="module-docheader-bar-column-left col-xs-12 col-sm-4 col-md-3">
+ <div class="form-inline row">
+ <f:for each="{docHeader.menus}" as="menu">
+ <div class="form-group form-group-sm col-xs-6">
+ <f:render partial="Menus/SelectBoxJumpMenu" arguments="{menu:menu}"/>
+ </div>
+ </f:for>
+ </div>
+ </div>
+ <div class="module-docheader-bar-column-right col-xs-12 col-sm-8 col-md-9 text-right">
+ </f:then>
+ <f:else>
+ <div class="module-docheader-bar-column-left col-xs-12 col-sm-3">
+ <div class="form-inline">
+ <f:for each="{docHeader.menus}" as="menu">
+ <div class="form-group form-group-sm">
+ <f:render partial="Menus/SelectBoxJumpMenu" arguments="{menu:menu}"/>
+ </div>
+ </f:for>
+ </div>
+ </div>
+ <div class="module-docheader-bar-column-right col-xs-12 col-sm-9 text-right">
+ </f:else>
+ </f:if>
+ </f:then>
+ <f:else>
+ <div class="module-docheader-bar-column-left col-xs-12">
+ </f:else>
+ </f:if>
<f:if condition="{docHeader.metaInformation.recordInformation}">
- <span class="typo3-docheader-pagePath"><f:translate key="LLL:EXT:lang/Resources/Private/Language/locallang_core.xlf:labels.path" />: <f:format.raw>{docHeader.metaInformation.path}</f:format.raw></span> <f:format.raw>{docHeader.metaInformation.recordInformation}</f:format.raw>
+ <span class="typo3-docheader-pagePath">
+ <f:translate key="LLL:EXT:lang/Resources/Private/Language/locallang_core.xlf:labels.path"/>: <f:format.raw>{docHeader.metaInformation.path}</f:format.raw>
+ </span>
+ <strong>
+ <f:format.raw>
+ {docHeader.metaInformation.recordInformationIcon} {docHeader.metaInformation.recordInformationTitle} <f:if condition="docHeader.metaInformation.recordInformationUid}">[{docHeader.metaInformation.recordInformationUid}]</f:if>
+ </f:format.raw>
+ </strong>
</f:if>
</div>
</div>
diff --git a/typo3/sysext/backend/Resources/Public/Css/backend.css b/typo3/sysext/backend/Resources/Public/Css/backend.css
index d74644b2aa1fcd4c2eae00cd3cb2646bea390949..48f2791503ba03a98a3b2f288fa4eea5af461ede 100644
--- a/typo3/sysext/backend/Resources/Public/Css/backend.css
+++ b/typo3/sysext/backend/Resources/Public/Css/backend.css
@@ -8293,6 +8293,10 @@ div.dropdown-menu {
margin: 4px 0;
line-height: 26px;
}
+.module-docheader .module-docheader-bar.row {
+ margin-left: -15px;
+ margin-right: -15px;
+}
.module-docheader .module-docheader-bar label {
margin-top: 0;
margin-bottom: 0;
@@ -8323,6 +8327,11 @@ div.dropdown-menu {
.module-docheader .module-docheader-bar .panel .panel-body {
padding: 8px 24px;
}
+@media (max-width: 768px) {
+ .module-docheader .module-docheader-bar .text-right {
+ text-align: left;
+ }
+}
.module-docheader .module-docheader-bar-search {
margin-bottom: 0;
}
@@ -8332,6 +8341,12 @@ div.dropdown-menu {
.module-docheader .module-docheader-bar-column-right {
float: right;
}
+.module-docheader-bar-navigation .module-docheader-bar-column-left {
+ white-space: nowrap;
+}
+.module-docheader-bar-navigation .form-group select {
+ width: 100%;
+}
.module-body {
padding: 24px 24px;
}