diff --git a/Build/Sources/Sass/component/_form.scss b/Build/Sources/Sass/component/_form.scss
index 336e72bc0eb584aed4f07eed38455c8d2577298b..34921f9e147f352eb5955a44606ec3e3dc4375cd 100644
--- a/Build/Sources/Sass/component/_form.scss
+++ b/Build/Sources/Sass/component/_form.scss
@@ -69,6 +69,12 @@
margin-bottom: var(--typo3-spacing);
}
+.form-text {
+ .file-extension-list {
+ padding-left: 0;
+ }
+}
+
.form-group-dashed {
& + .form-group-dashed {
padding-top: var(--typo3-spacing);
diff --git a/typo3/sysext/backend/Classes/View/FolderUtilityRenderer.php b/typo3/sysext/backend/Classes/View/FolderUtilityRenderer.php
index 13aec52c0b04091bd8e4271cb7dec62de42fca6a..313f7aa42037b181bfd41ed256f73a19a530cb96 100644
--- a/typo3/sysext/backend/Classes/View/FolderUtilityRenderer.php
+++ b/typo3/sysext/backend/Classes/View/FolderUtilityRenderer.php
@@ -125,7 +125,7 @@ class FolderUtilityRenderer
$fileNameVerifier = GeneralUtility::makeInstance(FileNameValidator::class);
foreach ($list as $fileExt) {
if (($fileExt === '*' && !$denyList) || $fileNameVerifier->isValid('.' . $fileExt)) {
- $allowedOnlineMediaList[] = '<span class="badge badge-' . ($denyList ? 'danger' : 'success') . '">' . strtoupper(htmlspecialchars($fileExt)) . '</span>';
+ $allowedOnlineMediaList[] = '<li class="badge badge-' . ($denyList ? 'danger' : 'success') . '">' . strtoupper(htmlspecialchars($fileExt)) . '</li>';
}
}
$markup = [];
@@ -134,7 +134,7 @@ class FolderUtilityRenderer
$markup[] = ' <label>';
$markup[] = htmlspecialchars($lang->sL('LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:cm.' . ($denyList ? 'disallowedFileExtensions' : 'allowedFileExtensions'))) . '<br/>';
$markup[] = ' </label>';
- $markup[] = ' <div>' . implode(' ', $allowedOnlineMediaList) . '</div>';
+ $markup[] = ' <ul>' . implode(' ', $allowedOnlineMediaList) . '</ul>';
$markup[] = '</div>';
}
@@ -177,7 +177,7 @@ class FolderUtilityRenderer
if ($fileNameVerifier->isValid('.' . $supportedFileExtension)
&& ($fileExtensionFilter === null || $fileExtensionFilter->isAllowed($supportedFileExtension))
) {
- $allowedOnlineMediaList[$supportedFileExtension] = '<span class="badge badge-success">' . strtoupper(htmlspecialchars($supportedFileExtension)) . '</span>';
+ $allowedOnlineMediaList[$supportedFileExtension] = '<li class="badge badge-success">' . strtoupper(htmlspecialchars($supportedFileExtension)) . '</li>';
}
}
if (!empty($allowedOnlineMediaList)) {
@@ -202,9 +202,9 @@ class FolderUtilityRenderer
$markup[] = '<div class="col-auto">';
$markup[] = $lang->sL('LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:online_media.new_media.allowedProviders');
$markup[] = '</div>';
- $markup[] = '<div class="col">';
+ $markup[] = '<ul>';
$markup[] = implode(' ', $allowedOnlineMediaList);
- $markup[] = '</div>';
+ $markup[] = '</ul>';
$markup[] = '</div>';
$markup[] = '</div>';
$markup[] = '</form>';
diff --git a/typo3/sysext/backend/Resources/Private/Templates/Form/FilesControlContainer.html b/typo3/sysext/backend/Resources/Private/Templates/Form/FilesControlContainer.html
index 309fd94423792ead56afa6cd186698abdb6d5b74..e448f95cc4c96d528170b5a1a4a53bb73fb1b7f5 100644
--- a/typo3/sysext/backend/Resources/Private/Templates/Form/FilesControlContainer.html
+++ b/typo3/sysext/backend/Resources/Private/Templates/Form/FilesControlContainer.html
@@ -16,15 +16,19 @@
<f:if condition="{allowedFileExtensions}">
<f:then>
<f:translate key="LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:cm.allowedFileExtensions"/><br>
- <f:for each="{allowedFileExtensions}" as="allowedFileExtension">
- <span class="badge badge-success">{allowedFileExtension}</span>
- </f:for>
+ <ul class="file-extension-list">
+ <f:for each="{allowedFileExtensions}" as="allowedFileExtension">
+ <li class="badge badge-success">{allowedFileExtension}</li>
+ </f:for>
+ </ul>
</f:then>
<f:else if="{disallowedFileExtensions}">
<f:translate key="LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:cm.disallowedFileExtensions"/><br>
- <f:for each="{disallowedFileExtensions}" as="disallowedFileExtension">
- <span class="badge badge-danger">{disallowedFileExtension}</span>
- </f:for>
+ <ul>
+ <f:for each="{disallowedFileExtensions}" as="disallowedFileExtension">
+ <li class="badge badge-danger">{disallowedFileExtension}</li>
+ </f:for>
+ </ul>
</f:else>
</f:if>
</div>
diff --git a/typo3/sysext/backend/Resources/Public/Css/backend.css b/typo3/sysext/backend/Resources/Public/Css/backend.css
index 3ebfa391b74c74244e0303dc96d47b10f2d084b5..0138ff019206bfd49b71497e43f5b80426a3cb57 100644
--- a/typo3/sysext/backend/Resources/Public/Css/backend.css
+++ b/typo3/sysext/backend/Resources/Public/Css/backend.css
@@ -3682,6 +3682,7 @@ a.card:hover{--typo3-card-border-color:var(--typo3-card-hover-border-color);text
.form-description{opacity:.75;margin-bottom:.5rem}
.form-label+.form-description{margin-top:-.25rem}
.form-group{margin-bottom:var(--typo3-spacing)}
+.form-text .file-extension-list{padding-left:0}
.form-group-dashed+.form-group-dashed{padding-top:var(--typo3-spacing);border-top:1px dashed rgba(0,0,0,.15)}
.form-group-search-result{padding-bottom:7px}
.form-wizard-icon-list{color-scheme:light dark;color:var(--typo3-component-color);background:var(--typo3-component-bg);border:var(--typo3-component-border-width) solid var(--typo3-component-border-color);border-radius:var(--bs-border-radius);margin-top:.25rem;padding:calc(var(--typo3-spacing)/ 4);display:flex;flex-wrap:wrap;gap:2px}
diff --git a/typo3/sysext/filelist/Resources/Private/Templates/File/CreateFile.html b/typo3/sysext/filelist/Resources/Private/Templates/File/CreateFile.html
index d3a95bf5992953d98d6deefbc5724547b8b95695..1e214474ea809be945b5954943639bb283e684d3 100644
--- a/typo3/sysext/filelist/Resources/Private/Templates/File/CreateFile.html
+++ b/typo3/sysext/filelist/Resources/Private/Templates/File/CreateFile.html
@@ -22,10 +22,12 @@
<input required class="form-control" type="text" id="newMedia" name="data[newMedia][0][url]"
placeholder="{f:translate(key: 'LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:online_media.new_media.placeholder')}" />
<div class="form-text">
- <f:translate key="LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:online_media.new_media.allowedProviders" /><br>
- <f:for each="{fileExtList}" as="fileExt">
- <span class="badge badge-success">{fileExt}</span>
- </f:for>
+ <f:translate key="LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:online_media.new_media.allowedProviders" />
+ <ul class="file-extension-list">
+ <f:for each="{fileExtList}" as="fileExt">
+ <li class="badge badge-success">{fileExt}</li>
+ </f:for>
+ </ul>
</div>
</div>
</div>
@@ -50,9 +52,11 @@
<input required class="form-control" type="text" id="newfile" name="data[newfile][0][data]" />
<div class="form-text">
<f:translate key="LLL:EXT:core/Resources/Private/Language/locallang_core.xlf:cm.allowedEditableTextFileExtensions" /><br>
- <f:for each="{txtFileExtList}" as="fileExt">
- <span class="badge badge-success">{fileExt}</span>
- </f:for>
+ <ul class="file-extension-list">
+ <f:for each="{txtFileExtList}" as="fileExt">
+ <li class="badge badge-success">{fileExt}</li>
+ </f:for>
+ </ul>
</div>
</div>
</div>