feat(class): add "ver mais" button for additional class events in month grid

src/pages/classes/components/MonthGrid.vue

@@ -23,12 +23,21 @@
 
         <div class="month-grid__cell-events">
           <ClassEventCard
-            v-for="item in day.classes"
+            v-for="item in day.classes.slice(0, MAX_VISIBLE)"
             :key="item.id"
             :class-item="item"
             compact
             @click="$emit('class-click', item)"
           />
+
+          <button
+            v-if="day.classes.length > MAX_VISIBLE"
+            type="button"
+            class="month-grid__more"
+            @click.stop="$emit('day-click', day.date)"
+          >
+            +{{ day.classes.length - MAX_VISIBLE }} ver mais
+          </button>
         </div>
       </div>
     </div>
@@ -58,6 +67,9 @@ const props = defineProps({
 
 defineEmits(["day-click", "class-click"]);
 
+// Máximo de aulas exibidas por dia; o excedente vira "+N ver mais"
+const MAX_VISIBLE = 1;
+
 const weekdayLabels = ["Dom", "Seg", "Ter", "Qua", "Qui", "Sex", "Sáb"];
 
 const days = computed(() => {
@@ -164,4 +176,20 @@ const days = computed(() => {
   flex-direction: column;
   gap: 6px;
 }
+
+.month-grid__more {
+  align-self: flex-start;
+  border: none;
+  background: transparent;
+  padding: 2px 4px;
+  font-size: 11px;
+  font-weight: 600;
+  color: #ff8340;
+  cursor: pointer;
+  border-radius: 4px;
+}
+
+.month-grid__more:hover {
+  background: rgba(255, 131, 64, 0.12);
+}
 </style>