@dcrackel/hematournamentui 1.0.706 → 1.0.707

package/src/stories/Organisms/Cards/PoolFencerCard/PoolFencerCard.stories.js

@@ -1,34 +1,31 @@
 import PoolFencerCard from './PoolFencerCard.vue';
 
 export default {
-    title: 'Organisms/Cards/PoolFencerCard',
-    component: PoolFencerCard,
-    tags: ['autodocs'],
-    args: {
-        position: 1,
-        poolPosition: 1,
-        portrait: 'https://randomuser.me/api/portraits/men/31.jpg',
-        name: 'John Doe',
-        club: 'Test Club',
-        background: 'bg-poolSetup'
-    },
-    argTypes: {
-        position: { control: 'number' },
-        portrait: { control: 'text' },
-        name: { control: 'text' },
-        club: { control: 'text' },
-        background: { control: 'text' },
-    },
+  title: 'Organisms/Cards/PoolFencerCard',
+  component: PoolFencerCard,
+  tags: ['autodocs'],
+  args: {
+    position: 1,
+    poolPosition: 1,
+    portrait: 'https://randomuser.me/api/portraits/men/31.jpg',
+    name: 'John Doe',
+    club: 'Test Club',
+    background: 'bg-poolSetup'
+  },
+  argTypes: {
+    position: { control: 'number' },
+    portrait: { control: 'text' },
+    name: { control: 'text' },
+    club: { control: 'text' },
+    background: { control: 'text' }
+  }
 };
 
-
 export const Default = {
-    args: {
-        position: 1,
-        portrait: 'https://randomuser.me/api/portraits/men/24.jpg',
-        name: 'John Doe',
-        club: 'Test Club',
-    }
-}
-
-
+  args: {
+    position: 1,
+    portrait: 'https://randomuser.me/api/portraits/men/24.jpg',
+    name: 'John Doe',
+    club: 'Test Club'
+  }
+};

package/src/stories/Organisms/Cards/PoolFencerCard/PoolFencerCard.vue

@@ -1,15 +1,15 @@
 <template>
   <div
-      :class="computedClasses"
-      :draggable="computedDraggable"
-      @dragstart="onDragStart"
-      @dragover.prevent
-      @dragenter.prevent
-      @drop="onDrop"
-      @click="handleClick"
+    :class="computedClasses"
+    :draggable="computedDraggable"
+    @dragstart="onDragStart"
+    @dragover.prevent
+    @dragenter.prevent
+    @drop="onDrop"
+    @click="handleClick"
   >
     <div v-if="mode !== 'person'" class="text-center mr-2 w-4">
-      <BaseText :text="poolPosition" size="md" color="quaternary"/>
+      <BaseText :text="poolPosition" size="md" color="quaternary" />
     </div>
     <div class="w-9 h-9 rounded-md overflow-hidden">
       <div v-if="!portrait" class="w-14 h-14 bg-dropdownSelect flex items-center justify-center">
@@ -29,8 +29,8 @@
 </template>
 
 <script>
