@dcrackel/meyersquaredui 1.0.86 → 1.0.87

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@dcrackel/meyersquaredui",
   "private": false,
-  "version": "1.0.86",
+  "version": "1.0.87",
   "type": "module",
   "main": "dist/meyersquaredui.cjs.js",
   "module": "dist/meyersquaredui.esm.js",

package/src/index.js

@@ -24,6 +24,7 @@ export { default as EventListCard } from './stories/Organisms/Cards/EventListCar
 export { default as FencerCard } from './stories/Organisms/Cards/FencerCard/FencerCard.vue'
 export { default as FencerListCard } from './stories/Organisms/Cards/FencerListCard/FencerListCard.vue'
 export { default as PhotoCard } from './stories/Organisms/Cards/PhotoCard/PhotoCard.vue'
+export { default as RatingSystemAnnouncement } from './stories/Organisms/Cards/RatingSystem/RatingSystemAnnouncement.vue'
 export { default as SocialMediaLinkCard } from './stories/Organisms/Cards/SocialMediaLinkCard/SocialMediaLinkCard.vue'
 export { default as TournamentCard } from './stories/Organisms/Cards/TournamentCard/TournamentCard.vue'
 export { default as TournamentDetails } from './stories/Organisms/Cards/TournamentDetails/TournamentDetails.vue'

package/src/stories/Organisms/Cards/RatingSystem/RatingSystemAnnouncement.stories.js

@@ -0,0 +1,16 @@
+import RatingSystemAnnouncement from './RatingSystemAnnouncement.vue';
+
+export default {
+    title: 'Organisms/Cards/RatingSystemAnnouncement',
+    component: RatingSystemAnnouncement,
+};
+
+const Template = (args) => ({
+    components: { RatingSystemAnnouncement },
+    setup() {
+        return { args };
+    },
+    template: '<RatingSystemAnnouncement />',
+});
+
+export const Default = Template.bind({});

package/src/stories/Organisms/Cards/RatingSystem/RatingSystemAnnouncement.vue

@@ -0,0 +1,42 @@
+<template>
+  <section class="w-full flex justify-center mx-auto mt-10 mb-20">
+    <section>
+      <div class="max-w-[1200px] w-full flex justify-center mx-auto mt-8 flex-col">
+        <div class="w-full flex py-4 md:pb-10 ml-2 md:ml-0 mb-4 justify-center">
+          <BaseText color="primary" size="xl" tag="h3" weight="bold">
+            Coming Soon: The M² Fencing Rating System!
+          </BaseText>
+        </div>
+        <div class="flex">
+          <div class="w-1/2 flex justify-end mr-10">
+            <img src="https://meyersquaredimages.com/images/trophy.png" alt="Rating System Announcement" class="w-96 h-96 rounded-lg" />
+          </div>
+          <div class="w-1/2">
+          <BaseText color="primary" size="md" tag="p" weight="normal" class="w-3/4">
+            Our new M² Rating System will give you deeper insights into your performance, track your progress,
+            and help you see how you measure up against competitors nationwide.<br><br>
+            <b>Key Advantages:</b><br>
+            It's a rating system, not a ranking system. You won’t lose progress just because others improve.<br><br>
+            Ratings are earned by competing in tournaments. Once earned, a rating stays with you for four years, after
+            which it gradually decreases by one level every four years. Having a bad tournament, or even a bad year doesn't cost you your rating.
+            <br><br>
+            The more competitive the tournament, the greater the rewards.
+            <br><br>
+            Stay tuned for more details!
+          </BaseText>
+            </div>
+        </div>
+      </div>
+    </section>
+  </section>
+</template>
+
+<script>
+import BaseText from "../../../Atoms/BaseText/BaseText.vue";
+
+export default {
+  name: "RatingSystemAnnouncement",
+  components: {BaseText},
+};
+</script>
+>

package/src/stories/Organisms/HeroBanners/HomePage/HeroBanner.stories.js

