diff --git a/Build/Sources/Sass/backend.scss b/Build/Sources/Sass/backend.scss
index fab2147d5c7d94c7d562b6d11c7a72438677c650..11a8b6cf15a854ecae330f88a53e97edf3029164 100644
--- a/Build/Sources/Sass/backend.scss
+++ b/Build/Sources/Sass/backend.scss
@@ -90,6 +90,7 @@
//
// Modules
//
+@import "module/about";
@import "module/access";
@import "module/extensionmanager";
@import "module/help";
diff --git a/Build/Sources/Sass/module/_about.scss b/Build/Sources/Sass/module/_about.scss
new file mode 100644
index 0000000000000000000000000000000000000000..1b89d87f6c5787e77db115fc678fc8d5ae689fdc
--- /dev/null
+++ b/Build/Sources/Sass/module/_about.scss
@@ -0,0 +1,12 @@
+//
+// Links
+//
+.about-module {
+ a:not([class]) {
+ color: var(--typo3-component-link-color);
+
+ &:hover {
+ color: var(--typo3-component-link-hover-color);
+ }
+ }
+}
diff --git a/typo3/sysext/backend/Resources/Private/Language/Modules/about.xlf b/typo3/sysext/backend/Resources/Private/Language/Modules/about.xlf
index d51388e3eb4b2fe99c186da389f93573b8ff0de7..e05ccdeee92e3fa50def91fb7b365a9bfdbc1bed 100644
--- a/typo3/sysext/backend/Resources/Private/Language/Modules/about.xlf
+++ b/typo3/sysext/backend/Resources/Private/Language/Modules/about.xlf
@@ -54,6 +54,9 @@
<trans-unit id="extension_author" resname="extension_author">
<source>Author</source>
</trans-unit>
+ <trans-unit id="donation.sectionHeadline" resname="donation.sectionHeadline">
+ <source>TYPO3 Donation and community</source>
+ </trans-unit>
<trans-unit id="donation_header" resname="donation_header">
<source>TYPO3 Donation</source>
</trans-unit>
@@ -69,10 +72,19 @@
<trans-unit id="external_thanks" resname="external_thanks">
<source>TYPO3 CMS core uses and thanks these external Open Source projects:</source>
</trans-unit>
+ <trans-unit id="external_libraries.table.column.name" resname="external_libraries.table.column.name">
+ <source>Project name</source>
+ </trans-unit>
+ <trans-unit id="external_libraries.table.column.website" resname="external_libraries.table.column.website">
+ <source>Website</source>
+ </trans-unit>
<trans-unit id="introtext" resname="introtext">
<source>Web Content Management System</source>
</trans-unit>
- <trans-unit id="introtext2" resname="introtext2">
+ <trans-unit id="modules.headline" resname="modules.headline">
+ <source>Modules</source>
+ </trans-unit>
+ <trans-unit id="modules.introtext" resname="modules.introtext">
<source>This is a brief description of the available modules.</source>
</trans-unit>
<trans-unit id="endText" resname="endText">
@@ -81,6 +93,12 @@
<trans-unit id="userInfo" resname="userInfo">
<source>You're logged in as user</source>
</trans-unit>
+ <trans-unit id="link.openModule" resname="link.openModule">
+ <source>Open module</source>
+ </trans-unit>
+ <trans-unit id="link.openModuleWithTitle" resname="link.openModuleWithTitle">
+ <source>Open %1s module</source>
+ </trans-unit>
</body>
</file>
</xliff>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/CoreTeam.html b/typo3/sysext/backend/Resources/Private/Partials/About/CoreTeam.html
index 9a13d6b626d224d439b4661220d47a578d1542a7..2e589e88fcf58187f677aabac23da53978125d12 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/CoreTeam.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/CoreTeam.html
@@ -1,9 +1,9 @@
<div class="card">
<div class="card-body">
- <h2 class="h4 card-title">
+ <h3 class="card-title">
<f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:coredevs" />
- </h2>
- <p>
+ </h3>
+ <p class="card-text">
{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:coredevs_detail') -> f:format.raw()}
</p>
</div>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/Credits.html b/typo3/sysext/backend/Resources/Private/Partials/About/Credits.html
index 055d6eb625234e3a02ae225d6f450b7fa4880c4f..edf60e61c614a409ca61671a0108e2848043e7ad 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/Credits.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/Credits.html
@@ -1,9 +1,9 @@
<div class="card">
<div class="card-body">
- <h2 class="h4 card-title">
+ <h3 class="card-title">
{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:community_credits')}
- </h2>
- <p>
+ </h3>
+ <p class="card-text">
{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:information_detail') -> f:format.raw()}
</p>
</div>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/Donation.html b/typo3/sysext/backend/Resources/Private/Partials/About/Donation.html
index 33786dba30b5aa8612585dbb014115d30f127ae6..93786e149840bb2a7ded9d003777301ca4bda224 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/Donation.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/Donation.html
@@ -1,9 +1,9 @@
<div class="card">
<div class="card-body">
- <h2 class="h4 card-title">
+ <h3 class="card-title">
<f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:donation_header" />
- </h2>
- <p>
+ </h3>
+ <p class="card-text">
{f:translate(key: 'LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:donation_message') -> f:format.raw()}
</p>
<a href="{donationUrl}" class="btn btn-default" title="{f:translate(key:'LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:donation_button')}" target="_blank" rel="noreferrer">
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/Extensions.html b/typo3/sysext/backend/Resources/Private/Partials/About/Extensions.html
index 0ba783accf1091ebb55142344a6872118a827708..d3448d42b2055a1536cd8ec4111ed568db9c130e 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/Extensions.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/Extensions.html
@@ -1,50 +1,38 @@
<f:if condition="{loadedExtensions}">
- <div class="card">
- <div class="card-body">
- <h2 class="h3 card-title">
- <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_authors" />
- </h2>
- <p>
- <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_list_info" />
- </p>
- </div>
- <div class="table-fit">
- <table class="table">
- <thead>
+ <h2>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_authors" />
+ </h2>
+ <p>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_list_info" />
+ </p>
+
+ <div class="table-fit">
+ <table class="table table-striped table-hover table-vertical-top">
+ <thead>
+ <tr>
+ <th><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension" /></th>
+ <th><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_author" /></th>
+ </tr>
+ </thead>
+ <tbody>
+ <f:for each="{loadedExtensions}" as="loadedExtension">
<tr>
- <th width="60%"><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension" /></th>
- <th><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:extension_author" /></th>
- </tr>
- </thead>
- <tbody>
- <f:for each="{loadedExtensions}" as="loadedExtension">
- <tr>
- <td>
- {loadedExtension.title} ({loadedExtension.key})
- </td>
- <td>
+ <td>
+ {loadedExtension.title} ({loadedExtension.key})
+ </td>
+ <td>
+ <f:if condition="{loadedExtension.authors}">
<f:for each="{loadedExtension.authors}" as="extensionAuthor" iteration="i">
- <f:if condition="{extensionAuthor.email}">
- <f:then>
- <f:link.email
- email="{extensionAuthor.email}?subject={f:format.urlencode(value:'Thanks for your {loadedExtension.title} extension')}"
- >
- {extensionAuthor.name}
- </f:link.email>
- </f:then>
- <f:else>
- {extensionAuthor.name}
- </f:else>
- </f:if>
+ {extensionAuthor.name} <f:if condition="{extensionAuthor.email}">({extensionAuthor.email})</f:if>
<f:if condition="{i.isLast} == false">
<br>
</f:if>
</f:for>
- </td>
- </tr>
- </f:for>
- </tbody>
- </table>
- </div>
+ </f:if>
+ </td>
+ </tr>
+ </f:for>
+ </tbody>
+ </table>
</div>
</f:if>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/ExternalLibraries.html b/typo3/sysext/backend/Resources/Private/Partials/About/ExternalLibraries.html
index 64195c9730aacd4663bc9ad2bb8ed3d98f7cafb3..0ac4cb3355333679ec43335ece036c615f654b19 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/ExternalLibraries.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/ExternalLibraries.html
@@ -1,14 +1,19 @@
-<div class="card">
- <div class="card-body">
- <h2 class="h3 card-title">
- <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_libraries" />
- </h2>
- <p>
- <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_thanks" />
- </p>
- </div>
- <div class="table-fit">
- <table class="table">
+<h2>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_libraries" />
+</h2>
+<p>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_thanks" />
+</p>
+
+<div class="table-fit">
+ <table class="table table-striped table-hover">
+ <thead>
+ <tr>
+ <th><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_libraries.table.column.name" /></th>
+ <th><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:external_libraries.table.column.website" /></th>
+ </tr>
+ </thead>
+ <tbody>
<tr>
<td>Composer</td>
<td><a href="https://getcomposer.org" target="_blank" rel="noreferrer">getcomposer.org</a></td>
@@ -145,6 +150,6 @@
<td>SelectPure</td>
<td><a href="https://github.com/dudyn5ky1/select-pure" target="_blank" rel="noreferrer">github.com</a></td>
</tr>
- </table>
- </div>
+ </tbody>
+ </table>
</div>
diff --git a/typo3/sysext/backend/Resources/Private/Partials/About/Modules.html b/typo3/sysext/backend/Resources/Private/Partials/About/Modules.html
index 9a32fbda87baab7e138b90af035e60a9eef1c264..db834a1c26d38dd2d87a6982eadd3e2e7b5e70fa 100644
--- a/typo3/sysext/backend/Resources/Private/Partials/About/Modules.html
+++ b/typo3/sysext/backend/Resources/Private/Partials/About/Modules.html
@@ -1,49 +1,64 @@
+<h2>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:modules.headline" />
+</h2>
<p>
- <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:introtext2" />
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:modules.introtext" />
</p>
<f:for each="{modules}" as="mainModule">
<f:if condition="{mainModule.subModules}">
<f:if condition="{mainModule.title}">
- <h2><f:translate key="{mainModule.title}">{mainModule.title}</f:translate></h2>
+ <h3><f:translate key="{mainModule.title}">{mainModule.title}</f:translate></h3>
</f:if>
<section class="card-container">
<f:for each="{mainModule.subModules}" as="subModule">
- <f:variable name="titleAttribute" value="" />
- <f:if condition="{subModule.shortDescription}">
- <f:variable name="titleAttribute" value="{f:translate(key: subModule.shortDescription, default: subModule.shortDescription)}" />
- </f:if>
- <a
- href="#"
- data-dispatch-action="TYPO3.ModuleMenu.showModule"
- data-dispatch-args-list="{subModule.identifier}"
- title="{titleAttribute}"
- class="card card-size-medium"
- >
+ <div class="card card-size-small">
<div class="card-header">
<div class="card-icon">
- <core:icon identifier="{subModule.iconIdentifier}" size="medium" />
+ <core:icon identifier="{subModule.iconIdentifier}" size="large" />
</div>
- <f:if condition="{subModule.title}">
+ <f:if condition="{subModule.title} || {subModule.shortDescription}">
<div class="card-header-body">
- <h3 class="card-title">
- <f:translate key="{subModule.title}">{subModule.title}</f:translate>
- </h3>
+ <f:if condition="{subModule.title}">
+ <h4 class="card-title">
+ <f:translate key="{subModule.title}">{subModule.title}</f:translate>
+ </h4>
+ </f:if>
<f:if condition="{subModule.shortDescription}">
<span class="card-subtitle">
<f:translate key="{subModule.shortDescription}">{subModule.shortDescription}</f:translate>
</span>
</f:if>
- <f:if condition="{subModule.description}">
- <div class="card-longdesc">
- <f:sanitize.html>
- <f:translate key="{subModule.description}">{subModule.description}</f:translate>
- </f:sanitize.html>
- </div>
- </f:if>
</div>
</f:if>
</div>
- </a>
+ <f:if condition="{subModule.description}">
+ <div class="card-body">
+ <p class="card-text">
+ <f:sanitize.html>
+ <f:translate key="{subModule.description}">{subModule.description}</f:translate>
+ </f:sanitize.html>
+ </p>
+ </div>
+ </f:if>
+ <div class="card-footer">
+ <a
+ href="#"
+ data-dispatch-action="TYPO3.ModuleMenu.showModule"
+ data-dispatch-args-list="{subModule.identifier}"
+ class="btn btn-default"
+ >
+ <f:if condition="{subModule.title}">
+ <f:then>
+ <f:variable name="submoduleTitle"><f:translate key="{subModule.title}">{subModule.title}</f:translate></f:variable>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:link.openModuleWithTitle" arguments="{0: submoduleTitle}" />
+ </f:then>
+ <f:else>
+ <f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:link.openModule" />
+ </f:else>
+ </f:if>
+ </a>
+ </div>
+ </div>
</f:for>
</section>
</f:if>
diff --git a/typo3/sysext/backend/Resources/Private/Templates/About/Index.html b/typo3/sysext/backend/Resources/Private/Templates/About/Index.html
index cb823e0fec821b9d109094294afcf4d1b917a903..2af5d41dab1853066ac446f1f526e9849d010ece 100644
--- a/typo3/sysext/backend/Resources/Private/Templates/About/Index.html
+++ b/typo3/sysext/backend/Resources/Private/Templates/About/Index.html
@@ -7,7 +7,7 @@
<f:section name="Content">
- <div class="container-small about-module">
+ <div class="container about-module">
<f:render partial="About/Logo" arguments="{_all}" />
<f:for each="{messages}" as="message">
@@ -18,6 +18,8 @@
<f:render partial="About/About" arguments="{_all}" />
<f:render partial="About/Modules" arguments="{_all}" />
+
+ <h2><f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:donation.sectionHeadline" /></h2>
<f:render partial="About/Donation" arguments="{_all}" />
<f:render partial="About/Credits" arguments="{_all}" />
<f:render partial="About/CoreTeam" arguments="{_all}" />
@@ -25,7 +27,7 @@
<f:render partial="About/Extensions" arguments="{_all}" />
<p>
- <em class="text-body-secondary">
+ <em>
<f:translate key="LLL:EXT:backend/Resources/Private/Language/Modules/about.xlf:endText" />
</em>
</p>
diff --git a/typo3/sysext/backend/Resources/Public/Css/backend.css b/typo3/sysext/backend/Resources/Public/Css/backend.css
index 1a52235033df44417b603fb75726764979fec04b..71f2530347cdc4570438e3094243a35f9d609642 100644
--- a/typo3/sysext/backend/Resources/Public/Css/backend.css
+++ b/typo3/sysext/backend/Resources/Public/Css/backend.css
@@ -4290,6 +4290,8 @@ pre.ts-hl .ts-comment{color:#666;font-style:italic}
pre.ts-hl .ts-condition{background-color:maroon;color:#fff;font-weight:700}
pre.ts-hl .ts-error{background-color:#ff0;border:1px red dashed;font-weight:700;color:#000}
pre.ts-hl .ts-linenum{background-color:#eee;color:#212424}
+.about-module a:not([class]){color:var(--typo3-component-link-color)}
+.about-module a:not([class]):hover{color:var(--typo3-component-link-hover-color)}
td.permission-column-name{white-space:nowrap}
td.permission-column-list{white-space:nowrap;width:106px}
td.permission-column-group{padding-inline-start:0;width:200px;white-space:nowrap}