Merge branch 'footer_fixes' into 'development'

Footer fixes

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

src/components/footer/hy-footer-base/hy-footer-base.scss

@@ -9,7 +9,7 @@
   display: flex;
   flex-direction: column-reverse;
   max-height: 100%;
-  padding: 32px 24px 32px 24px;
+  padding: 32px 16px 32px 16px;
   place-content: center space-between;
   position: relative;
   width: 100%;

src/components/footer/hy-footer-base/hy-footer-base.tsx

@@ -91,7 +91,13 @@ export class HyFooterBase implements ComponentInterface {
                 {some &&
                   some.map((s) => {
                     return (
-                      <a href={s.url} class={`hy-footer-base__some__item`} title={s.label} aria-label={s.label}>
+                      <a
+                        aria-label={s.label}
+                        href={s.url}
+                        class={`hy-footer-base__some__item`}
+                        title={s.label}
+                        target="_blank"
+                      >
                         <hy-icon icon={`hy-icon-some-${s.type}`} size={36} />
                       </a>
                     );

src/components/footer/hy-footer-info/hy-footer-info.scss

@@ -6,7 +6,7 @@
   display: flex;
   flex-direction: column;
   max-height: auto;
-  padding: 0 24px 40px 24px;
+  padding: 0 16px 40px 16px;
   place-content: center space-between;
 
   @include breakpoint($medium) {
@@ -79,4 +79,8 @@
       width: 65.56%;
     }
   }
+
+  .hy-accordion__content--inner-wrapper {
+    width: 100%;
+  }
 }

src/components/footer/hy-footer-link-item/hy-footer-link-item.scss

@@ -15,7 +15,7 @@ hy-footer-link-item {
   flex-direction: column;
 
   .hy-footer-link-item:last-child {
-    margin-bottom: 14px;
+    margin-bottom: 16px;
   }
 }
 
@@ -44,6 +44,10 @@ hy-footer-link-item {
     padding: 15px 20px 15px 0;
   }
 
+  @include breakpoint($overwide) {
+    margin-left: 48px;
+  }
+
   &__color-white {
     border-bottom: 1px solid var(--grayscale-white);
     color: var(--grayscale-white);
@@ -74,6 +78,7 @@ hy-footer-link-item {
         color: var(--grayscale-nearly-black);
         font-family: var(--main-font-family);
         text-decoration: none;
+        margin-bottom: 12px;
       }
     }
   }