@@ -22,7 +22,7 @@ const Template = (args) => ({
 
 export const DefaultHeroBanner = Template.bind({});
 DefaultHeroBanner.args = {
-    imageSrc: 'https://meyersquared.com/images/banners/largebanner01.jpg',
+    imageSrc: 'https://meyersquaredimages.com/images/banners/largebanner01.jpg',
     title: 'Find your next HEMA Touranment!',
     description: '',
     buttonLabel: 'Get Started',

package/src/stories/Organisms/HeroBanners/HomePage/HeroBanner.vue

@@ -1,5 +1,5 @@
 <template>
-  <section id="hero" class="relative w-full h-3/4 flex justify-center bg-primary md:m-0 mt-6 " :style="backgroundStyle">
+  <section id="hero" class="relative w-full md:min-h-[500px] flex justify-center bg-primary md:m-0 mt-6 " :style="backgroundStyle">
     <!-- Spacer (Left) -->
     <div class="hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"></div>
 

package/src/stories/Organisms/HeroBanners/TournamentDetails/TournamentDetailsBanner.vue

@@ -1,5 +1,5 @@
 <template>
-  <section id="hero" class="hidden md:flex relative w-full justify-center bg-primary m-0 bg-top" :style="backgroundStyle">
+  <section id="hero" class="hidden md:flex md:min-h-[500px] relative w-full justify-center bg-primary m-0 bg-top" :style="backgroundStyle">
     <!-- Left Spacer -->
     <div class="hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"></div>
 

package/src/stories/Organisms/HeroBanners/Tournaments/TournamentBanner.stories.js

@@ -19,7 +19,7 @@ const Template = (args, { argTypes }) => ({
 
 export const Default = Template.bind({});
 Default.args = {
-    imageSrc: 'https://meyersquared.com/images/banners/thinbanner01.jpg',
+    imageSrc: 'https://meyersquaredimages.com/images/banners/thinbanner02.jpg',
     title: 'Find Tournaments',
     description: 'Find your next HEMA Tournaments near you!',
 };

package/src/stories/Organisms/HeroBanners/Tournaments/TournamentBanner.vue

@@ -1,5 +1,5 @@
 <template>
-  <section id="hero" class="relative w-full flex justify-center bg-primary m-0 bg-top" :style="backgroundStyle">
+  <section id="hero" class="relative w-full md:min-h-[500px] flex justify-center bg-primary m-0 bg-top" :style="backgroundStyle">
     <div class="hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"></div>
 
     <div class="relative w-full md:border-b md:border-l md:border-r border-lineGrey">

package/src/stories/Templates/HomePage/HomePage.vue

@@ -19,17 +19,19 @@
         imageUrl="https://meyersquared.com/images/banners/largebanner03.jpg"
         @handleButtonClick="changePage('clubs')"
     />
-    <GridLayout
-        :cardComponent="FencerCard"
-        :items="topFencers"
-        :maxColumns="5"
-        :mobileHorizontal="mobileHorizontal"
-        :isLoading="topFencersIsLoading"
-        moreButtonLabel="Leaderboards"
-        title="Top Fencers"
-        @grid-click="changePage('leaderboard')"
-        @grid-card-click="handleGridCardClick"
-    />
+
+    <RatingSystemAnnouncement />
+<!--    <GridLayout-->
+<!--        :cardComponent="FencerCard"-->
+<!--        :items="topFencers"-->
+<!--        :maxColumns="5"-->
+<!--        :mobileHorizontal="mobileHorizontal"-->
+<!--        :isLoading="topFencersIsLoading"-->
+<!--        moreButtonLabel="Leaderboards"-->
+<!--        title="Top Fencers"-->
+<!--        @grid-click="changePage('leaderboard')"-->
+<!--        @grid-card-click="handleGridCardClick"-->
+<!--    />-->
     <DoubleButtonBanner title="How Does Meyer Squared work?" button-label-two="Run a tournament"
                         button-label-one="Submit Results"
                         @handle-button-click-one="changePage('submitresults')"
@@ -64,10 +66,14 @@ import DoubleButtonBanner from "../../Organisms/SectionBanners/DoubleButtonBanne
 import Footer from "../../Organisms/Footer/Footer.vue";
 import ScrollNav from "../../Organisms/Headers/ScrollNav/ScrollNav.vue";
 import {markRaw} from 'vue';
+import BaseText from "../../Atoms/BaseText/BaseText.vue";
+import RatingSystemAnnouncement from "../../Organisms/Cards/RatingSystem/RatingSystemAnnouncement.vue";
 
 export default {
   name: 'HomePage',
   components: {
+    RatingSystemAnnouncement,
+    BaseText,
     Footer,
     DoubleButtonBanner,
     SingleButtonBanner,