75 lines
1.7 KiB
CSS
75 lines
1.7 KiB
CSS
.mini {
|
|
@apply w-full;
|
|
|
|
/* mini controls */
|
|
header{
|
|
@apply flex items-center justify-between px-2 pb-3;
|
|
|
|
> span {
|
|
@apply font-serif text-lg;
|
|
}
|
|
}
|
|
|
|
/* days wrapper */
|
|
figure {
|
|
@apply border-1.5 border-primary shadow-drop rounded-md;
|
|
|
|
/* weekdays */
|
|
figcaption {
|
|
@apply grid grid-cols-7 p-2 pt-3 pb-0;
|
|
|
|
span {
|
|
@apply flex items-center justify-center font-semibold;
|
|
}
|
|
}
|
|
|
|
/* day grid wrapper */
|
|
form {
|
|
@apply grid grid-cols-7 p-2 pt-1;
|
|
}
|
|
|
|
/* day */
|
|
.day {
|
|
@apply text-base p-0 relative flex items-center justify-center h-auto rounded-blob;
|
|
aspect-ratio: 1 / 1;
|
|
|
|
&:hover {
|
|
@apply bg-gray-50;
|
|
}
|
|
|
|
&.day--current {
|
|
|
|
}
|
|
|
|
&.day--outside {
|
|
@apply text-gray-500;
|
|
}
|
|
|
|
&.day--today {
|
|
@apply bg-cyan-500 font-bold;
|
|
|
|
&:hover {
|
|
@apply bg-cyan-550;
|
|
}
|
|
}
|
|
|
|
&.day--with-events {
|
|
&::after {
|
|
@apply absolute bottom-0 left-1/2 -translate-x-1/2 h-1 rounded-full w-4 bg-yellow-500;
|
|
content: '';
|
|
}
|
|
&[data-event-count='1']::after {
|
|
@apply w-1;
|
|
}
|
|
&[data-event-count='2']::after {
|
|
@apply w-2;
|
|
}
|
|
&[data-event-count='3']::after {
|
|
@apply w-3;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|