@primeuix/styles
Version:
168 lines (139 loc) • 5.13 kB
JavaScript
import{css}from"@primeuix/styled";var style=css`
.p-inputnumber {
display: inline-flex;
position: relative;
}
.p-inputnumber-button {
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
cursor: pointer;
background: dt('inputnumber.button.background');
color: dt('inputnumber.button.color');
width: dt('inputnumber.button.width');
transition:
background dt('inputnumber.transition.duration'),
color dt('inputnumber.transition.duration'),
border-color dt('inputnumber.transition.duration'),
outline-color dt('inputnumber.transition.duration');
}
.p-inputnumber-button:disabled {
cursor: auto;
}
.p-inputnumber-button:not(:disabled):hover {
background: dt('inputnumber.button.hover.background');
color: dt('inputnumber.button.hover.color');
}
.p-inputnumber-button:not(:disabled):active {
background: dt('inputnumber.button.active.background');
color: dt('inputnumber.button.active.color');
}
.p-inputnumber-stacked .p-inputnumber-button {
position: relative;
border: 0 none;
}
.p-inputnumber-stacked .p-inputnumber-button-group {
display: flex;
flex-direction: column;
position: absolute;
inset-block-start: 1px;
inset-inline-end: 1px;
height: calc(100% - 2px);
z-index: 1;
}
.p-inputnumber-stacked .p-inputnumber-increment-button {
padding: 0;
border-start-end-radius: calc(dt('inputnumber.button.border.radius') - 1px);
}
.p-inputnumber-stacked .p-inputnumber-decrement-button {
padding: 0;
border-end-end-radius: calc(dt('inputnumber.button.border.radius') - 1px);
}
.p-inputnumber-stacked .p-inputnumber-button {
flex: 1 1 auto;
border: 0 none;
}
.p-inputnumber-horizontal .p-inputnumber-button {
border: 1px solid dt('inputnumber.button.border.color');
}
.p-inputnumber-horizontal .p-inputnumber-button:hover {
border-color: dt('inputnumber.button.hover.border.color');
}
.p-inputnumber-horizontal .p-inputnumber-button:active {
border-color: dt('inputnumber.button.active.border.color');
}
.p-inputnumber-horizontal .p-inputnumber-increment-button {
order: 3;
border-start-end-radius: dt('inputnumber.button.border.radius');
border-end-end-radius: dt('inputnumber.button.border.radius');
border-inline-start: 0 none;
}
.p-inputnumber-horizontal .p-inputnumber-input {
order: 2;
border-radius: 0;
}
.p-inputnumber-horizontal .p-inputnumber-decrement-button {
order: 1;
border-start-start-radius: dt('inputnumber.button.border.radius');
border-end-start-radius: dt('inputnumber.button.border.radius');
border-inline-end: 0 none;
}
.p-floatlabel:has(.p-inputnumber-horizontal) label {
margin-inline-start: dt('inputnumber.button.width');
}
.p-inputnumber-vertical {
flex-direction: column;
}
.p-inputnumber-vertical .p-inputnumber-button {
border: 1px solid dt('inputnumber.button.border.color');
padding: dt('inputnumber.button.vertical.padding');
}
.p-inputnumber-vertical .p-inputnumber-button:hover {
border-color: dt('inputnumber.button.hover.border.color');
}
.p-inputnumber-vertical .p-inputnumber-button:active {
border-color: dt('inputnumber.button.active.border.color');
}
.p-inputnumber-vertical .p-inputnumber-increment-button {
order: 1;
border-start-start-radius: dt('inputnumber.button.border.radius');
border-start-end-radius: dt('inputnumber.button.border.radius');
width: 100%;
border-block-end: 0 none;
}
.p-inputnumber-vertical .p-inputnumber-input {
order: 2;
border-radius: 0;
text-align: center;
}
.p-inputnumber-vertical .p-inputnumber-decrement-button {
order: 3;
border-end-start-radius: dt('inputnumber.button.border.radius');
border-end-end-radius: dt('inputnumber.button.border.radius');
width: 100%;
border-block-start: 0 none;
}
.p-inputnumber-input {
flex: 1 1 auto;
}
.p-inputnumber-fluid {
width: 100%;
}
.p-inputnumber-fluid .p-inputnumber-input {
width: 1%;
}
.p-inputnumber-fluid.p-inputnumber-vertical .p-inputnumber-input {
width: 100%;
}
.p-inputnumber:has(.p-inputtext-sm) .p-inputnumber-button .p-icon {
font-size: dt('form.field.sm.font.size');
width: dt('form.field.sm.font.size');
height: dt('form.field.sm.font.size');
}
.p-inputnumber:has(.p-inputtext-lg) .p-inputnumber-button .p-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