[IOAPPX-314] Fix wrong alignment of content in the Alert component (#…

…282)

## Short description
This PR fixes incorrect alignment of content in the `Alert` component.
Unfortunately, we don't have specific style properties to properly
manage the text blocks in React Native (like `text-box-trim` for web),
so I added manual adjustments via negative margins.

## List of changes proposed in this pull request
- Add negative margins to fix the wrong alignment

### Preview
| Before | After |
|--------|--------|
| ![Simulator Screenshot - iPhone 15 Pro - 2024-06-07 at 10 09
11](https://github.com/pagopa/io-app-design-system/assets/1255491/c7a38988-d752-4aad-b218-529ec1614c7f)
| ![Simulator Screenshot - iPhone 15 Pro - 2024-06-07 at 11 51
03](https://github.com/pagopa/io-app-design-system/assets/1255491/cb8017ec-b976-46ab-b861-f417aa27ba03)
|

#### Details
<img
src="https://github.com/pagopa/io-app-design-system/assets/1255491/9f1488ad-5c26-491d-80a9-fcd6466cc290"
width="320" />
<br />
<img
src="https://github.com/pagopa/io-app-design-system/assets/1255491/2ba6ebc6-a985-4538-b7c0-66f29b581608"
width="320" />

## How to test
1. Launch the example app
2. Go to the **Alert** screen

src/components/alert/Alert.tsx

@@ -23,7 +23,6 @@ import {
 } from "../../core/IOColors";
 import { IOAlertRadius } from "../../core/IOShapes";
 import { IOAlertSpacing } from "../../core/IOSpacing";
-import { IOStyles } from "../../core/IOStyles";
 import { makeFontStyleObject } from "../../utils/fonts";
 import { WithTestID } from "../../utils/types";
 import { IOIconSizeScale, IOIcons, Icon } from "../icons";
@@ -170,7 +169,13 @@ export const Alert = ({
           color={mapVariantStates[variant].foreground}
         />
       </View>
-      <View style={IOStyles.flex}>
+      {/* Sadly we don't have specific alignments style for text
+      in React Native, like `text-box-trim` for CSS. So we
+      have to put these magic numbers after manual adjustments.
+      Tested on both Android and iOS. */}
+      <View
+        style={[!title && { marginTop: -5 }, { marginBottom: -4, flex: 1 }]}
+      >
         {title && (
           <>
             <H4 color={mapVariantStates[variant].foreground}>{title}</H4>