Skip to content

CSS: calendar.day

.day — เซลล์ของวัน (InstUI Calendar.Day); -today, -selected และ -outside-month ระบุสถานะของมัน.

การใช้งาน

css
@import "@pantoken/components/components.css";
@import "@pantoken/components/calendar.day.css";

ตัวปรับแต่ง

ตัวปรับแต่งคำอธิบาย
.-outside-monthวันจากเดือนข้างเคียง (ตัวเติมหน้า/หลัง).
.-selectedวันที่ที่ถูกเลือก.
.-todayวันที่ของวันนี้.

โทเค็นที่ใช้

Tokenชนิดค่า
--instui-component-calendar-day-background<color>LightDarklight-dark(#ffffff, #171B21)
--instui-component-calendar-day-color<color>LightDarklight-dark(#273540, #F2F4F5)
--instui-component-calendar-day-font-size<length>1rem
--instui-component-calendar-day-height<length>2rem
--instui-component-calendar-day-min-width<length>2rem
--instui-component-calendar-day-outside-month-color<color>LightDarklight-dark(#576773, #AAB0B5)
--instui-component-calendar-day-selected-background<color>#037D37
--instui-component-calendar-day-selected-border-radius<length>0.75rem
--instui-component-calendar-day-selected-color<color>#ffffff
--instui-component-calendar-day-today-background<color>LightDarklight-dark(#1D354F, #EEF4FD)
--instui-component-calendar-day-today-border-radius<length>999rem
--instui-component-calendar-day-today-color<color>LightDarklight-dark(#ffffff, #1C222B)