fullcalender v5 イベントの時間表示の切り分けをしたい

Question

前提・実現したいこと

fullcalenderを使って、railsのアプリを作成しています。
fullcalenderのカレンダーは表示出来たのですが、
月表示では、イベントの時間表示なし
リスト表示では、イベントの時間表示あり

というように表示を変えたいです。

月表示は時間表示なしでOK

リスト表示にだけ時間を表示したい。

該当のソースコード

import { Calendar } from '@fullcalendar/core';
import dayGridPlugin from '@fullcalendar/daygrid';
import interactionPlugin from '@fullcalendar/interaction';
import listPlugin from '@fullcalendar/list';
import timeGridPlugin from '@fullcalendar/timegrid';

document.addEventListener('turbolinks:load', function() {

  let calendarEl = document.getElementById('calendar');
  let calendar = new Calendar(calendarEl, {
    navLinks: true,
    editable: true,
    nowIndicator: true,
    initialView: 'dayGridMonth',
    displayEventTime: false,
    locale: 'ja',
    timeZone: 'Asia/Tokyo',
    height: 600,
    headerToolbar: {
      left: "dayGridMonth,timeGridWeek,timeGridDay,listMonth",
      center: "title",
      right: "today prev,next"
    },
    buttonText: {
      today: '今日',
      month: '月',
      list: 'リスト',
      week: '週',
      day: '日',
    },
    views: {
      timeGridWeek: {
        slotMinTime: '07:00:00',
        slotMaxTime: '22:00:00'
      },
      timeGridDay: {
        slotMinTime: '07:00:00',
        slotMaxTime: '22:00:00'
      }
    },
    eventClick: function(event) {
    },
    dayCellContent: function(e) {
      e.dayNumberText = e.dayNumberText.replace('日', '');
    },
    

    eventSources: [{url:'/events.json',
    color: '#2ECCFA'}
    ],
    plugins: [ dayGridPlugin, timeGridPlugin, interactionPlugin, listPlugin,  ]
  });

  calendar.render();
});

補足情報（FW/ツールのバージョンなど）

rails'6.0.0'
fullcalender v5

---

公式サイトなど調べても方法が分からなかった為、質問させて頂きました。
宜しくお願い致します。

Answer 1

公式のサンプルでしか確認していませんが、以下のようにするといかがでしょうか？

.fc-dayGridMonth-view .fc-event-time {
	display: none;
}

Comments

[a-ichi]

Lhankor_Mhy様

ありがとうございます。
試してみます。