kamilniemczycki/toby
1
0
Fork 0
Code Issues Pull Requests 2 Projects Releases Activity

#152 - updated style

Browse Source
This commit is contained in:
Kamil Niemczycki 2022-06-27 11:55:55 +02:00
parent a7bc4695a7
commit e7c1028da1
Signed by: kamilniemczycki
GPG Key ID: 04D4E2012F969213
1 changed files with 8 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
resources/js/Shared/Widgets/VacationCalendar.vue
View File

@ -123,12 +123,12 @@
<div <div
v-for="(day, index) in days" v-for="(day, index) in days"
:key="index" :key="index"
class="flex flex-col" class="flex flex-col relative py-2 px-3"
:class="[day.isCurrentMonth ? 'bg-white' : 'bg-gray-50 text-gray-500', calendarState.viewMode.isWeek && index !== 0 && (index % 5 === 0 || index % 6 === 0) ? 'bg-red-100' : undefined, calendarState.viewMode.isWeek ? 'day' : 'month-day', 'relative py-2 px-3']" :class="[day.isCurrentMonth ? 'bg-white' : 'bg-gray-50 text-gray-500', { 'hover:bg-blumilk-25': day.isCurrentMonth && !day.isWeekend }, { 'day': calendarState.viewMode.isWeek }, { 'bg-red-100': day.isCurrentMonth && day.isWeekend }, { 'bg-red-50': !day.isCurrentMonth && day.isWeekend }, { 'text-red-800': day.isWeekend }]"
> >
<time <time
:datetime="day.date" :datetime="day.date"
:class="day.isToday ? 'flex h-6 w-6 items-center justify-center rounded-full bg-indigo-600 font-semibold text-white' : undefined" :class="{ 'flex h-6 w-6 items-center justify-center rounded-full bg-blumilk-500 font-semibold text-white': day.isToday }"
> >
{{ day.date.split('-').pop().replace(/^0/, '') }} {{ day.date.split('-').pop().replace(/^0/, '') }}
</time> </time>
@ -226,6 +226,7 @@ const customCalendar = {
dayNumber: day.day, dayNumber: day.day,
isCurrentMonth: isInCurrentMonth(day), isCurrentMonth: isInCurrentMonth(day),
isToday: isToday(day), isToday: isToday(day),
isWeekend: isWeekend(day),
} }
}, },
} }
@ -317,6 +318,10 @@ function isInCurrentMonth(date) {
return calendar.currents.month === date.month return calendar.currents.month === date.month
} }
function isWeekend(date) {
return date.weekday === 6 || date.weekday === 7
}
function isToday(date) { function isToday(date) {
return date.toISODate() === DateTime.local().toISODate() return date.toISODate() === DateTime.local().toISODate()
} }
@ -343,11 +348,6 @@ function isToday(date) {
content: "Pt"; content: "Pt";
} }
.day:nth-of-type(7n - 1):before,
.day:nth-of-type(7n):before {
color: #991b1b;
}
.day:nth-of-type(7n - 1):before { .day:nth-of-type(7n - 1):before {
content: "Sb"; content: "Sb";
} }
@ -355,8 +355,4 @@ function isToday(date) {
.day:nth-of-type(7n):before { .day:nth-of-type(7n):before {
content: "Nd"; content: "Nd";
} }
.month-day:nth-of-type(7n - 1), .month-day:nth-of-type(7n) {
background-color: #fee2e2;
}
</style> </style>