Booking Packageの「選べない日付・時間」の色を変える

Booking Packageの選べない日付や時間はデフォルトでは「赤」で設定されています。
これが分かりにくいとクライアント様からご指摘がありましたのでグレーアウトしました。
確かにこの方が分かりやすいかなと思うのでシェアしますね。(自身の備忘録でもあるw)
以下を追加のCSSに記入するだけです。

/*選べない日付をグレーアウトする*/
.selectable_day_slot.closed {
color: #aaa !important;
background-color: #f5f5f5 !important;
}

/*選べない時間をグレーアウトする*/
.selectable_time_slot.closed .timeSlot {
color: #ddd !important;
}

追記。
Booking Packageのデフォルトの「選択時の背景色」がグレーなので、これをすると少しわかりにくくなるのでオンマウスした時とか選択した時の色をサイトのデザインに合わせて変えておくと更に分かりやすいと思います。
その部分の設定はBooking Packageの設定から変更出来ます。
一般設定→デザイン→「選択したラベルのバックグラウンド カラー」と「マウスオーバー時のバックグラウンドカラー」

便利だったよ〜という方はコメント残してくださると嬉しいです♡

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

コメント

コメントする

目次