Merge branch 'NXSTAGE-X-Introduction_padding-fix' into 'development'

Small introduction positioning fix

See merge request julkiset-sivut/design-system-lib!110

src/components/hy-introduction/hy-introduction.scss

@@ -3,6 +3,12 @@
 }
 
 .hy-introduction {
+  &__content {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+  }
+
   &--reversed {
     .hy-introduction__outer-content {
       align-items: flex-end;

src/index.html

@@ -211,7 +211,40 @@
               <hy-paragraph-text>Accordion content</hy-paragraph-text>
             </hy-accordion-item>
           </hy-accordion-container>
-
+          <hy-introduction
+            variant="blue"
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            variant="black"
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            reversed
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+            image-url="https://www.helsinki.fi/sites/default/files/styles/16_9_huge/public/kukkataedit_ja_-sedaet-6_0.jpg"
+          ></hy-introduction>
+          <hy-introduction
+            text-title="This is an introduction"
+            text-description="Highly cited researchers at the University of Helsinki, Centres of Excellence selected by the Academy of Finland and projects funded by the European Research Council."
+            url="https://www.google.com"
+            url-title="Check this link"
+            sc-label="label for link"
+          ></hy-introduction>
           <hy-paragraph-text>
             THIS IS Pagination
           </hy-paragraph-text>