@ozdao/martyrs 0.2.454 → 0.2.456

package/dist/martyrs/src/components/Slider/Slider.native.vue.js

@@ -0,0 +1,229 @@
+import { ref, onMounted, onBeforeUnmount, watch, createElementBlock, openBlock, createVNode, createElementVNode, toDisplayString, unref, createCommentVNode, Fragment, renderList, Transition, withCtx, renderSlot, normalizeClass } from "vue";
+import { useRouter } from "vue-router";
+import { useI18n } from "vue-i18n";
+import Loader from "../Loader/Loader.vue2.js";
+import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
+const _hoisted_1 = { class: "pos-relative" };
+const _hoisted_2 = {
+  key: 0,
+  class: "h-20r radius-semi pos-relative w-100 bg-light"
+};
+const _hoisted_3 = {
+  key: 1,
+  class: "bg-light radius-semi flex flex-center w-100 h-20r"
+};
+const _hoisted_4 = { class: "text-gray-500" };
+const _hoisted_5 = {
+  key: 0,
+  class: "carousel__dots"
+};
+const _hoisted_6 = ["onClick"];
+const _sfc_main = {
+  __name: "Slider.native",
+  props: {
+    showDots: Boolean,
+    store: Object,
+    options: Object,
+    text: Object,
+    user: Object
+  },
+  setup(__props) {
+    const props = __props;
+    useRouter();
+    const carouselRef = ref(null);
+    const entitiesState = ref([]);
+    const isLoading = ref(true);
+    const selectedIndex = ref(0);
+    const autoplayInterval = ref(null);
+    const scrollTimeout = ref(null);
+    const { t } = useI18n({
+      messages: props.text
+    });
+    const scrollTo = (index) => {
+      if (!carouselRef.value) return;
+      const container = carouselRef.value.querySelector(".carousel__container");
+      const slides = container.querySelectorAll(".carousel__slide");
+      if (slides[index]) {
+        container.scrollTo({
+          left: slides[index].offsetLeft,
+          behavior: "smooth"
+        });
+        selectedIndex.value = index;
+      }
+    };
+    const handleScroll = () => {
+      if (scrollTimeout.value) {
+        clearTimeout(scrollTimeout.value);
+      }
+      scrollTimeout.value = setTimeout(() => {
+        updateSelectedIndex();
+      }, 50);
+    };
+    const updateSelectedIndex = () => {
+      if (!carouselRef.value) return;
+      const container = carouselRef.value.querySelector(".carousel__container");
+      const slides = container.querySelectorAll(".carousel__slide");
+      if (!slides.length) return;
+      const scrollPosition = container.scrollLeft;
+      const slideWidth = slides[0].offsetWidth;
+      const index = Math.round(scrollPosition / slideWidth);
+      const boundedIndex = Math.max(0, Math.min(index, entitiesState.value.length - 1));
+      selectedIndex.value = boundedIndex;
+    };
+    const setupAutoplay = () => {
+      if (autoplayInterval.value) {
+        clearInterval(autoplayInterval.value);
+      }
+      autoplayInterval.value = setInterval(() => {
+        const nextIndex = (selectedIndex.value + 1) % entitiesState.value.length;
+        scrollTo(nextIndex);
+      }, 2e3);
+    };
+    onMounted(async () => {
+      try {
+        entitiesState.value = await props.store.read(props.options);
+      } catch (error) {
+        console.error("Error loading entities:", error);
+        entitiesState.value = [];
+      } finally {
+        isLoading.value = false;
+      }
+      if (entitiesState.value.length && carouselRef.value) {
+        const container = carouselRef.value.querySelector(".carousel__container");
+        const slides = container.querySelectorAll(".carousel__slide");
+        const observer = new IntersectionObserver((entries) => {
+          entries.forEach((entry) => {
+            if (entry.isIntersecting) {
+              const slideIndex = Array.from(slides).indexOf(entry.target);
+              if (slideIndex !== -1) {
+                selectedIndex.value = slideIndex;
+              }
+            }
+          });
+        }, {
+          root: container,
+          threshold: 0.7
+          // Consider slide visible when 70% is in view
+        });
+        slides.forEach((slide) => {
+          observer.observe(slide);
+        });
+        container.addEventListener("focusin", () => {
+          if (autoplayInterval.value) {
+            clearInterval(autoplayInterval.value);
+          }
+        });
+        container.addEventListener("focusout", () => {
+          setupAutoplay();
+        });
+        container.addEventListener("mousedown", () => {
+          if (autoplayInterval.value) {
+            clearInterval(autoplayInterval.value);
+          }
+        });
+        container.addEventListener("touchstart", () => {
+          if (autoplayInterval.value) {
+            clearInterval(autoplayInterval.value);
+          }
+        });
+        container.addEventListener("mouseup", () => {
+          setupAutoplay();
+        });
+        container.addEventListener("touchend", () => {
+          setupAutoplay();
+        });
+        setupAutoplay();
+        carouselRef.value._observer = observer;
+      }
+    });
+    onBeforeUnmount(() => {
+      if (carouselRef.value) {
+        if (carouselRef.value._observer) {
+          carouselRef.value._observer.disconnect();
+        }
+        const container = carouselRef.value.querySelector(".carousel__container");
+        if (container) {
+          container.removeEventListener("focusin", () => {
+          });
+          container.removeEventListener("focusout", () => {
+          });
+          container.removeEventListener("mousedown", () => {
+          });
+          container.removeEventListener("touchstart", () => {
+          });
+          container.removeEventListener("mouseup", () => {
+          });
+          container.removeEventListener("touchend", () => {
+          });
+        }
+      }
+      if (autoplayInterval.value) {
+        clearInterval(autoplayInterval.value);
+      }
+      if (scrollTimeout.value) {
+        clearTimeout(scrollTimeout.value);
+      }
+    });
+    watch(entitiesState, (newValue) => {
+      if (newValue.length && carouselRef.value) {
+        selectedIndex.value = 0;
+        scrollTo(0);
+        setupAutoplay();
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        isLoading.value ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          createVNode(Loader)
+        ])) : !entitiesState.value.length ? (openBlock(), createElementBlock("div", _hoisted_3, [
+          createElementVNode("p", _hoisted_4, toDisplayString(unref(t)("title")), 1)
+        ])) : (openBlock(), createElementBlock("div", {
+          key: 2,
+          class: "carousel",
+          ref_key: "carouselRef",
+          ref: carouselRef
+        }, [
+          createElementVNode("div", {
+            class: "carousel__container",
+            onScroll: handleScroll
+          }, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(entitiesState.value, (entity, key, index) => {
+              return openBlock(), createElementBlock("div", {
+                class: "carousel__slide pd-nano",
+                key
+              }, [
+                createVNode(Transition, {
+                  name: "fade",
+                  mode: "out-in",
+                  appear: ""
+                }, {
+                  default: withCtx(() => [
+                    renderSlot(_ctx.$slots, "default", {
+                      item: entity,
+                      user: __props.user
+                    }, void 0, true)
+                  ]),
+                  _: 2
+                }, 1024)
+              ]);
+            }), 128))
+          ], 32),
+          __props.showDots && entitiesState.value.length > 1 ? (openBlock(), createElementBlock("div", _hoisted_5, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(entitiesState.value, (_, index) => {
+              return openBlock(), createElementBlock("button", {
+                key: index,
+                class: normalizeClass(["carousel__dot", { "carousel__dot--active": selectedIndex.value === index }]),
+                onClick: ($event) => scrollTo(index)
+              }, null, 10, _hoisted_6);
+            }), 128))
+          ])) : createCommentVNode("", true)
+        ], 512))
+      ]);
+    };
+  }
+};
+const SliderNative = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a766dedc"]]);
+export {
+  SliderNative as default
+};
+//# sourceMappingURL=Slider.native.vue.js.map

