Event calendar

<!-- Event calendar example -->
<div class="calendar" data-calendar-options='{
  "initialDate": "2024-08-01",
  "headerToolbar": {
    "left": "prev,next today",
    "center": "title",
    "right": "dayGridMonth,timeGridWeek,listWeek"
  },
  "eventTimeFormat": {
    "hour": "2-digit",
    "minute": "2-digit",
    "hour12": false
  },
  "events": [
    {
      "title": "Stretching",
      "start": "2024-08-01T16:30",
      "end": "2024-08-01T18:00",
      "classNames": ["event-custom-style", "bg-light", "text-nav", "border-0", "rounded-1", "p-2", "ps-3", "border-start", "border-5", "border-purple"]
    },
    {
      "title": "For pregnant",
      "start": "2024-08-02T07:30",
      "end": "2024-08-02T09:40",
      "classNames": ["event-custom-style", "bg-light", "text-nav", "border-0", "rounded-1", "p-2", "ps-3", "border-start", "border-5", "border-warning"]
    },
    {
      "title": "Healthy back",
      "start": "2024-08-02T12:00",
      "end": "2024-08-02T13:30",
      "classNames": ["event-custom-style", "bg-light", "text-nav", "border-0", "rounded-1", "p-2", "ps-3", "border-start", "border-5", "border-info"]
    },
    {
      "title": "Relax yoga",
      "start": "2024-08-02T18:45",
      "end": "2024-08-02T20:00",
      "classNames": ["event-custom-style", "bg-light", "text-nav", "border-0", "rounded-1", "p-2", "ps-3", "border-start", "border-5", "border-danger"]
    },
    {
      "title": "Beginners",
      "start": "2024-08-03T11:00",
      "end": "2024-08-03T13:00",
      "classNames": ["event-custom-style", "bg-light", "text-nav", "border-0", "rounded-1", "p-2", "ps-3", "border-start", "border-5", "border-success"]
    }
  ]
}'></div>