_chrome91-bug-timegrid.html 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset='utf-8' />
  5. <link href='../packages/bundle/main.css' rel='stylesheet' />
  6. <script src='../packages/bundle/main.js'></script>
  7. <script>
  8. document.addEventListener('DOMContentLoaded', function() {
  9. var calendarEl = document.getElementById('calendar');
  10. var calendar = new FullCalendar.Calendar(calendarEl, {
  11. initialView: 'timeGridWeek',
  12. allDaySlot: false,
  13. slotDuration: '00:10',
  14. slotLabelInterval: '00:30',
  15. timeZone: 'UTC',
  16. editable: true,
  17. initialDate: '2021-06-02',
  18. events: [
  19. {
  20. resourceId: 'a',
  21. title: 'Timed Event',
  22. start: '2021-06-02T16:00:00+00:00'
  23. },
  24. {
  25. resourceId: 'b',
  26. title: 'Conference',
  27. start: '2021-06-02'
  28. },
  29. {
  30. resourceId: 'c',
  31. title: 'Meeting',
  32. start: '2021-06-02T10:30:00+00:00',
  33. end: '2021-06-02T12:30:00+00:00'
  34. },
  35. {
  36. resourceId: 'a',
  37. title: 'Lunch',
  38. start: '2021-06-02T12:00:00+00:00'
  39. }
  40. ]
  41. });
  42. calendar.render();
  43. });
  44. </script>
  45. <style>
  46. body {
  47. margin: 40px 10px;
  48. padding: 0;
  49. font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  50. font-size: 14px;
  51. }
  52. #calendar {
  53. max-width: 1100px;
  54. margin: 0 auto;
  55. }
  56. /* required to cause the bug
  57. .fc-theme-standard td {
  58. border: none !important;
  59. }
  60. .fc-theme-standard th {
  61. border: none !important;
  62. }
  63. */
  64. /* CSS-only fix
  65. .fc-scrollgrid-section-liquid {
  66. height: 1px !important;
  67. }
  68. */
  69. </style>
  70. </head>
  71. <body>
  72. <div id='calendar'></div>
  73. </body>
  74. </html>