package/dist/martyrs/src/components/Slider/Slider.native.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.native.vue.js","sources":["../../../../../src/components/Slider/Slider.native.vue"],"sourcesContent":["<template>\n  <div class=\"pos-relative\">\n    <!-- Loading State -->\n    <div v-if=\"isLoading\" class=\"h-20r radius-semi pos-relative w-100 bg-light\">\n      <Loader />\n    </div>\n    <!-- Empty State -->\n    <div v-else-if=\"!entitiesState.length\" class=\"bg-light radius-semi flex flex-center w-100 h-20r\">\n      <p class=\"text-gray-500\">{{t('title')}}</p>\n    </div>\n    <!-- Native Carousel -->\n    <div v-else class=\"carousel\" ref=\"carouselRef\">\n      <div class=\"carousel__container\" @scroll=\"handleScroll\">\n        <div \n          class=\"carousel__slide pd-nano\" \n          v-for=\"(entity, key, index) in entitiesState\" \n          :key=\"key\"\n        >\n          <transition name=\"fade\" mode=\"out-in\" appear>\n            <slot\n              :item=\"entity\"\n              :user=\"user\"\n            ></slot>\n          </transition>\n        </div>\n      </div>\n      \n      <!-- Navigation Dots (optional) -->\n      <div class=\"carousel__dots\" v-if=\"showDots && entitiesState.length > 1\">\n        <button \n          v-for=\"(_, index) in entitiesState\" \n          :key=\"index\"\n          class=\"carousel__dot\"\n          :class=\"{ 'carousel__dot--active': selectedIndex === index }\"\n          @click=\"scrollTo(index)\"\n        ></button>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted, onBeforeUnmount, watch } from 'vue'\nimport { useRouter } from 'vue-router'\nimport { useI18n } from 'vue-i18n'\nimport Loader from '@martyrs/src/components/Loader/Loader.vue'\n\n// Props for customization\nconst props = defineProps({\n  showDots: Boolean,\n  store: Object,\n  options: Object,\n  text: Object,\n  user: Object\n});\n\nconst router = useRouter()\nconst carouselRef = ref(null)\nconst entitiesState = ref([])\nconst isLoading = ref(true)\nconst selectedIndex = ref(0)\nconst autoplayInterval = ref(null)\nconst scrollTimeout = ref(null)\n\nconst { t } = useI18n({\n  messages: props.text\n})\n\n// Scroll to specific slide\nconst scrollTo = (index) => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (slides[index]) {\n    container.scrollTo({\n      left: slides[index].offsetLeft,\n      behavior: 'smooth'\n    })\n    \n    selectedIndex.value = index\n  }\n}\n\n// Handle scroll event with debounce\nconst handleScroll = () => {\n  // Clear previous timeout\n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n  \n  // Set a timeout to update the index when scrolling stops\n  scrollTimeout.value = setTimeout(() => {\n    updateSelectedIndex()\n  }, 50) // Small delay to ensure scroll has completed\n}\n\n// Update selected index when scrolling\nconst updateSelectedIndex = () => {\n  if (!carouselRef.value) return\n  \n  const container = carouselRef.value.querySelector('.carousel__container')\n  const slides = container.querySelectorAll('.carousel__slide')\n  \n  if (!slides.length) return\n  \n  const scrollPosition = container.scrollLeft\n  const slideWidth = slides[0].offsetWidth\n  \n  // Find current slide index based on scroll position\n  const index = Math.round(scrollPosition / slideWidth)\n  \n  // Ensure index is within bounds\n  const boundedIndex = Math.max(0, Math.min(index, entitiesState.value.length - 1))\n  \n  // Update selected index\n  selectedIndex.value = boundedIndex\n}\n\n// Setup autoplay functionality\nconst setupAutoplay = () => {\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  autoplayInterval.value = setInterval(() => {\n    const nextIndex = (selectedIndex.value + 1) % entitiesState.value.length\n    scrollTo(nextIndex)\n  }, 2000) // 2 seconds interval like in original\n}\n\nonMounted(async() => {\n  try {\n    entitiesState.value = await props.store.read(props.options)\n  } catch (error) {\n    console.error('Error loading entities:', error)\n    entitiesState.value = []\n  } finally {\n    isLoading.value = false\n  }\n  \n  // Initialize native carousel after entities are loaded\n  if (entitiesState.value.length && carouselRef.value) {\n    // Listen for scroll end using intersection observer for better performance\n    const container = carouselRef.value.querySelector('.carousel__container')\n    const slides = container.querySelectorAll('.carousel__slide')\n    \n    // Create intersection observer to detect when slides are visible\n    const observer = new IntersectionObserver((entries) => {\n      entries.forEach(entry => {\n        if (entry.isIntersecting) {\n          // Find the index of the visible slide\n          const slideIndex = Array.from(slides).indexOf(entry.target)\n          if (slideIndex !== -1) {\n            selectedIndex.value = slideIndex\n          }\n        }\n      })\n    }, {\n      root: container,\n      threshold: 0.7 // Consider slide visible when 70% is in view\n    })\n    \n    // Observe all slides\n    slides.forEach(slide => {\n      observer.observe(slide)\n    })\n    \n    // Add focus/blur events to pause autoplay on focus\n    container.addEventListener('focusin', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('focusout', () => {\n      setupAutoplay()\n    })\n    \n    // Stop autoplay on touch/mouse interaction\n    container.addEventListener('mousedown', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    container.addEventListener('touchstart', () => {\n      if (autoplayInterval.value) {\n        clearInterval(autoplayInterval.value)\n      }\n    })\n    \n    // Resume autoplay after interaction ends\n    container.addEventListener('mouseup', () => {\n      setupAutoplay()\n    })\n    \n    container.addEventListener('touchend', () => {\n      setupAutoplay()\n    })\n    \n    // Initialize autoplay\n    setupAutoplay()\n    \n    // Store observer for cleanup\n    carouselRef.value._observer = observer\n  }\n})\n\nonBeforeUnmount(() => {\n  // Clean up all resources\n  if (carouselRef.value) {\n    // Clean up intersection observer\n    if (carouselRef.value._observer) {\n      carouselRef.value._observer.disconnect()\n    }\n    \n    // Clean up event listeners\n    const container = carouselRef.value.querySelector('.carousel__container')\n    if (container) {\n      container.removeEventListener('focusin', () => {})\n      container.removeEventListener('focusout', () => {})\n      container.removeEventListener('mousedown', () => {})\n      container.removeEventListener('touchstart', () => {})\n      container.removeEventListener('mouseup', () => {})\n      container.removeEventListener('touchend', () => {})\n    }\n  }\n  \n  // Clear all timeouts and intervals\n  if (autoplayInterval.value) {\n    clearInterval(autoplayInterval.value)\n  }\n  \n  if (scrollTimeout.value) {\n    clearTimeout(scrollTimeout.value)\n  }\n})\n\n// Watch for changes in entities to reinitialize if needed\nwatch(entitiesState, (newValue) => {\n  if (newValue.length && carouselRef.value) {\n    // Reset to first slide\n    selectedIndex.value = 0\n    scrollTo(0)\n    \n    // Reset autoplay\n    setupAutoplay()\n  }\n})\n</script>\n\n<style scoped>\n.carousel {\n  position: relative;\n  width: 100%;\n  overflow: hidden;\n}\n\n.carousel__container {\n  display: flex;\n  scroll-snap-type: x mandatory;\n  overflow-x: scroll;\n  scrollbar-width: none; /* Firefox */\n  -ms-overflow-style: none; /* IE and Edge */\n  scroll-behavior: smooth;\n}\n\n.carousel__container::-webkit-scrollbar {\n  display: none; /* Chrome, Safari, Opera */\n}\n\n.carousel__slide {\n  flex: 0 0 100%;\n  width: 100%;\n  scroll-snap-align: start;\n  scroll-snap-stop: always;\n}\n\n/* Navigation dots */\n.carousel__dots {\n  display: flex;\n  justify-content: center;\n  gap: 0.5rem;\n  margin-top: 1rem;\n}\n\n.carousel__dot {\n  width: 0.625rem;\n  height: 0.625rem;\n  border-radius: 50%;\n  background-color: rgba(0, 0, 0, 0.2);\n  border: none;\n  padding: 0;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n}\n\n.carousel__dot--active {\n  background-color: rgba(0, 0, 0, 0.6);\n}\n\n.fade-enter-active,\n.fade-leave-active {\n  transition: opacity 0.3s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n  opacity: 0;\n}\n</style>"],"names":[],"mappings":"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"}

