fix weekdays spacing #300
fix weekdays spacing #300
Conversation
Deploying with Cloudflare Pages
|
|
Hey, @JacksonBowe are you the one from Discord (Boo) right? https://discord.com/channels/1121805548782878813/1198591092573098094 S-M-T-W-T-F-S looks Good Just made Calendar width
|
| @@ -125,7 +125,13 @@ const vCalendarSlots = computed(() => { | |||
| @apply flex; | |||
| } | |||
| .calendar .vc-weekday { | |||
| @apply text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]; | |||
| @apply text-muted-foreground rounded-md w-full font-normal text-[0.8rem]; | |||
| .calendar .vc-weekday-1 { | ||
| @apply pr-3; | ||
| } | ||
| .calendar .vc-weekday-7 { | ||
| @apply pl-3; | ||
| } |
There was a problem hiding this comment.
But these styles are redundant I think
Can you explain what is these change for? Thanks
There was a problem hiding this comment.
@sadeghbarati Yeah I'm Boo 😄. I noticed that all weeks elements had either an on-left or on-right class which was applying a left/right padding to the last/first vc-day.
I couldn't figure out how to apply that class so I brute forced it with padding.
I've just seen now that it's possible to change the first day of the week... so this change I've made is not good because it won't work for other first-day-of-week values.
Behaviour I was going for was to make the weekday letters line up with the day buttons. For example the two S weekdays in your image above are off-center.
Probably also worth noting that when you increase calendar width the "current day" has that large background color like in your image above. I "fixed" that like below adding the background to the day instead of the container. I didn't include in this PR because wasn't sure if it was intentional behaviour. The difference is also showcased in Before/After image.
There was a problem hiding this comment.
@JacksonBowe Thanks for explaining
Can you please also push your unincluded change for .v-day and vc-day.is-today 👍
Calendar.-.shadcn_vue.-.Google.Chrome.2024-01-23.06-18-43.mp4
Line up the weekdays letters S-M-T-etc with the day columns