-import BaseText from "../../../Atoms/Text/BaseText.vue";
-import BaseIcon from "../../../Atoms/Icon/BaseIcon.vue";
+import BaseText from '../../../Atoms/Text/BaseText.vue';
+import BaseIcon from '../../../Atoms/Icon/BaseIcon.vue';
 
 export default {
   components: { BaseIcon, BaseText },
@@ -48,19 +48,20 @@ export default {
       required: true
     },
     club: {
-      type: String,
+      type: String
     },
     seed: {
       type: Number,
       required: true
     },
     portrait: {
-      type: String,
+      type: String
     },
     mode: {
       type: String,
       required: true,
-      validator: value => ['planning','preparation','live','custompool','results','de','completed','person'].includes(value)
+      validator: value =>
+        ['planning', 'preparation', 'live', 'custompool', 'results', 'de', 'completed', 'person'].includes(value)
     },
     background: {
       type: String,
@@ -81,7 +82,9 @@ export default {
     },
     computedClasses() {
       const baseClasses = `flex items-center p-2 shadow rounded-lg ${this.customClass}`;
-      return this.canEdit ? `${baseClasses} hover:bg-dropdownSelect ${this.background}` : `${baseClasses} ${this.background}`;
+      return this.canEdit
+        ? `${baseClasses} hover:bg-dropdownSelect ${this.background}`
+        : `${baseClasses} ${this.background}`;
     },
     computedDraggable() {
       if (this.customDraggable !== null) return this.customDraggable;
@@ -91,13 +94,16 @@ export default {
   methods: {
     onDragStart(event) {
       if (this.canEdit) {
-        event.dataTransfer.setData('text/plain', JSON.stringify({
-          fromPosition: this.poolPosition,
-          name: this.name,
-  emits: ['swap-fencers', 'update:click'],
-          club: this.club,
-          seed: this.seed
-        }));
+        event.dataTransfer.setData(
+          'text/plain',
+          JSON.stringify({
+            fromPosition: this.poolPosition,
+            name: this.name,
+            emits: ['swap-fencers', 'update:click'],
+            club: this.club,
+            seed: this.seed
+          })
+        );
       }
     },
     onDrop(event) {
@@ -111,5 +117,5 @@ export default {
       this.$emit('update:click');
     }
   }
-}
+};
 </script>

package/src/stories/Organisms/Cards/StaffCard/StaffCard.stories.js

@@ -2,72 +2,72 @@ import getAllStaffByTournamentId from '../../../../mocks/getAllStaffByTournament
 import StaffCard from './StaffCard.vue';
 
 export default {
-    title: 'Organisms/Cards/StaffCard',
-    component: StaffCard,
-    tags: ['autodocs'],
-    args: {
-        staff: {
-            "Id": 2,
-            "TournamentId": 4,
-            "EventId": 5,
-            "PoolId": 102,
-            "PersonId": 23,
-            "Role": "Director",
-            "Person": {
-                "DisplayName": "Lucas Garcia",
-                "Club": {
-                    "ClubId": 1,
-                    "Name": "Acme Fencing Club"
-                },
-                "Images": [
-                    {
-                        "URL": "https://randomuser.me/api/portraits/men/77.jpg"
-                    }
-                ]
-            },
-            "Pool": {
-                "PoolId": 102,
-                "Name": "Pool 1",
-                "RingName": "Ring 1"
-            }
-        }
-    },
-    argTypes: {
-        staff: {
-            control: 'object'
+  title: 'Organisms/Cards/StaffCard',
+  component: StaffCard,
+  tags: ['autodocs'],
+  args: {
+    staff: {
+      Id: 2,
+      TournamentId: 4,
+      EventId: 5,
+      PoolId: 102,
+      PersonId: 23,
+      Role: 'Director',
+      Person: {
+        DisplayName: 'Lucas Garcia',
+        Club: {
+          ClubId: 1,
+          Name: 'Acme Fencing Club'
         },
-        'update:assignment': {
-            action: 'update:assignment'
-        }
+        Images: [
+          {
+            URL: 'https://randomuser.me/api/portraits/men/77.jpg'
+          }
+        ]
+      },
+      Pool: {
+        PoolId: 102,
+        Name: 'Pool 1',
+        RingName: 'Ring 1'
+      }
+    }
+  },
+  argTypes: {
+    staff: {
+      control: 'object'
+    },
+    'update:assignment': {
+      action: 'update:assignment'
     }
+  }
 };
 
 export const Default = {
-    args: {
-        staff: {
-            "Id": 2,
-            "TournamentId": 4,
-            "EventId": 5,
-            "PoolId": 102,
-            "PersonId": 23,
-            "Role": "Director",
-            "Person": {
-                "DisplayName": "Lucas Garcia",
-                "Club": {
-                    "ClubId": 1,
-                    "Name": "Acme Fencing Club"
-                },
-                "Images": [
-                    {
-                        "URL": "https://randomuser.me/api/portraits/men/77.jpg"
-                    }
-                ]
-            },
-            "Pool": {
-                "PoolId": 102,
-                "Name": "Pool 1",
-                "RingName": "Ring 1"
-            }
-        }
+  args: {
+    staff: {
+      Id: 2,
+      TournamentId: 4,
+      EventId: 5,
+      PoolId: 102,
+      PersonId: 23,
+      Role: 'Director',
+      Person: {
+        DisplayName: 'Lucas Garcia',
+        Club: {
+          ClubId: 1,
+          Name: 'Acme Fencing Club'
+        },
+        Images: [
+          {
+            URL: 'https://randomuser.me/api/portraits/men/77.jpg'
+          }
+        ]
+      },
+      Pool: {
+        PoolId: 102,
+        Name: 'Pool 1',
+        RingName: 'Ring 1'
+      }
     }
+  }
 };

package/src/stories/Organisms/Cards/StaffCard/StaffCard.vue

@@ -2,54 +2,59 @@
   <div class="flex items-center border border-dropdownSelect rounded-lg shadow-md bg-white hover:border-bright">
     <div class="hidden md:flex mr-4 h-20 pl-4 pt-2.5">
       <div v-if="!portraitURL" class="w-10 h-10 mt-2 rounded-xl bg-dropdownSelect flex items-center justify-center">
-        <BaseText text="" size="sm" color="neutral" weight="bold"/>
+        <BaseText text="" size="sm" color="neutral" weight="bold" />
       </div>
-      <img v-if="portraitURL" :src="portraitURL" alt="Portrait" class="mt-2 w-12 h-12 rounded-xl">
+      <img v-if="portraitURL" :src="portraitURL" alt="Portrait" class="mt-2 w-12 h-12 rounded-xl" />
     </div>
 
     <section class="flex flex-col md:flex-row w-full ml-4 md:ml-0">
       <div class="flex flex-col md:w-4/12 justify-star">
         <span class="w-full flex justify-start pb-1 md:pb-0">
-          <BaseText :text="fullName" size="" color="quaternary" weight="bold" class="text-sm md:text-xl"/>
+          <BaseText :text="fullName" size="" color="quaternary" weight="bold" class="text-sm md:text-xl" />
         </span>
         <span class="hidden md:flex w-full justify-start">
-          <BaseText :text="staff.Person.Club.Name" size="xs" color="quinary" weight="normal"/>
+          <BaseText :text="staff.Person.Club.Name" size="xs" color="quinary" weight="normal" />
         </span>
       </div>
 
       <div class="mr-4 md:ml-auto">
-        <ButtonBar
-            :buttons="buttons"
-            :selected="computedSelected"
-            @update:selected="handleAssignment"
-        />
+        <ButtonBar :buttons="buttons" :selected="computedSelected" @update:selected="handleAssignment" />
       </div>
     </section>
 
-    <div class="ml-4 border-l border-dropdownSelect h-20 w-10 items-center text-center hover:bg-eventBoxRed rounded-tr-lg rounded-br-lg">
-      <BaseIcon icon-name="fa-circle-xmark" size="" color="quinary" class="pt-6 text-lg md:text-2xl" hover="alarm" @click="handlerRemoveFencer" />
+    <div
+      class="ml-4 border-l border-dropdownSelect h-20 w-10 items-center text-center hover:bg-eventBoxRed rounded-tr-lg rounded-br-lg"
+    >
+      <BaseIcon
+        icon-name="fa-circle-xmark"
+        size=""
+        color="quinary"
+        class="pt-6 text-lg md:text-2xl"
+        hover="alarm"
+        @click="handlerRemoveFencer"
+      />
     </div>
   </div>
 </template>
 
 <script>
-import BaseText from "../../../Atoms/Text/BaseText.vue";
-import ButtonBar from "../../../Molecules/Buttons/ButtonBar/ButtonBar.vue";
-import BaseIcon from "../../../Atoms/Icon/BaseIcon.vue";
+import BaseText from '../../../Atoms/Text/BaseText.vue';
+import ButtonBar from '../../../Molecules/Buttons/ButtonBar/ButtonBar.vue';
+import BaseIcon from '../../../Atoms/Icon/BaseIcon.vue';
 
 export default {
   name: 'StaffCard',
   emits: ['remove:staff', 'update:assignment'],
-  components: {BaseIcon, ButtonBar, BaseText },
+  components: { BaseIcon, ButtonBar, BaseText },
   props: {
     staff: {
       type: Object,
       required: true
-    },
+    }
   },
   data() {
     return {
-      view: "Staff List"
+      view: 'Staff List'
     };
   },
   computed: {
@@ -63,7 +68,7 @@ export default {
     },
     buttons() {
       return [
-        { id: 'Director',  label: 'Director', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxBlue' },
+        { id: 'Director', label: 'Director', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxBlue' },
         { id: 'Line Judge', label: 'Line Judge', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxBlue' },
         { id: 'List Table', label: 'List Table', defaultBgColor: 'bg-natural', selectedBgColor: 'bg-eventBoxBlue' }
       ];
@@ -73,10 +78,10 @@ export default {
     }
   },
   methods: {
-    handleAssignment(selected) {
-      const staff = { ...this.staff, Role: selected };
-      this.$emit('update:assignment', staff);
-    },
+    handleAssignment(selected) {
+      const staff = { ...this.staff, Role: selected };
+      this.$emit('update:assignment', staff);
+    },
     handlerRemoveFencer() {
       this.$emit('remove:staff', this.staff);
     }

package/src/stories/Organisms/Cards/TableauBoutCard/SpacingConfig.js

@@ -1,111 +1,111 @@
 export const spacingConfig = {
-    'Semifinal': {
-        large: {
-            Semifinal: { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1'  },
-            Final: { getTopSpace: 'mt-[10rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-        },
-        small: {
-            Semifinal: { getTopSpace: 'mt-[0.7rem] mb-[1.8rem]', getCardSpace: 'mt-[2.3rem]'  },
-            Final: { getTopSpace: 'mt-[12.2rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+  Semifinal: {
+    large: {
+      Semifinal: { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1' },
+      Final: { getTopSpace: 'mt-[10rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' }
     },
-    'Table of 8': {
-        large: {
-            'Table of 8': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            Semifinal: { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]'  },
-            Final: { getTopSpace: 'mt-[11rem] ml-10', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-            'Table of 4': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]'  },
-            'Table of 2': { getTopSpace: 'mt-[5.8rem] mb-[3.4rem]', getCardSpace: 'mt-[11.5rem]'  },
-            'Consolation Round 1': { getTopSpace: 'mt-[3rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Consolation Round 2': { getTopSpace: 'mt-[1.5rem] mb-[3.8rem]', getCardSpace: 'mt-1' },
-            'Consolation Round 3': { getTopSpace: 'mt-[2.7rem] mb-[3.8rem]', getCardSpace: 'mt-[8rem]' },
-            'Consolation Round 4': { getTopSpace: 'mt-[5rem] mb-[3.8rem]', getCardSpace: 'mt-1' },
-            'Grand Final': { getTopSpace: 'mt-[11rem] ml-10', getCardSpace: 'mt-1'  },
-        },
-        small: {
-            'Table of 8': { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1' },
-            Semifinal: { getTopSpace: 'mt-[0.7rem] mb-[1.8rem]', getCardSpace: 'mt-[2.3rem]'  },
-            Final: { getTopSpace: 'mt-[6rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+    small: {
+      Semifinal: { getTopSpace: 'mt-[0.7rem] mb-[1.8rem]', getCardSpace: 'mt-[2.3rem]' },
+      Final: { getTopSpace: 'mt-[12.2rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  },
+  'Table of 8': {
+    large: {
+      'Table of 8': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      Semifinal: { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      Final: { getTopSpace: 'mt-[11rem] ml-10', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
+      'Table of 4': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      'Table of 2': { getTopSpace: 'mt-[5.8rem] mb-[3.4rem]', getCardSpace: 'mt-[11.5rem]' },
+      'Consolation Round 1': { getTopSpace: 'mt-[3rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Consolation Round 2': { getTopSpace: 'mt-[1.5rem] mb-[3.8rem]', getCardSpace: 'mt-1' },
+      'Consolation Round 3': { getTopSpace: 'mt-[2.7rem] mb-[3.8rem]', getCardSpace: 'mt-[8rem]' },
+      'Consolation Round 4': { getTopSpace: 'mt-[5rem] mb-[3.8rem]', getCardSpace: 'mt-1' },
+      'Grand Final': { getTopSpace: 'mt-[11rem] ml-10', getCardSpace: 'mt-1' }
     },
-    'Table of 16': {
-        large: {
-            'Table of 16': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 8': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
-            Semifinal: { getTopSpace: 'mt-[4.6rem] mb-[7rem]', getCardSpace: 'mt-[11.5rem]'  },
-            Final: { getTopSpace: 'mt-[22.5rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-        },
-        small: {
-            'Table of 16': { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1' },
-            'Table of 8': { getTopSpace: 'mt-[0.7rem] mb-[1.75rem]', getCardSpace: 'mt-[2.3rem]' },
-            Semifinal: { getTopSpace: 'mt-[2.25rem] mb-[3.63rem]', getCardSpace: 'mt-[5.9rem]'  },
-            Final: { getTopSpace: 'mt-[12.1rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+    small: {
+      'Table of 8': { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1' },
+      Semifinal: { getTopSpace: 'mt-[0.7rem] mb-[1.8rem]', getCardSpace: 'mt-[2.3rem]' },
+      Final: { getTopSpace: 'mt-[6rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  },
+  'Table of 16': {
+    large: {
+      'Table of 16': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 8': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      Semifinal: { getTopSpace: 'mt-[4.6rem] mb-[7rem]', getCardSpace: 'mt-[11.5rem]' },
+      Final: { getTopSpace: 'mt-[22.5rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' }
     },
-    'Table of 32': {
-        large: {
-            'Table of 32': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 16': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
-            'Table of 8': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
-            Semifinal: { getTopSpace: 'mt-[11.7rem] mb-[14rem]', getCardSpace: 'mt-[25.5rem]'  },
-            Final: { getTopSpace: 'mt-[51.5rem] ', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-        },
-        small: {
-            'Table of 32': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 16': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
-            'Table of 8': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]'  },
-            Semifinal: { getTopSpace: 'mt-[7rem] mb-[10rem]', getCardSpace: 'mt-[16.8rem]'  },
-            Final: { getTopSpace: 'mt-[34.1rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+    small: {
+      'Table of 16': { getTopSpace: 'mt-[0rem] mb-4', getCardSpace: 'mt-1' },
+      'Table of 8': { getTopSpace: 'mt-[0.7rem] mb-[1.75rem]', getCardSpace: 'mt-[2.3rem]' },
+      Semifinal: { getTopSpace: 'mt-[2.25rem] mb-[3.63rem]', getCardSpace: 'mt-[5.9rem]' },
+      Final: { getTopSpace: 'mt-[12.1rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  },
+  'Table of 32': {
+    large: {
+      'Table of 32': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 16': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      'Table of 8': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
+      Semifinal: { getTopSpace: 'mt-[11.7rem] mb-[14rem]', getCardSpace: 'mt-[25.5rem]' },
+      Final: { getTopSpace: 'mt-[51.5rem] ', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' }
     },
-    'Table of 64': {
-        large: {
-            'Table of 64': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 32': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
-            'Table of 16': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
-            'Table of 8': { getTopSpace: 'mt-[11.7rem] mb-[13.78rem]', getCardSpace: 'mt-[25.76rem]' },
-            Semifinal: { getTopSpace: 'mt-[24.45rem] mb-[29rem]', getCardSpace: 'mt-[53.6rem]'  },
-            Final: { getTopSpace: 'mt-[110rem] ', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-        },
-        small: {
-            'Table of 64': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 32': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
-            'Table of 16': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]' },
-            'Table of 8': { getTopSpace: 'mt-[7rem] mb-[9.95rem]', getCardSpace: 'mt-[16.8rem]'  },
-            Semifinal: { getTopSpace: 'mt-[16.1rem] mb-[18.8rem]', getCardSpace: 'mt-[34.8rem]'  },
-            Final: { getTopSpace: 'mt-[68rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+    small: {
+      'Table of 32': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 16': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
+      'Table of 8': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]' },
+      Semifinal: { getTopSpace: 'mt-[7rem] mb-[10rem]', getCardSpace: 'mt-[16.8rem]' },
+      Final: { getTopSpace: 'mt-[34.1rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  },
+  'Table of 64': {
+    large: {
+      'Table of 64': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 32': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      'Table of 16': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
+      'Table of 8': { getTopSpace: 'mt-[11.7rem] mb-[13.78rem]', getCardSpace: 'mt-[25.76rem]' },
+      Semifinal: { getTopSpace: 'mt-[24.45rem] mb-[29rem]', getCardSpace: 'mt-[53.6rem]' },
+      Final: { getTopSpace: 'mt-[110rem] ', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' }
     },
-    'Table of 128': {
-        large: {
-            'Table of 128': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 64': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
-            'Table of 32': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
-            'Table of 16': { getTopSpace: 'mt-[11.7rem] mb-[13.78rem]', getCardSpace: 'mt-[25.76rem]' },
-            'Table of 8': { getTopSpace: 'mt-[24.45rem] mb-[29rem]', getCardSpace: 'mt-[53.6rem]'  },
-            Semifinal: { getTopSpace: 'mt-[47.5rem] mb-[62rem]', getCardSpace: 'mt-[109.5rem]'  },
-            Final: { getTopSpace: 'mt-[223rem] ', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' },
-        },
-        small: {
-            'Table of 128': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
-            'Table of 64': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
-            'Table of 32': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]' },
-            'Table of 16': { getTopSpace: 'mt-[7rem] mb-[9.95rem]', getCardSpace: 'mt-[16.8rem]'  },
-            'Table of 8' : { getTopSpace: 'mt-[16.1rem] mb-[18.8rem]', getCardSpace: 'mt-[34.8rem]'  },
-            Semifinal: { getTopSpace: 'mt-[34.3rem] mb-[36.5rem]', getCardSpace: 'mt-[70.8rem]'  },
-            Final: { getTopSpace: 'mt-[140rem]', getCardSpace: 'mt-1'  },
-            'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' },
-        }
+    small: {
+      'Table of 64': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 32': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
+      'Table of 16': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]' },
+      'Table of 8': { getTopSpace: 'mt-[7rem] mb-[9.95rem]', getCardSpace: 'mt-[16.8rem]' },
+      Semifinal: { getTopSpace: 'mt-[16.1rem] mb-[18.8rem]', getCardSpace: 'mt-[34.8rem]' },
+      Final: { getTopSpace: 'mt-[68rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  },
+  'Table of 128': {
+    large: {
+      'Table of 128': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 64': { getTopSpace: 'mt-[1.34rem] mb-[3.4rem]', getCardSpace: 'mt-[4.5rem]' },
+      'Table of 32': { getTopSpace: 'mt-[4.6rem] mb-[7.15rem]', getCardSpace: 'mt-[11.5rem]' },
+      'Table of 16': { getTopSpace: 'mt-[11.7rem] mb-[13.78rem]', getCardSpace: 'mt-[25.76rem]' },
+      'Table of 8': { getTopSpace: 'mt-[24.45rem] mb-[29rem]', getCardSpace: 'mt-[53.6rem]' },
+      Semifinal: { getTopSpace: 'mt-[47.5rem] mb-[62rem]', getCardSpace: 'mt-[109.5rem]' },
+      Final: { getTopSpace: 'mt-[223rem] ', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[19.2rem]', getCardSpace: 'mt-1' }
     },
+    small: {
+      'Table of 128': { getTopSpace: 'mt-[0rem] mb-[2rem]', getCardSpace: 'mt-1' },
+      'Table of 64': { getTopSpace: 'mt-[0.7rem] mb-[2.65rem]', getCardSpace: 'mt-[3.4rem]' },
+      'Table of 32': { getTopSpace: 'mt-[2.9rem] mb-[5rem]', getCardSpace: 'mt-[7.85rem]' },
+      'Table of 16': { getTopSpace: 'mt-[7rem] mb-[9.95rem]', getCardSpace: 'mt-[16.8rem]' },
+      'Table of 8': { getTopSpace: 'mt-[16.1rem] mb-[18.8rem]', getCardSpace: 'mt-[34.8rem]' },
+      Semifinal: { getTopSpace: 'mt-[34.3rem] mb-[36.5rem]', getCardSpace: 'mt-[70.8rem]' },
+      Final: { getTopSpace: 'mt-[140rem]', getCardSpace: 'mt-1' },
+      'Third Place': { getTopSpace: '-mt-[2rem] -ml-[11rem]', getCardSpace: 'mt-1' }
+    }
+  }
 };