package/dist/martyrs/src/components/Slider/Slider.vue.cjs

@@ -5,7 +5,7 @@ const vueRouter = require("vue-router");
 const vueI18n = require("vue-i18n");
 const emblaCarouselVue_esm = require("../../../../node_modules/.pnpm/embla-carousel-vue@8.6.0_vue@3.5.13_typescript@5.8.3_/node_modules/embla-carousel-vue/esm/embla-carousel-vue.esm.cjs");
 const emblaCarouselAutoplay_esm = require("../../../../node_modules/.pnpm/embla-carousel-autoplay@8.6.0_embla-carousel@8.6.0/node_modules/embla-carousel-autoplay/esm/embla-carousel-autoplay.esm.cjs");
-const Loader = require("../Loader/Loader.vue.cjs");
+const Loader = require("../Loader/Loader.vue2.cjs");
 const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
 const _hoisted_1 = { class: "pos-relative" };
 const _hoisted_2 = {

package/dist/martyrs/src/components/Slider/Slider.vue.js

@@ -3,7 +3,7 @@ import { useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 import emblaCarouselVue from "../../../../node_modules/.pnpm/embla-carousel-vue@8.6.0_vue@3.5.13_typescript@5.8.3_/node_modules/embla-carousel-vue/esm/embla-carousel-vue.esm.js";
 import Autoplay from "../../../../node_modules/.pnpm/embla-carousel-autoplay@8.6.0_embla-carousel@8.6.0/node_modules/embla-carousel-autoplay/esm/embla-carousel-autoplay.esm.js";
-import Loader from "../Loader/Loader.vue.js";
+import Loader from "../Loader/Loader.vue2.js";
 import _export_sfc from "../../../../_virtual/_plugin-vue_export-helper.js";
 const _hoisted_1 = { class: "pos-relative" };
 const _hoisted_2 = {

package/dist/martyrs/src/components/UploadImageMultiple/UploadImageMultiple.vue.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const axios = require("axios");
-const Loader = require("../Loader/Loader.vue.cjs");
+const Loader = require("../Loader/Loader.vue2.cjs");
 const IconUpload = require("../../modules/icons/navigation/IconUpload.vue.cjs");
 const _hoisted_1 = {
   key: 0,

package/dist/martyrs/src/components/UploadImageMultiple/UploadImageMultiple.vue.js

@@ -1,6 +1,6 @@
 import { ref, createElementBlock, openBlock, withModifiers, createVNode, createElementVNode, Transition, withCtx, createBlock, createCommentVNode, toDisplayString } from "vue";
 import axios from "axios";
-import Loader from "../Loader/Loader.vue.js";
+import Loader from "../Loader/Loader.vue2.js";
 import _sfc_main$1 from "../../modules/icons/navigation/IconUpload.vue.js";
 const _hoisted_1 = {
   key: 0,

package/dist/martyrs/src/modules/auth/views/components/layouts/Auth.vue.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 ;/* empty css                                       */
-;/* empty css                                             */
+;/* empty css                                            */
 ;/* empty css                                             */
 require("vue-i18n");
 ;/* empty css                                */

package/dist/martyrs/src/modules/auth/views/components/layouts/Auth.vue.js

@@ -1,6 +1,6 @@
 import { ref, resolveComponent, createElementBlock, openBlock, createVNode, createElementVNode, withCtx, Transition, createBlock, resolveDynamicComponent } from "vue";
 /* empty css                                     */
-/* empty css                                           */
+/* empty css                                          */
 /* empty css                                           */
 import "vue-i18n";
 /* empty css                              */

package/dist/martyrs/src/modules/auth/views/components/pages/Profile.vue.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
+;/* empty css                                            */
 ;/* empty css                                             */
-;/* empty css                                             */
-const Dropdown = require("../../../../../components/Dropdown/Dropdown.vue.cjs");
-const Menu = require("../../../../../components/Menu/Menu.vue2.cjs");
+const Dropdown = require("../../../../../components/Dropdown/Dropdown.vue2.cjs");
+const Menu = require("../../../../../components/Menu/Menu.vue.cjs");
 const MenuItem = require("../../../../../components/Menu/MenuItem.vue.cjs");
 const ButtonToggleMembership = require("../../../../organizations/components/elements/ButtonToggleMembership.vue.cjs");
 const FormReport = require("../../../../reports/components/sections/FormReport.vue.cjs");

package/dist/martyrs/src/modules/auth/views/components/pages/Profile.vue.js

@@ -1,8 +1,8 @@
 import { ref, inject, computed, onMounted, createElementBlock, createCommentVNode, openBlock, createElementVNode, createBlock, createVNode, unref, withCtx, toDisplayString, Fragment, renderList, normalizeClass, resolveDynamicComponent } from "vue";
+/* empty css                                          */
 /* empty css                                           */
-/* empty css                                           */
-import _sfc_main$5 from "../../../../../components/Dropdown/Dropdown.vue.js";
-import _sfc_main$a from "../../../../../components/Menu/Menu.vue2.js";
+import _sfc_main$5 from "../../../../../components/Dropdown/Dropdown.vue2.js";
+import _sfc_main$a from "../../../../../components/Menu/Menu.vue.js";
 import _sfc_main$b from "../../../../../components/Menu/MenuItem.vue.js";
 import _sfc_main$7 from "../../../../organizations/components/elements/ButtonToggleMembership.vue.js";
 import _sfc_main$6 from "../../../../reports/components/sections/FormReport.vue.js";

package/dist/martyrs/src/modules/auth/views/components/sections/FeaturedUsers.vue.cjs

@@ -22,7 +22,7 @@ const _sfc_main = {
       const _component_router_link = vue.resolveComponent("router-link");
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         _cache[1] || (_cache[1] = vue.createElementVNode("div", { class: "flex-center flex w-100" }, [
-          vue.createElementVNode("h2", { class: "t-center h2 w-max-50 mn-b-big" }, " Ask the hundreds shaping your entertainment for decades ")
+          vue.createElementVNode("h2", { class: "t-center h2 w-max-50r mn-b-big" }, " Ask the hundreds shaping your entertainment for decades ")
         ], -1)),
         vue.createVNode(Marquee.default, {
           class: "mn-b-thin",
@@ -99,7 +99,7 @@ const _sfc_main = {
         _cache[2] || (_cache[2] = vue.createElementVNode("p", { class: "w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big" }, " Together, we're shaping the future of the globals music community. ", -1)),
         vue.createVNode(_component_router_link, {
           to: { name: "Sign In" },
-          class: "bg-black mn-r-auto mn-l-auto t-medium t-white button"
+          class: "bg-black w-max mn-r-auto mn-l-auto t-medium t-white button"
         }, {
           default: vue.withCtx(() => _cache[0] || (_cache[0] = [
             vue.createTextVNode(" Join Now ")

package/dist/martyrs/src/modules/auth/views/components/sections/FeaturedUsers.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FeaturedUsers.vue.cjs","sources":["../../../../../../../../src/modules/auth/views/components/sections/FeaturedUsers.vue"],"sourcesContent":["<template>\n  <div class=\"o-hidden w-100\">\n    <div class=\"flex-center flex w-100\">\n      <h2 class=\"t-center h2 w-max-50 mn-b-big\">\n        Ask the hundreds shaping your entertainment for decades\n      </h2>\n    </div>\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(0,6)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'reverse'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(7,14)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-big\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(15,22)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <p class=\"w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big\">\n      Together, we're shaping the future of the globals music community.\n    </p>\n    <router-link :to=\"{ name: 'Sign In' }\" class=\"bg-black mn-r-auto mn-l-auto t-medium t-white button\">\n      Join Now\n    </router-link>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue';\n\nimport * as users from '@martyrs/src/modules/auth/views/store/users'\n\nimport Marquee from '@martyrs/src/components/Marquee/Marquee.vue'\n\nimport CardUser from '@martyrs/src/modules/auth/views/components/blocks/CardUser.vue'\n\nconst usersList = ref([])\n\nonMounted(async() => {\n  usersList.value = await users.actions.read({\n    limit: 25\n  })\n});\n</script>\n\n<style lang=\"scss\">\n  .selector {\n    flex-grow: 1;\n    flex-basis: 0;\n    min-width: 0;\n  }\n</style>\n"],"names":["ref","onMounted","users.actions"],"mappings":";;;;;;;;;;;;;;AAwFA,UAAM,YAAYA,IAAG,IAAC,CAAE,CAAA;AAExBC,QAAAA,UAAU,YAAW;AACnB,gBAAU,QAAQ,MAAMC,MAAa,QAAC,KAAK;AAAA,QACzC,OAAO;AAAA,MACR,CAAA;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"FeaturedUsers.vue.cjs","sources":["../../../../../../../../src/modules/auth/views/components/sections/FeaturedUsers.vue"],"sourcesContent":["<template>\n  <div class=\"o-hidden w-100\">\n    <div class=\"flex-center flex w-100\">\n      <h2 class=\"t-center h2 w-max-50r mn-b-big\">\n        Ask the hundreds shaping your entertainment for decades\n      </h2>\n    </div>\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(0,6)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'reverse'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(7,14)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-big\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(15,22)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <p class=\"w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big\">\n      Together, we're shaping the future of the globals music community.\n    </p>\n    <router-link :to=\"{ name: 'Sign In' }\" class=\"bg-black w-max mn-r-auto mn-l-auto t-medium t-white button\">\n      Join Now\n    </router-link>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue';\n\nimport * as users from '@martyrs/src/modules/auth/views/store/users'\n\nimport Marquee from '@martyrs/src/components/Marquee/Marquee.vue'\n\nimport CardUser from '@martyrs/src/modules/auth/views/components/blocks/CardUser.vue'\n\nconst usersList = ref([])\n\nonMounted(async() => {\n  usersList.value = await users.actions.read({\n    limit: 25\n  })\n});\n</script>\n\n<style lang=\"scss\">\n  .selector {\n    flex-grow: 1;\n    flex-basis: 0;\n    min-width: 0;\n  }\n</style>\n"],"names":["ref","onMounted","users.actions"],"mappings":";;;;;;;;;;;;;;AAwFA,UAAM,YAAYA,IAAG,IAAC,CAAE,CAAA;AAExBC,QAAAA,UAAU,YAAW;AACnB,gBAAU,QAAQ,MAAMC,MAAa,QAAC,KAAK;AAAA,QACzC,OAAO;AAAA,MACR,CAAA;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/auth/views/components/sections/FeaturedUsers.vue.js

@@ -20,7 +20,7 @@ const _sfc_main = {
       const _component_router_link = resolveComponent("router-link");
       return openBlock(), createElementBlock("div", _hoisted_1, [
         _cache[1] || (_cache[1] = createElementVNode("div", { class: "flex-center flex w-100" }, [
-          createElementVNode("h2", { class: "t-center h2 w-max-50 mn-b-big" }, " Ask the hundreds shaping your entertainment for decades ")
+          createElementVNode("h2", { class: "t-center h2 w-max-50r mn-b-big" }, " Ask the hundreds shaping your entertainment for decades ")
         ], -1)),
         createVNode(_sfc_main$1, {
           class: "mn-b-thin",
@@ -97,7 +97,7 @@ const _sfc_main = {
         _cache[2] || (_cache[2] = createElementVNode("p", { class: "w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big" }, " Together, we're shaping the future of the globals music community. ", -1)),
         createVNode(_component_router_link, {
           to: { name: "Sign In" },
-          class: "bg-black mn-r-auto mn-l-auto t-medium t-white button"
+          class: "bg-black w-max mn-r-auto mn-l-auto t-medium t-white button"
         }, {
           default: withCtx(() => _cache[0] || (_cache[0] = [
             createTextVNode(" Join Now ")

package/dist/martyrs/src/modules/auth/views/components/sections/FeaturedUsers.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FeaturedUsers.vue.js","sources":["../../../../../../../../src/modules/auth/views/components/sections/FeaturedUsers.vue"],"sourcesContent":["<template>\n  <div class=\"o-hidden w-100\">\n    <div class=\"flex-center flex w-100\">\n      <h2 class=\"t-center h2 w-max-50 mn-b-big\">\n        Ask the hundreds shaping your entertainment for decades\n      </h2>\n    </div>\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(0,6)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'reverse'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(7,14)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-big\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(15,22)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <p class=\"w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big\">\n      Together, we're shaping the future of the globals music community.\n    </p>\n    <router-link :to=\"{ name: 'Sign In' }\" class=\"bg-black mn-r-auto mn-l-auto t-medium t-white button\">\n      Join Now\n    </router-link>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue';\n\nimport * as users from '@martyrs/src/modules/auth/views/store/users'\n\nimport Marquee from '@martyrs/src/components/Marquee/Marquee.vue'\n\nimport CardUser from '@martyrs/src/modules/auth/views/components/blocks/CardUser.vue'\n\nconst usersList = ref([])\n\nonMounted(async() => {\n  usersList.value = await users.actions.read({\n    limit: 25\n  })\n});\n</script>\n\n<style lang=\"scss\">\n  .selector {\n    flex-grow: 1;\n    flex-basis: 0;\n    min-width: 0;\n  }\n</style>\n"],"names":["users.actions"],"mappings":";;;;;;;;;;;;AAwFA,UAAM,YAAY,IAAI,CAAE,CAAA;AAExB,cAAU,YAAW;AACnB,gBAAU,QAAQ,MAAMA,QAAc,KAAK;AAAA,QACzC,OAAO;AAAA,MACR,CAAA;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"FeaturedUsers.vue.js","sources":["../../../../../../../../src/modules/auth/views/components/sections/FeaturedUsers.vue"],"sourcesContent":["<template>\n  <div class=\"o-hidden w-100\">\n    <div class=\"flex-center flex w-100\">\n      <h2 class=\"t-center h2 w-max-50r mn-b-big\">\n        Ask the hundreds shaping your entertainment for decades\n      </h2>\n    </div>\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(0,6)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-thin\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'reverse'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(7,14)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <Marquee\n      class=\"mn-b-big\"\n      :gradient=\"true\"\n      :gradientColor=\"'var(--white)'\"\n      :gradientLength=\"'10%'\"\n      :direction=\"'normal'\"\n      :pauseOnHover=\"false\"\n      :clone=\"true\"\n    >\n      <div class=\"flex flex-nowrap\">\n        <CardUser \n          v-for=\"user in usersList.slice(15,22)\" \n          class=\"mn-r-thin h4 h-8r flex-child-grow-0 flex-child bg-light pd-small radius-medium\"\n          :user=\"user\" \n          :photo=\"user.profile.photo\"\n          :name=\"user.profile.name || user.phone || user.username\"\n          :phone=\"'DJ'\"\n        /> \n      </div>\n    </Marquee>\n\n    <p class=\"w-m-33r mn-r-auto mn-l-auto t-center mn-b-small p-big\">\n      Together, we're shaping the future of the globals music community.\n    </p>\n    <router-link :to=\"{ name: 'Sign In' }\" class=\"bg-black w-max mn-r-auto mn-l-auto t-medium t-white button\">\n      Join Now\n    </router-link>\n  </div>\n</template>\n\n<script setup>\nimport { ref, onMounted } from 'vue';\n\nimport * as users from '@martyrs/src/modules/auth/views/store/users'\n\nimport Marquee from '@martyrs/src/components/Marquee/Marquee.vue'\n\nimport CardUser from '@martyrs/src/modules/auth/views/components/blocks/CardUser.vue'\n\nconst usersList = ref([])\n\nonMounted(async() => {\n  usersList.value = await users.actions.read({\n    limit: 25\n  })\n});\n</script>\n\n<style lang=\"scss\">\n  .selector {\n    flex-grow: 1;\n    flex-basis: 0;\n    min-width: 0;\n  }\n</style>\n"],"names":["users.actions"],"mappings":";;;;;;;;;;;;AAwFA,UAAM,YAAY,IAAI,CAAE,CAAA;AAExB,cAAU,YAAW;AACnB,gBAAU,QAAQ,MAAMA,QAAc,KAAK;AAAA,QACzC,OAAO;AAAA,MACR,CAAA;AAAA,IACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/community/components/pages/BlogPost.vue.cjs

@@ -2,7 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
 const vue_SixQ7xP = require("../../../../../../node_modules/.pnpm/@unhead_vue@1.11.20_vue@3.5.13_typescript@5.8.3_/node_modules/@unhead/vue/dist/shared/vue.-sixQ7xP.cjs");
-;/* empty css                                          */
+;/* empty css                                         */
 const EmptyState = require("../../../../components/EmptyState/EmptyState.vue.cjs");
 const CardBlogpost = require("../blocks/CardBlogpost.vue.cjs");
 const SkeletonBlogpost = require("../../../icons/skeletons/SkeletonBlogpost.vue.cjs");

package/dist/martyrs/src/modules/community/components/pages/BlogPost.vue.js

@@ -1,6 +1,6 @@
 import { computed, ref, onServerPrefetch, onMounted, createElementBlock, openBlock, createVNode, TransitionGroup, withCtx, createCommentVNode, Fragment, renderList, Transition, createBlock } from "vue";
 import { u as useHead } from "../../../../../../node_modules/.pnpm/@unhead_vue@1.11.20_vue@3.5.13_typescript@5.8.3_/node_modules/@unhead/vue/dist/shared/vue.-sixQ7xP.js";
-/* empty css                                        */
+/* empty css                                       */
 import _sfc_main$1 from "../../../../components/EmptyState/EmptyState.vue.js";
 import _sfc_main$2 from "../blocks/CardBlogpost.vue.js";
 import SkeletonBlogpost from "../../../icons/skeletons/SkeletonBlogpost.vue.js";

package/dist/martyrs/src/modules/community/components/sections/HotPosts.vue.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const vue = require("vue");
-;/* empty css                                          */
-;/* empty css                                              */
+;/* empty css                                         */
+;/* empty css                                             */
 ;/* empty css                                           */
 ;/* empty css                                      */
 const Slider = require("../../../../components/Slider/Slider.vue.cjs");
@@ -26,8 +26,7 @@ const _sfc_main = {
       default: () => auth.state.user._id
     },
     period: {
-      type: String,
-      default: "year"
+      type: String
     },
     category: {
       type: String,

package/dist/martyrs/src/modules/community/components/sections/HotPosts.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HotPosts.vue.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"HotPosts.vue.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/community/components/sections/HotPosts.vue.js

@@ -1,6 +1,6 @@
 import { createBlock, openBlock, withCtx } from "vue";
-/* empty css                                        */
-/* empty css                                            */
+/* empty css                                       */
+/* empty css                                           */
 /* empty css                                         */
 /* empty css                                    */
 import Slider from "../../../../components/Slider/Slider.vue.js";
@@ -24,8 +24,7 @@ const _sfc_main = {
       default: () => state.user._id
     },
     period: {
-      type: String,
-      default: "year"
+      type: String
     },
     category: {
       type: String,

package/dist/martyrs/src/modules/community/components/sections/HotPosts.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"HotPosts.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"HotPosts.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/martyrs/src/modules/events/components/blocks/CardEvent.vue.cjs

@@ -14,7 +14,7 @@ const _hoisted_2 = ["src"];
 const _hoisted_3 = ["src"];
 const _hoisted_4 = {
   key: 0,
-  class: "t-semi uppercase"
+  class: "t-semi t-truncate uppercase"
 };
 const _hoisted_5 = {
   key: 1,
@@ -30,15 +30,13 @@ const _hoisted_7 = {
 };
 const _hoisted_8 = {
   key: 2,
-  class: "mn-b-small p-big"
+  class: "mn-b-small p-big t-trim-3"
 };
-const _hoisted_9 = { class: "flex flex-wrap gap-micro t-medium p-big justify-start align-center" };
-const _hoisted_10 = {
+const _hoisted_9 = {
   key: 0,
   class: "mn-r-nano d-inline-block w-max pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small t-medium bg-white"
 };
-const _hoisted_11 = { class: "t-semi" };
-const _hoisted_12 = {
+const _hoisted_10 = {
   key: 0,
   class: "t-semi"
 };
@@ -95,7 +93,7 @@ const _sfc_main = {
       const endTime = new Intl.DateTimeFormat(void 0, { hour: "2-digit", minute: "2-digit", hourCycle: "h23" }).format(end);
       return `${startTime}-${endTime}`;
     });
-    const truncatedEventName = vue.computed(() => {
+    vue.computed(() => {
       const eventName = props.event.name;
       if (eventName.length > 26) {
         return `${eventName.substring(0, 22)}…`;
@@ -140,7 +138,10 @@ const _sfc_main = {
           }, null, 8, _hoisted_3)
         ])) : vue.createCommentVNode("", true),
         vue.createElementVNode("section", {
-          class: vue.normalizeClass(["pos-relative w-100", { "pd-t-zero pd-medium": __props.type !== "short" }])
+          class: vue.normalizeClass(["pos-relative w-100", {
+            "pd-t-zero pd-medium": __props.type !== "short",
+            "flex-nowrap flex flex-v-center": __props.type === "short"
+          }])
         }, [
           __props.user === __props.event.creator.target._id ? (vue.openBlock(), vue.createBlock(IconEdit.default, {
             key: 0,
@@ -153,9 +154,12 @@ const _sfc_main = {
             class: "z-index-2 pos-absolute pos-t-regular pos-r-regular i-regular t-transp"
           })) : vue.createCommentVNode("", true),
           vue.createElementVNode("div", {
-            class: vue.normalizeClass([{ "mn-b-small": __props.type !== "short" }, "flex-v-center flex-nowrap flex"])
+            class: vue.normalizeClass([{
+              "mn-b-small": __props.type !== "short",
+              "order-2 mn-l-thin": __props.type === "short"
+            }, "flex-v-center flex-nowrap flex"])
           }, [
-            __props.type === "short" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(truncatedEventName.value), 1)) : vue.createCommentVNode("", true)
+            __props.type === "short" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(__props.event.name), 1)) : vue.createCommentVNode("", true)
           ], 2),
           __props.type !== "short" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
             __props.type !== "short" ? (vue.openBlock(), vue.createElementBlock("h3", _hoisted_6, vue.toDisplayString(__props.event.name), 1)) : vue.createCommentVNode("", true),
@@ -163,18 +167,26 @@ const _sfc_main = {
           ])) : vue.createCommentVNode("", true),
           __props.type !== "short" ? (vue.openBlock(), vue.createElementBlock("p", _hoisted_8, vue.toDisplayString(__props.event.description), 1)) : vue.createCommentVNode("", true),
           vue.renderSlot(_ctx.$slots, "default"),
-          vue.createElementVNode("div", _hoisted_9, [
-            ((_a = __props.event.date) == null ? void 0 : _a.start) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_10, [
-              vue.createElementVNode("span", _hoisted_11, vue.toDisplayString(formattedDate.value), 1),
-              __props.type !== "short" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_12, " | " + vue.toDisplayString(formattedTimeRange.value), 1)) : vue.createCommentVNode("", true)
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(["flex-wrap flex-child-default gap-micro t-medium p-big justify-start align-center t-trim-2", {
+              "order-1": __props.type === "short"
+            }])
+          }, [
+            ((_a = __props.event.date) == null ? void 0 : _a.start) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_9, [
+              vue.createElementVNode("span", {
+                class: vue.normalizeClass([{
+                  "p-medium": __props.type === "short"
+                }, "t-semi"])
+              }, vue.toDisplayString(formattedDate.value), 3),
+              __props.type !== "short" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_10, " | " + vue.toDisplayString(formattedTimeRange.value), 1)) : vue.createCommentVNode("", true)
             ])) : vue.createCommentVNode("", true),
-            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.event.tags, (chip, index) => {
+            __props.type !== "short" ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 1 }, vue.renderList(__props.event.tags, (chip, index) => {
               return vue.openBlock(), vue.createElementBlock("span", {
                 key: index,
                 class: "d-inline-flex pd-b-micro pd-t-micro pd-r-thin pd-l-thin radius-small bg-main"
               }, vue.toDisplayString(chip), 1);
-            }), 128))
-          ])
+            }), 128)) : vue.createCommentVNode("", true)
+          ], 2)
         ], 2)
       ], 2);
     };