frontend: add diagonal month expand icon in year view
This commit is contained in:
@@ -3827,9 +3827,20 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
|||||||
<button
|
<button
|
||||||
v-for="item in yearMonths"
|
v-for="item in yearMonths"
|
||||||
:key="`year-month-${item.monthIndex}`"
|
:key="`year-month-${item.monthIndex}`"
|
||||||
class="rounded-xl border border-base-300 p-3 text-left transition hover:border-primary/50 hover:bg-primary/5"
|
class="group relative rounded-xl border border-base-300 p-3 text-left transition hover:border-primary/50 hover:bg-primary/5"
|
||||||
@click="openYearMonth(item.monthIndex)"
|
@click="openYearMonth(item.monthIndex)"
|
||||||
>
|
>
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
class="calendar-hover-jump calendar-hover-jump-month"
|
||||||
|
title="Expand month diagonally"
|
||||||
|
aria-label="Expand month diagonally"
|
||||||
|
@click.stop="openYearMonth(item.monthIndex)"
|
||||||
|
>
|
||||||
|
<svg viewBox="0 0 20 20" class="h-3.5 w-3.5 fill-none stroke-current" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||||||
|
<path d="M7 13L3 17M13 7l4-4M3 13V17h4M17 7V3h-4" />
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
<p class="font-medium">{{ item.label }}</p>
|
<p class="font-medium">{{ item.label }}</p>
|
||||||
<p class="text-xs text-base-content/60">{{ item.count }} events</p>
|
<p class="text-xs text-base-content/60">{{ item.count }} events</p>
|
||||||
<button
|
<button
|
||||||
@@ -4988,6 +4999,11 @@ async function decideFeedCard(card: FeedCard, decision: "accepted" | "rejected")
|
|||||||
right: 10px;
|
right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.calendar-hover-jump-month {
|
||||||
|
top: 8px;
|
||||||
|
right: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
.calendar-hover-jump-row {
|
.calendar-hover-jump-row {
|
||||||
top: 50%;
|
top: 50%;
|
||||||
right: -14px;
|
right: -14px;
|
||||||
|
|||||||
Reference in New Issue
Block a user