изменить стиль строки в реагировать большой календарь

Question

Мне нужно сделать календарь с событиями, и я решил использовать ответ-большой-календарь. Но мне нужно делать ряды с другим стилем. Таким образом, каждая строка должна быть через 30 минут, что я сделал с временными интервалами, но мне также нужно удалить границы по умолчанию и сделать новую рамку вокруг каждых четырех строк. Как я могу изменить стиль?

Answer 1

Я не смог найти никакой информации на сайте npmjs .org ... и, поскольку div создаются динамически, мы можем использовать CSS, чтобы получить этот эффект;

релевантно CSS:

.rbc-timeslot-group:nth-child(1), .rbc-timeslot-group:nth-child(2), .rbc-timeslot-group:nth-child(3), .rbc-timeslot-group:nth-child(23), .rbc-timeslot-group:nth-child(24)
{ background-color: lightpink; }

образец рабочий стекблиц здесь

Answer 2

Благодаря @ akber-iqbal я нашел свой ответ, поэтому эти стили сработали для меня, если вы можете оптимизировать его, вы можете поделиться им, спасибо.

 .rbc-day-slot .rbc-time-slot {
  border: unset;
}
.rbc-timeslot-group:nth-child(4n+1),
.rbc-timeslot-group:nth-child(4n+2),
.rbc-timeslot-group:nth-child(4n+3),
.rbc-timeslot-group:nth-child(4n+4)
 {  /* or 4n+1 */
  background-color: #fefefe;
  border-width:0px; 
  margin:0;
  padding:0;
  border-color:black;
}


.rbc-timeslot-group:nth-child(4n+1)
 { border-top: 1px solid #ccc;
}

см. https://stackblitz.com/edit/big-calendar-demo-jv11jb