fix(ui5-li-notification-group): align priority icon

[ilhan007]

Background
The avatar slot give users the freedom to add their own images, icons or to use the available ui5-avatar web component. We don't want to restrict the size of the avatar internally, so whenever the users set ui5-avatar size="XS", ui5-avatar size="M", ui5-avatar size="XL".. they get what they expect.
However, we explain that for best experience we recommend using images/avatars 32px X 32px. With this size, the priority icons are perfectly aligned across the NotificationListGroupItem and its children - NotificationLisItem(s).
In all our test pages and playground samples we use the ui5-avatar with size="XS", which results in 32px X 32px, but it turns out a degradation has been introduced and the XS size of the ui5-avatar appears bigger than expected. For that, there is a PR #2582 already merged.
Now the alignment with a custom image 32px X 32px or ui5-avatar with size="XS" will look like on the image below:

Prerequisite: #2582 (merged already)

Change: adjust the margin of the NotificationListGroupItem's expand/collapse button to align the priority icon
and document the recommended avatar size.

[TeodorTaushanov]

margin-right: 1.25rem;
margin-left: 0.5rem;

[ilhan007]

Thanks for the feedback, Teo.

Just to clarify, in openui5 the toggle button has margin-right: 0.75rem

.sapMNLGroupCollapseButton {
       margin-right: 0.75rem;
       min-width: 2.25rem;
       max-width: 2.25rem;
}

When I apply margin-right: 0.75 rem the result is: (seems aligned to me)

When I apply margin-right: 1.25rem; and margin-left: 0.5rem; the result is (not quite aligned):

[TeodorTaushanov]

I rechecked it. The alignment is correct.