UNPKG

@primeuix/styles

Version:
417 lines (355 loc) 14.1 kB
import{css}from"@primeuix/styled";var style=css` .p-datepicker { display: inline-flex; max-width: 100%; } .p-datepicker-input { flex: 1 1 auto; width: 1%; } .p-datepicker:has(.p-datepicker-dropdown) .p-datepicker-input { border-start-end-radius: 0; border-end-end-radius: 0; } .p-datepicker-dropdown { cursor: pointer; display: inline-flex; user-select: none; align-items: center; justify-content: center; overflow: hidden; position: relative; width: dt('datepicker.dropdown.width'); border-start-end-radius: dt('datepicker.dropdown.border.radius'); border-end-end-radius: dt('datepicker.dropdown.border.radius'); background: dt('datepicker.dropdown.background'); border: 1px solid dt('datepicker.dropdown.border.color'); border-inline-start: 0 none; color: dt('datepicker.dropdown.color'); transition: background dt('datepicker.transition.duration'), color dt('datepicker.transition.duration'), border-color dt('datepicker.transition.duration'), outline-color dt('datepicker.transition.duration'); outline-color: transparent; } .p-datepicker-dropdown:not(:disabled):hover { background: dt('datepicker.dropdown.hover.background'); border-color: dt('datepicker.dropdown.hover.border.color'); color: dt('datepicker.dropdown.hover.color'); } .p-datepicker-dropdown:not(:disabled):active { background: dt('datepicker.dropdown.active.background'); border-color: dt('datepicker.dropdown.active.border.color'); color: dt('datepicker.dropdown.active.color'); } .p-datepicker-dropdown:focus-visible { box-shadow: dt('datepicker.dropdown.focus.ring.shadow'); outline: dt('datepicker.dropdown.focus.ring.width') dt('datepicker.dropdown.focus.ring.style') dt('datepicker.dropdown.focus.ring.color'); outline-offset: dt('datepicker.dropdown.focus.ring.offset'); } .p-datepicker:has(.p-datepicker-input-icon-container) { position: relative; } .p-datepicker:has(.p-datepicker-input-icon-container) .p-datepicker-input { padding-inline-end: calc((dt('form.field.padding.x') * 2) + dt('icon.size')); } .p-datepicker-input-icon-container { cursor: pointer; position: absolute; top: 50%; inset-inline-end: dt('form.field.padding.x'); margin-block-start: calc(-1 * (dt('icon.size') / 2)); color: dt('datepicker.input.icon.color'); line-height: 1; } .p-datepicker-fluid { display: flex; } .p-datepicker-fluid .p-datepicker-input { width: 1%; } .p-datepicker .p-datepicker-panel { min-width: 100%; } .p-datepicker-panel { width: auto; padding: dt('datepicker.panel.padding'); background: dt('datepicker.panel.background'); color: dt('datepicker.panel.color'); border: 1px solid dt('datepicker.panel.border.color'); border-radius: dt('datepicker.panel.border.radius'); box-shadow: dt('datepicker.panel.shadow'); } .p-datepicker-panel-inline { display: inline-block; overflow-x: auto; box-shadow: none; } .p-datepicker-header { display: flex; align-items: center; justify-content: space-between; padding: dt('datepicker.header.padding'); background: dt('datepicker.header.background'); color: dt('datepicker.header.color'); border-block-end: 1px solid dt('datepicker.header.border.color'); } .p-datepicker-next-button:dir(rtl) { order: -1; } .p-datepicker-prev-button:dir(rtl) { order: 1; } .p-datepicker-title { display: flex; align-items: center; justify-content: space-between; gap: dt('datepicker.title.gap'); font-weight: dt('datepicker.title.font.weight'); } .p-datepicker-select-year, .p-datepicker-select-month { border: none; background: transparent; margin: 0; cursor: pointer; font-weight: inherit; transition: background dt('datepicker.transition.duration'), color dt('datepicker.transition.duration'), border-color dt('datepicker.transition.duration'), outline-color dt('datepicker.transition.duration'), box-shadow dt('datepicker.transition.duration'); } .p-datepicker-select-month { padding: dt('datepicker.select.month.padding'); color: dt('datepicker.select.month.color'); border-radius: dt('datepicker.select.month.border.radius'); } .p-datepicker-select-year { padding: dt('datepicker.select.year.padding'); color: dt('datepicker.select.year.color'); border-radius: dt('datepicker.select.year.border.radius'); } .p-datepicker-select-month:enabled:hover { background: dt('datepicker.select.month.hover.background'); color: dt('datepicker.select.month.hover.color'); } .p-datepicker-select-year:enabled:hover { background: dt('datepicker.select.year.hover.background'); color: dt('datepicker.select.year.hover.color'); } .p-datepicker-select-month:focus-visible, .p-datepicker-select-year:focus-visible { box-shadow: dt('datepicker.date.focus.ring.shadow'); outline: dt('datepicker.date.focus.ring.width') dt('datepicker.date.focus.ring.style') dt('datepicker.date.focus.ring.color'); outline-offset: dt('datepicker.date.focus.ring.offset'); } .p-datepicker-calendar-container { display: flex; } .p-datepicker-calendar-container .p-datepicker-calendar { flex: 1 1 auto; border-inline-start: 1px solid dt('datepicker.group.border.color'); padding-inline-end: dt('datepicker.group.gap'); padding-inline-start: dt('datepicker.group.gap'); } .p-datepicker-calendar-container .p-datepicker-calendar:first-child { padding-inline-start: 0; border-inline-start: 0 none; } .p-datepicker-calendar-container .p-datepicker-calendar:last-child { padding-inline-end: 0; } .p-datepicker-day-view { width: 100%; border-collapse: collapse; font-size: 1rem; margin: dt('datepicker.day.view.margin'); } .p-datepicker-weekday-cell { padding: dt('datepicker.week.day.padding'); } .p-datepicker-weekday { font-weight: dt('datepicker.week.day.font.weight'); color: dt('datepicker.week.day.color'); } .p-datepicker-day-cell { padding: dt('datepicker.date.padding'); } .p-datepicker-day { display: flex; justify-content: center; align-items: center; cursor: pointer; margin: 0 auto; overflow: hidden; position: relative; width: dt('datepicker.date.width'); height: dt('datepicker.date.height'); border-radius: dt('datepicker.date.border.radius'); transition: background dt('datepicker.transition.duration'), color dt('datepicker.transition.duration'), border-color dt('datepicker.transition.duration'), box-shadow dt('datepicker.transition.duration'), outline-color dt('datepicker.transition.duration'); border: 1px solid transparent; outline-color: transparent; color: dt('datepicker.date.color'); } .p-datepicker-day:not(.p-datepicker-day-selected):not(.p-disabled):hover { background: dt('datepicker.date.hover.background'); color: dt('datepicker.date.hover.color'); } .p-datepicker-day:focus-visible { box-shadow: dt('datepicker.date.focus.ring.shadow'); outline: dt('datepicker.date.focus.ring.width') dt('datepicker.date.focus.ring.style') dt('datepicker.date.focus.ring.color'); outline-offset: dt('datepicker.date.focus.ring.offset'); } .p-datepicker-day-selected { background: dt('datepicker.date.selected.background'); color: dt('datepicker.date.selected.color'); } .p-datepicker-day-selected-range { background: dt('datepicker.date.range.selected.background'); color: dt('datepicker.date.range.selected.color'); } .p-datepicker-today > .p-datepicker-day { background: dt('datepicker.today.background'); color: dt('datepicker.today.color'); } .p-datepicker-today > .p-datepicker-day-selected { background: dt('datepicker.date.selected.background'); color: dt('datepicker.date.selected.color'); } .p-datepicker-today > .p-datepicker-day-selected-range { background: dt('datepicker.date.range.selected.background'); color: dt('datepicker.date.range.selected.color'); } .p-datepicker-weeknumber { text-align: center; } .p-datepicker-month-view { margin: dt('datepicker.month.view.margin'); } .p-datepicker-month { width: 33.3%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; position: relative; padding: dt('datepicker.month.padding'); transition: background dt('datepicker.transition.duration'), color dt('datepicker.transition.duration'), border-color dt('datepicker.transition.duration'), box-shadow dt('datepicker.transition.duration'), outline-color dt('datepicker.transition.duration'); border-radius: dt('datepicker.month.border.radius'); outline-color: transparent; color: dt('datepicker.date.color'); } .p-datepicker-month:not(.p-disabled):not(.p-datepicker-month-selected):hover { color: dt('datepicker.date.hover.color'); background: dt('datepicker.date.hover.background'); } .p-datepicker-month-selected { color: dt('datepicker.date.selected.color'); background: dt('datepicker.date.selected.background'); } .p-datepicker-month:not(.p-disabled):focus-visible { box-shadow: dt('datepicker.date.focus.ring.shadow'); outline: dt('datepicker.date.focus.ring.width') dt('datepicker.date.focus.ring.style') dt('datepicker.date.focus.ring.color'); outline-offset: dt('datepicker.date.focus.ring.offset'); } .p-datepicker-year-view { margin: dt('datepicker.year.view.margin'); } .p-datepicker-year { width: 50%; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; overflow: hidden; position: relative; padding: dt('datepicker.year.padding'); transition: background dt('datepicker.transition.duration'), color dt('datepicker.transition.duration'), border-color dt('datepicker.transition.duration'), box-shadow dt('datepicker.transition.duration'), outline-color dt('datepicker.transition.duration'); border-radius: dt('datepicker.year.border.radius'); outline-color: transparent; color: dt('datepicker.date.color'); } .p-datepicker-year:not(.p-disabled):not(.p-datepicker-year-selected):hover { color: dt('datepicker.date.hover.color'); background: dt('datepicker.date.hover.background'); } .p-datepicker-year-selected { color: dt('datepicker.date.selected.color'); background: dt('datepicker.date.selected.background'); } .p-datepicker-year:not(.p-disabled):focus-visible { box-shadow: dt('datepicker.date.focus.ring.shadow'); outline: dt('datepicker.date.focus.ring.width') dt('datepicker.date.focus.ring.style') dt('datepicker.date.focus.ring.color'); outline-offset: dt('datepicker.date.focus.ring.offset'); } .p-datepicker-buttonbar { display: flex; justify-content: space-between; align-items: center; padding: dt('datepicker.buttonbar.padding'); border-block-start: 1px solid dt('datepicker.buttonbar.border.color'); } .p-datepicker-buttonbar .p-button { width: auto; } .p-datepicker-time-picker { display: flex; justify-content: center; align-items: center; border-block-start: 1px solid dt('datepicker.time.picker.border.color'); padding: 0; gap: dt('datepicker.time.picker.gap'); } .p-datepicker-calendar-container + .p-datepicker-time-picker { padding: dt('datepicker.time.picker.padding'); } .p-datepicker-time-picker > div { display: flex; align-items: center; flex-direction: column; gap: dt('datepicker.time.picker.button.gap'); } .p-datepicker-time-picker span { font-size: 1rem; } .p-datepicker-timeonly .p-datepicker-time-picker { border-block-start: 0 none; } .p-datepicker:has(.p-inputtext-sm) .p-datepicker-dropdown { width: dt('datepicker.dropdown.sm.width'); } .p-datepicker:has(.p-inputtext-sm) .p-datepicker-dropdown .p-icon, .p-datepicker:has(.p-inputtext-sm) .p-datepicker-input-icon { font-size: dt('form.field.sm.font.size'); width: dt('form.field.sm.font.size'); height: dt('form.field.sm.font.size'); } .p-datepicker:has(.p-inputtext-lg) .p-datepicker-dropdown { width: dt('datepicker.dropdown.lg.width'); } .p-datepicker:has(.p-inputtext-lg) .p-datepicker-dropdown .p-icon, .p-datepicker:has(.p-inputtext-lg) .p-datepicker-input-icon { font-size: dt('form.field.lg.font.size'); width: dt('form.field.lg.font.size'); height: dt('form.field.lg.font.size'); } `;export{style};//# sourceMappingURL=index.mjs.map