Support multiple info links

pages/info.tsx

@@ -116,17 +116,19 @@ const Info = () => {
           classNames='fadeTransition'
         >
           {infoToggles.accom ? (
-            <div>
+            <div className={styles.infoContent}>
               <p>
                 Majoituspalveluita Livonsaari-Velkua: Wanha Salakuljettaja
                 (Teersalo), Livonsaari Caravan, Saaristohotelli Vaihela.
               </p>
+              <div className={styles.linkList}>
                 <a href='https://oldsmuggler.fi/'>Vanha Salakuljettaja</a>
                 <a href='https://www.livonsaarencaravan.fi/'>
                   Livonsaari Caravan
                 </a>
                 <a href='https://vaihela.fi/'>Saaristohotelli Vaihela</a>
               </div>
+            </div>
           ) : (
             <></>
           )}

styles/Info.module.scss

@@ -32,3 +32,19 @@
     transition: color 0.3s;
   }
 }
+
+.infoContent {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.linkList {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+
+  a {
+    margin-bottom: 1rem;
+  }
+}

styles/globals.scss

@@ -14,7 +14,7 @@ p {
 }
 
 a {
-  color: #8962ec;
+  color: #7e54e7;
   text-decoration: underline;
 }