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
v-for="(day, index) in days"
:key="index"
class="flex flex-col"
: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="flex flex-col 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
: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/, '') }}
</time>
@ -226,6 +226,7 @@ const customCalendar = {
dayNumber: day.day,
isCurrentMonth: isInCurrentMonth(day),
isToday: isToday(day),
isWeekend: isWeekend(day),
}
},
}
@ -317,6 +318,10 @@ function isInCurrentMonth(date) {
return calendar.currents.month === date.month
}
function isWeekend(date) {
return date.weekday === 6 || date.weekday === 7
}
function isToday(date) {
return date.toISODate() === DateTime.local().toISODate()
}
@ -343,11 +348,6 @@ function isToday(date) {
content: "Pt";
}
.day:nth-of-type(7n - 1):before,
.day:nth-of-type(7n):before {
color: #991b1b;
}
.day:nth-of-type(7n - 1):before {
content: "Sb";
}
@ -355,8 +355,4 @@ function isToday(date) {
.day:nth-of-type(7n):before {
content: "Nd";
}
.month-day:nth-of-type(7n - 1), .month-day:nth-of-type(7n) {
background-color: #fee2e2;
}
</style>