如何设置PrimeFaces的Schedule组件的样式？

Question

我想知道如何设置Primefaces的Schedule组件的样式，因为组件的默认样式看起来不太好。我的问题是左侧标题的prev，next和today部分都在同一个块中，我想要实现的输出是PrimeFaces Showcase中它们被分开的样式。

我只是想说我不是前端开发人员所以我对如何使用css知之甚少（我当然知道基础知识）而且我只想让我的项目看起来很好所以我希望我不会在这个问题上投票。谢谢！ ：）

下面是我的输出图片和PrimeFaces Showcase的图片，我想知道它们是如何设计的。

我的输出（这是我唯一担心的，因此pic很小）： 1

我的代码：

<p:schedule id="holidayCalendar" value="#{SchoolYearAdd.holidayCalendarModel}" widgetVar="holidayCalendarVar"
            draggable="false" resizable="false" ignoreTimezone="false"
            leftHeaderTemplate="prev,next,today" rightHeaderTemplate="null">
    <p:ajax event="dateSelect" listener="#{SchoolYearAdd.onDateSelect}"
            update="eventDetails" oncomplete="PF('eventDialog').show();" />
</p:schedule>

PrimeFaces Showcase的输出： 2