Updating Teams Page again (#487)

Closes #489, #74, #304 and #399 

- [x] still need links, roles, and pics for several members
- [x] could probably use better images for SAB
- [x] may need help removing default profile pictures for alumni (if
possible), just turning into a text list or table

---------

Co-authored-by: Vincent Rubinetti <vince.rubinetti@gmail.com>

frontend/public/mockServiceWorker.js

@@ -2,7 +2,7 @@
 /* tslint:disable */
 
 /**
- * Mock Service Worker (2.0.2).
+ * Mock Service Worker (2.0.9).
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
  * - Please do NOT serve this file on production.

frontend/src/components/AppMember.vue

@@ -4,8 +4,8 @@
 
 <template>
   <AppLink :to="link || ''" class="member">
-    <div class="image">
-      <img class="portrait" :src="src" :alt="name" loading="lazy" />
+    <div v-if="!noImage" class="image">
+      <img class="portrait" :src="src" alt="" loading="lazy" />
     </div>
     <div class="text">
       <div class="name">{{ name }}</div>
@@ -25,6 +25,8 @@ type Props = {
   role?: string;
   /** link to bio */
   link?: string;
+  /** hide image */
+  noImage?: true;
 };
 
 const props = defineProps<Props>();

frontend/src/components/AppPredicateBadge.vue

@@ -34,8 +34,8 @@ const arrowDirection = computed(() =>
       ? "up"
       : "left"
     : props.vertical
-    ? "down"
-    : "right",
+      ? "down"
+      : "right",
 );
 </script>
 

frontend/src/components/AppTable.vue

@@ -384,8 +384,8 @@ const widths = computed((): string =>
       col.slot === "divider"
         ? "20px"
         : expanded.value
-        ? `minmax(max-content, 99999px)`
-        : `${col.width || 1}fr`,
+          ? `minmax(max-content, 99999px)`
+          : `${col.width || 1}fr`,
     )
     .join(" "),
 );

frontend/src/pages/about/PageTeam.vue

@@ -29,14 +29,15 @@
       {{ group.name }}
     </AppHeading>
     <AppGroup :name="group.name" :link="group.link" />
-    <AppGallery :cols="group.name.includes('Alumni') ? 5 : 4">
+    <AppGallery :cols="group.name.includes('Alumni') ? 6 : 4">
       <template v-if="!group.type">
         <AppMember
           v-for="(member, memberIndex) in group.members"
           :key="memberIndex"
           :name="member.name"
           :role="'role' in member ? member.role : ''"
-          :link="member.link"
+          :link="'link' in member ? member.link : ''"
+          :no-image="group.name.includes('Alumni') ? true : undefined"
         />
       </template>
       <template v-else>