ADD: shuffle network on page load

components/Services/Services.vue

@@ -27,11 +27,13 @@
     <p class="margin-top">Doch auch wenn ich mal voll ausgelastet bin - keine Sorge!
       Mein <span class="highlight">Netzwerk an Profis</span> kann dir sicher auch weiterhelfen.
     </p>
-    <div class="network-list margin-top">
+    <client-only>
-      <div class="scroll-container default-gap">
+      <div class="network-list margin-top">
-        <Person ref="persons" v-for="person in network" v-bind="person" />
+        <div class="scroll-container default-gap">
+          <Person ref="persons" v-for="person in network" v-bind="person" />
+        </div>
       </div>
-    </div>
+    </client-only>
   </section>
 </template>
 
@@ -83,7 +85,13 @@ const services = [
   }
 ]
 
-const network = [
+
+const shuffle = <T>(unshuffled : T[]) => unshuffled
+    .map(value => ({ value, sort: Math.random() }))
+    .sort((a, b) => a.sort - b.sort)
+    .map(({ value }) => value)
+
+const network = shuffle([
   {
     name: 'Robert Janus',
     img: '/img/network/robert.jpg',
@@ -109,5 +117,5 @@ const network = [
     flavour: 'Effizient und kommunikativ. "You build it, you run it."',
     link: 'https://masagu.dev',
   },
-]
+])
 </script>