fix: fixed classes, margins and paddings of alertBlock to align text …

…to other elements
RedTurtle · Sep 20, 2023 · fded095 · fded095
1 parent c2e9aaa
commit fded095
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 3 deletions.
diff --git a/src/components/ItaliaTheme/Blocks/Alert/View.jsx b/src/components/ItaliaTheme/Blocks/Alert/View.jsx
@@ -29,9 +29,9 @@ const View = ({ data, pathname }) => {
 
   return (
     <section role="alert" className="block alertblock">
-      <Row className={cx('row-full-width', 'bg-alert-' + data.color)}>
+      <div className={cx('full-width', 'bg-alert-' + data.color)}>
         <Container className="p-4 pt-5 pb-5">
-          <Row className="align-items-start">
+          <Row className="align-items-start negative-margin">
             {data.image?.data && (
               <Col sm={2} className="pb-3 image-col">
                 <img
@@ -46,7 +46,7 @@ const View = ({ data, pathname }) => {
             <Col>{content}</Col>
           </Row>
         </Container>
-      </Row>
+      </div>
     </section>
   );
 };

diff --git a/src/theme/ItaliaTheme/Blocks/_alert.scss b/src/theme/ItaliaTheme/Blocks/_alert.scss
@@ -1,6 +1,10 @@
 .public-ui {
   .block.alertblock,
   .alertblock {
+    .full-width {
+      height: auto;
+    }
+
     .bg-alert-danger {
       background-color: #a32219;
       color: $white;
@@ -67,6 +71,15 @@
       }
     }
 
+    .negative-margin {
+      margin-left: -6px;
+      margin-right: -6px;
+
+      .col {
+        padding: 0px 6px;
+      }
+    }
+
     .DraftEditor-root {
       background: none;
     }