Joururi/leim-tools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed grid lines for calendars

Browse Source
This commit is contained in:
Alexis
2025-03-14 18:10:45 +01:00
parent 1bee00ffd6
commit 6add25f45f
1 changed files with 5 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
components/calendar/state/monthly/DayTile.vue
View File

@@ -73,7 +73,7 @@ const eventsNotDisplayed: ComputedRef<number> = computed<number>(() => eventsFo
<template> <template>
<div <div
ref="calendarTile" ref="calendarTile"
class="tile relative text-xs p-2 border-slate-200 contrast-more:border-slate-500 dark:border-slate-700 dark:bg-black transition-colors" class="tile relative text-xs p-2"
:class="{ :class="{
'text-slate-300 dark:text-slate-500': props.faded, 'text-slate-300 dark:text-slate-500': props.faded,
'text-slate-500 dark:text-slate-300': !props.faded 'text-slate-500 dark:text-slate-300': !props.faded
@@ -149,14 +149,11 @@ const eventsNotDisplayed: ComputedRef<number> = computed<number>(() => eventsFo
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
// .tile are the direct children of the grid
// We need to get, between each element, a 1px solid line to separate them, for columns and rows
.tile { .tile {
&:not(:nth-child(10n)) { border-right-width: 1px;
border-right-width: 1px; border-bottom-width: 1px;
}
&:nth-child(n + 11) {
border-top-width: 1px;
}
} }
.event-enter-active { .event-enter-active {