Bug #93181

Epic #93119: Bootstrap v5 migration

"alert media" body message misaligned with the icon

Added by Riccardo De Contardi 6 months ago. Updated about 2 months ago.

Status:
Under Review
Priority:
Should have
Assignee:
-
Category:
Backend User Interface
Target version:
-
Start date:
2020-12-29
Due date:
% Done:

0%

Estimated time:
TYPO3 Version:
11
PHP Version:
7.4
Tags:
UI
Complexity:
Is Regression:
Sprint Focus:

Description

I reproduced this issue using the Log module, and deleting one error entry, but I guess it affects also other parts of the backend:

The text of the message is misaligned with the icon, see the attached screenshot

I suggest to add to the CSS something like:

.media .media-left+.media-body {
   align-self:center
}

or

.alert .media{
   align-items:center
}

Plus, the text seems a bit too small (10.8px) but this could be just my opinion, this is why I would recommend to remove or override

.alert-body, .alert-message{
 font-size: .9em
}

Files

Schermata 2020-12-29 alle 10.59.46.png (60.8 KB) Schermata 2020-12-29 alle 10.59.46.png Riccardo De Contardi, 2020-12-29 10:04

Related issues

Related to TYPO3 Core - Task #93998: Text in info box not vertically centeredResolved2021-04-27

Actions
#1

Updated by Riccardo De Contardi 6 months ago

  • Parent task set to #93119
#2

Updated by Gerrit Code Review about 2 months ago

  • Status changed from New to Under Review

Patch set 2 for branch master of project Packages/TYPO3.CMS has been pushed to the review server.
It is available at https://review.typo3.org/c/Packages/TYPO3.CMS/+/68890

#3

Updated by Oliver Bartsch about 2 months ago

  • Related to Task #93998: Text in info box not vertically centered added

Also available in: Atom PDF