make address section a nice box, improve rich text link hover

web/src/components/blocks/NeufAddressSectionBlock.tsx

@@ -1,3 +1,4 @@
+import Icon from "../general/Icon";
 import styles from "./neufAddressSectionBlock.module.scss";
 
 export const NeufAddressSectionBlock = () => {
@@ -14,7 +15,8 @@ export const NeufAddressSectionBlock = () => {
           <br />
           <br />
           <a href="https://maps.app.goo.gl/QFw4Cu7eVsnZ42or7" target="_blank">
-            Vis i Google Maps
+            Vis i Google Maps&nbsp;
+            <Icon type="externalLink" />
           </a>
         </div>
       </div>

web/src/components/blocks/neufAddressSectionBlock.module.scss

@@ -2,14 +2,18 @@
   display: grid;
   grid-template-columns: repeat(12, 1fr);
   column-gap: var(--spacing-gap-column);
-  row-gap: var(--spacing-gap-row);
-  align-items: flex-start;
   container-type: inline-size;
-  margin-bottom: var(--spacing-gap-row);
+  margin-bottom: var(--spacing-section-bottom);
 }
 
 .text {
-  grid-column: 2 / span 4;
+  grid-column: 1 / span 5;
+  background: var(--color-background-secondary);
+  margin-right: calc(var(--spacing-gap-column)*-1);
+  padding: var(--spacing-gap-column);
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
 
   h2 {
     margin: 0 0 var(--spacing-s);
@@ -23,18 +27,19 @@
     transition: text-decoration-color var(--transition-easing);
 
     &:hover {
+      opacity: 1;
       text-decoration-color: currentColor;
     }
   }
 }
 
 .map {
-  grid-column: 6 / span 6;
+  grid-column: 6 / span 7;
 
   iframe {
     border: none;
     width: 100%;
-    height: auto;
+    height: 100%;
     min-height: 16rem;
   }
 }
@@ -55,5 +60,6 @@
   .text,
   .map {
     grid-column: 1 / -1;
+    margin-right: 0;
   }
 }

web/src/components/blocks/richTextBlock.module.scss

@@ -99,6 +99,7 @@
     transition: text-decoration-color var(--transition-easing);
 
     &:hover {
+      opacity: 1;
       text-decoration-color: currentColor;
     }
   }