diff --git a/Build/Sources/TypeScript/install/Resources/Public/TypeScript/Module/Settings/Features.ts b/Build/Sources/TypeScript/install/Resources/Public/TypeScript/Module/Settings/Features.ts
index 0e4cb99960d26b683e5b4fa0d1d86455f65e5ca6..ac4e7b52de40bc72db7b3dc4b70390616a1967e1 100644
--- a/Build/Sources/TypeScript/install/Resources/Public/TypeScript/Module/Settings/Features.ts
+++ b/Build/Sources/TypeScript/install/Resources/Public/TypeScript/Module/Settings/Features.ts
@@ -74,6 +74,7 @@ class Features extends AbstractInteractableModule {
data.status.forEach((element: any): void => {
Notification.showMessage(element.title, element.message, element.severity);
});
+ this.getContent();
} else {
Notification.error('Something went wrong');
}
diff --git a/typo3/sysext/install/Classes/Controller/SettingsController.php b/typo3/sysext/install/Classes/Controller/SettingsController.php
index 04d8876c208b72cd33712d716d7d8763832e1d90..e3197f26efa5954402931a877fe85d31d269d153 100644
--- a/typo3/sysext/install/Classes/Controller/SettingsController.php
+++ b/typo3/sysext/install/Classes/Controller/SettingsController.php
@@ -450,6 +450,7 @@ class SettingsController extends AbstractController
if (isset($configurationDescription['SYS']['items']['features']['items'][$featureName]['description'])) {
$default = $configurationManager->getDefaultConfigurationValueByPath('SYS/features/' . $featureName);
$features[] = [
+ 'label' => ucfirst(str_replace(['_', '.'], ' ', strtolower(GeneralUtility::camelCaseToLowerCaseUnderscored(preg_replace('/\./', ': ', $featureName, 1))))),
'name' => $featureName,
'description' => $configurationDescription['SYS']['items']['features']['items'][$featureName]['description'],
'default' => $default,
diff --git a/typo3/sysext/install/Resources/Private/Templates/Settings/FeaturesGetContent.html b/typo3/sysext/install/Resources/Private/Templates/Settings/FeaturesGetContent.html
index 376937221dba823c2c06fdbeced035c99fd2dc84..9d272bd79013274981ab6b8901605839697fcb0f 100644
--- a/typo3/sysext/install/Resources/Private/Templates/Settings/FeaturesGetContent.html
+++ b/typo3/sysext/install/Resources/Private/Templates/Settings/FeaturesGetContent.html
@@ -5,29 +5,41 @@
use new features of TYPO3 that may be activated on new installations but upgrading installations
can still use the old behaviour.
</p>
+<p>
+ <strong>Available features:</strong>
+</p>
<div class="t3js-module-content" data-features-save-token="{featuresSaveToken}">
- <strong>Available features:</strong>
<form method="post" class="form-horizontal">
- <f:for each="{features}" as="feature">
- <div class="checkbox checkbox-type-labeled-toggle">
- <input type="checkbox" class="checkbox-input"
- value="1"
- name="install[values][{feature.name}]"
- id="t3-install-tool-features-{feature.name}"
- {f:if(condition: '{feature.value} == 1', then: 'checked="checked"')}
- >
- <label class="checkbox-label" for="t3-install-tool-features-{feature.name}">
- <span class="checkbox-label-switch">
- <span class="checkbox-label-switch-checked">On</span>
- <span class="checkbox-label-switch-unchecked">Off</span>
- </span>
- <span class="checkbox-label-text">
- {feature.name} (default {f:if(condition: '{feature.default} == 1', then: 'on', else: 'off')}): {feature.description}
- </span>
- </label>
- </div>
- </f:for>
+ <div class="card-container">
+ <f:for each="{features}" as="feature" iteration="iterator">
+ <div class="card card-size-large">
+ <div class="card-header">
+ <h4>{feature.label}</h4>
+ </div>
+ <div class="card-content">
+ <div class="checkbox checkbox-type-toggle">
+ <input
+ type="checkbox"
+ class="checkbox-input"
+ value="1"
+ name="install[values][{feature.name}]"
+ id="t3-install-tool-features-{feature.name}"
+ {f:if(condition: '{feature.value} == 1', then: 'checked="checked"')}
+ />
+ <label class="checkbox-label" for="t3-install-tool-features-{feature.name}">
+ <span class="checkbox-label-text" style="margin-top: -4px; padding-left: 12px;">
+ <span>
+ {feature.description}<br/>
+ <strong>Default setting: {f:if(condition: '{feature.default} == 1', then: 'Enabled', else: 'Disabled')}</strong>
+ </span>
+ </span>
+ </label>
+ </div>
+ </div>
+ </div>
+ </f:for>
+ </div>
</form>
</div>
</html>
diff --git a/typo3/sysext/install/Resources/Public/JavaScript/Module/Settings/Features.js b/typo3/sysext/install/Resources/Public/JavaScript/Module/Settings/Features.js
index 018d53764d295f6c193af46355f9639d0c4bf6ac..d8cbd7a83bc098ff71ae7bfbac454b353281ee37 100644
--- a/typo3/sysext/install/Resources/Public/JavaScript/Module/Settings/Features.js
+++ b/typo3/sysext/install/Resources/Public/JavaScript/Module/Settings/Features.js
@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
-define(["require","exports","jquery","../AbstractInteractableModule","TYPO3/CMS/Backend/Modal","TYPO3/CMS/Backend/Notification","TYPO3/CMS/Core/Ajax/AjaxRequest","../../Router"],(function(e,t,s,a,n,r,o,i){"use strict";class c extends a.AbstractInteractableModule{constructor(){super(...arguments),this.selectorSaveTrigger=".t3js-features-save"}initialize(e){this.currentModal=e,this.getContent(),e.on("click",this.selectorSaveTrigger,e=>{e.preventDefault(),this.save()})}getContent(){const e=this.getModalBody();new o(i.getUrl("featuresGetContent")).get({cache:"no-cache"}).then(async t=>{const s=await t.resolve();!0===s.success&&"undefined"!==s.html&&s.html.length>0?(e.empty().append(s.html),n.setButtons(s.buttons)):r.error("Something went wrong")},t=>{i.handleAjaxError(t,e)})}save(){const e=this.getModalBody(),t=this.getModuleContent().data("features-save-token"),a={};s(this.findInModal("form").serializeArray()).each((e,t)=>{a[t.name]=t.value}),a["install[action]"]="featuresSave",a["install[token]"]=t,new o(i.getUrl()).post(a).then(async e=>{const t=await e.resolve();!0===t.success&&Array.isArray(t.status)?t.status.forEach(e=>{r.showMessage(e.title,e.message,e.severity)}):r.error("Something went wrong")},t=>{i.handleAjaxError(t,e)})}}return new c}));
\ No newline at end of file
+define(["require","exports","jquery","../AbstractInteractableModule","TYPO3/CMS/Backend/Modal","TYPO3/CMS/Backend/Notification","TYPO3/CMS/Core/Ajax/AjaxRequest","../../Router"],(function(e,t,s,a,n,r,o,i){"use strict";class c extends a.AbstractInteractableModule{constructor(){super(...arguments),this.selectorSaveTrigger=".t3js-features-save"}initialize(e){this.currentModal=e,this.getContent(),e.on("click",this.selectorSaveTrigger,e=>{e.preventDefault(),this.save()})}getContent(){const e=this.getModalBody();new o(i.getUrl("featuresGetContent")).get({cache:"no-cache"}).then(async t=>{const s=await t.resolve();!0===s.success&&"undefined"!==s.html&&s.html.length>0?(e.empty().append(s.html),n.setButtons(s.buttons)):r.error("Something went wrong")},t=>{i.handleAjaxError(t,e)})}save(){const e=this.getModalBody(),t=this.getModuleContent().data("features-save-token"),a={};s(this.findInModal("form").serializeArray()).each((e,t)=>{a[t.name]=t.value}),a["install[action]"]="featuresSave",a["install[token]"]=t,new o(i.getUrl()).post(a).then(async e=>{const t=await e.resolve();!0===t.success&&Array.isArray(t.status)?(t.status.forEach(e=>{r.showMessage(e.title,e.message,e.severity)}),this.getContent()):r.error("Something went wrong")},t=>{i.handleAjaxError(t,e)})}}return new c}));
\ No newline at end of file