Properly offset 1st day in DatePicker component (depending on the day of the week it's on)
MODIFY
resources/assets/js/components/DatePicker.vue
resources/assets/js/components/DatePicker.vue
</button>
</div>
<div class="date-picker__bottom">
+ <button
+ v-for="i in firstDayOffset"
+ disabled />
<button
v-for="i in maxDays(displayYear, displayMonth)"
@click="choose($event, i)"
computed: {
form: function () {
return this.year + '-' + this.addPotentialDigit(this.month) + '-' + this.addPotentialDigit(this.date)
+ },
+
+ firstDayOffset: function () {
+ return new Date(this.displayYear, this.displayMonth - 1, 1).getDay() - 1;
}
},

MODIFY
resources/assets/sass/components/date-picker.scss
resources/assets/sass/components/date-picker.scss
border-right: none;
}
- &:hover {
+ &:not([disabled]):hover {
cursor: pointer;
}
}
.date-picker__bottom button {
- &:hover {
+ &:not([disabled]):hover {
background: $colors-light-border;
}
}
}
.date-picker__bottom button {
- &:hover {
+ &:not([disabled]):hover {
background: $colors-dark-border;
}
}

Properly offset 1st day in DatePicker component (depending on the day of the week it's on)