pull/4556/head
Tuğçe Küçükoğlu 2023-09-25 22:11:55 +03:00
parent aca8d3ecf7
commit e6499c0365
73 changed files with 4097 additions and 3951 deletions

View File

@ -3,21 +3,23 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-accordion-header-action { @layer primevue {
cursor: pointer; .p-accordion-header-action {
display: flex; cursor: pointer;
align-items: center; display: flex;
user-select: none; align-items: center;
position: relative; user-select: none;
text-decoration: none; position: relative;
} text-decoration: none;
}
.p-accordion-header-action:focus {
z-index: 1; .p-accordion-header-action:focus {
} z-index: 1;
}
.p-accordion-header-text {
line-height: 1; .p-accordion-header-text {
line-height: 1;
}
} }
`; `;

View File

@ -4,100 +4,102 @@ import { useStyle } from 'primevue/usestyle';
import { ObjectUtils } from 'primevue/utils'; import { ObjectUtils } from 'primevue/utils';
const styles = ` const styles = `
.p-autocomplete { @layer primevue {
display: inline-flex; .p-autocomplete {
} display: inline-flex;
}
.p-autocomplete-loader { .p-autocomplete-loader {
position: absolute; position: absolute;
top: 50%; top: 50%;
margin-top: -0.5rem; margin-top: -0.5rem;
} }
.p-autocomplete-dd .p-autocomplete-input { .p-autocomplete-dd .p-autocomplete-input {
flex: 1 1 auto; flex: 1 1 auto;
width: 1%; width: 1%;
} }
.p-autocomplete-dd .p-autocomplete-input, .p-autocomplete-dd .p-autocomplete-input,
.p-autocomplete-dd .p-autocomplete-multiple-container { .p-autocomplete-dd .p-autocomplete-multiple-container {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.p-autocomplete-dd .p-autocomplete-dropdown { .p-autocomplete-dd .p-autocomplete-dropdown {
border-top-left-radius: 0; border-top-left-radius: 0;
border-bottom-left-radius: 0px; border-bottom-left-radius: 0px;
} }
.p-autocomplete .p-autocomplete-panel { .p-autocomplete .p-autocomplete-panel {
min-width: 100%; min-width: 100%;
} }
.p-autocomplete-panel { .p-autocomplete-panel {
position: absolute; position: absolute;
overflow: auto; overflow: auto;
top: 0; top: 0;
left: 0; left: 0;
} }
.p-autocomplete-items { .p-autocomplete-items {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
} }
.p-autocomplete-item { .p-autocomplete-item {
cursor: pointer; cursor: pointer;
white-space: nowrap; white-space: nowrap;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
} }
.p-autocomplete-multiple-container { .p-autocomplete-multiple-container {
margin: 0; margin: 0;
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
cursor: text; cursor: text;
overflow: hidden; overflow: hidden;
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.p-autocomplete-token { .p-autocomplete-token {
cursor: default; cursor: default;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
flex: 0 0 auto; flex: 0 0 auto;
} }
.p-autocomplete-token-icon { .p-autocomplete-token-icon {
cursor: pointer; cursor: pointer;
} }
.p-autocomplete-input-token { .p-autocomplete-input-token {
flex: 1 1 auto; flex: 1 1 auto;
display: inline-flex; display: inline-flex;
} }
.p-autocomplete-input-token input { .p-autocomplete-input-token input {
border: 0 none; border: 0 none;
outline: 0 none; outline: 0 none;
background-color: transparent; background-color: transparent;
margin: 0; margin: 0;
padding: 0; padding: 0;
box-shadow: none; box-shadow: none;
border-radius: 0; border-radius: 0;
width: 100%; width: 100%;
} }
.p-fluid .p-autocomplete { .p-fluid .p-autocomplete {
display: flex; display: flex;
} }
.p-fluid .p-autocomplete-dd .p-autocomplete-input { .p-fluid .p-autocomplete-dd .p-autocomplete-input {
width: 1%; width: 1%;
}
} }
`; `;

View File

@ -3,34 +3,36 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-avatar { @layer primevue {
display: inline-flex; .p-avatar {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
width: 2rem; justify-content: center;
height: 2rem; width: 2rem;
font-size: 1rem; height: 2rem;
} font-size: 1rem;
}
.p-avatar.p-avatar-image {
background-color: transparent; .p-avatar.p-avatar-image {
} background-color: transparent;
}
.p-avatar.p-avatar-circle {
border-radius: 50%; .p-avatar.p-avatar-circle {
} border-radius: 50%;
}
.p-avatar-circle img {
border-radius: 50%; .p-avatar-circle img {
} border-radius: 50%;
}
.p-avatar .p-avatar-icon {
font-size: 1rem; .p-avatar .p-avatar-icon {
} font-size: 1rem;
}
.p-avatar img {
width: 100%; .p-avatar img {
height: 100%; width: 100%;
height: 100%;
}
} }
`; `;

View File

@ -3,13 +3,15 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-avatar-group .p-avatar + .p-avatar { @layer primevue {
margin-left: -1rem; .p-avatar-group .p-avatar + .p-avatar {
} margin-left: -1rem;
}
.p-avatar-group {
display: flex; .p-avatar-group {
align-items: center; display: flex;
align-items: center;
}
} }
`; `;

View File

@ -4,37 +4,39 @@ import { useStyle } from 'primevue/usestyle';
import { ObjectUtils } from 'primevue/utils'; import { ObjectUtils } from 'primevue/utils';
const styles = ` const styles = `
.p-badge { @layer primevue {
display: inline-block; .p-badge {
border-radius: 10px; display: inline-block;
text-align: center; border-radius: 10px;
padding: 0 .5rem; text-align: center;
} padding: 0 .5rem;
}
.p-overlay-badge {
position: relative; .p-overlay-badge {
} position: relative;
}
.p-overlay-badge .p-badge {
position: absolute; .p-overlay-badge .p-badge {
top: 0; position: absolute;
right: 0; top: 0;
transform: translate(50%,-50%); right: 0;
transform-origin: 100% 0; transform: translate(50%,-50%);
margin: 0; transform-origin: 100% 0;
} margin: 0;
}
.p-badge-dot {
width: .5rem; .p-badge-dot {
min-width: .5rem; width: .5rem;
height: .5rem; min-width: .5rem;
border-radius: 50%; height: .5rem;
padding: 0; border-radius: 50%;
} padding: 0;
}
.p-badge-no-gutter {
padding: 0; .p-badge-no-gutter {
border-radius: 50%; padding: 0;
border-radius: 50%;
}
} }
`; `;

View File

@ -2,37 +2,39 @@ import BaseDirective from 'primevue/basedirective';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-badge { @layer primevue {
display: inline-block; .p-badge {
border-radius: 10px; display: inline-block;
text-align: center; border-radius: 10px;
padding: 0 .5rem; text-align: center;
} padding: 0 .5rem;
}
.p-overlay-badge {
position: relative;
}
.p-overlay-badge .p-badge {
position: absolute;
top: 0;
right: 0;
transform: translate(50%,-50%);
transform-origin: 100% 0;
margin: 0;
}
.p-badge-dot {
width: .5rem;
min-width: .5rem;
height: .5rem;
border-radius: 50%;
padding: 0;
}
.p-overlay-badge { .p-badge-no-gutter {
position: relative; padding: 0;
} border-radius: 50%;
}
.p-overlay-badge .p-badge {
position: absolute;
top: 0;
right: 0;
transform: translate(50%,-50%);
transform-origin: 100% 0;
margin: 0;
}
.p-badge-dot {
width: .5rem;
min-width: .5rem;
height: .5rem;
border-radius: 50%;
padding: 0;
}
.p-badge-no-gutter {
padding: 0;
border-radius: 50%;
} }
`; `;

View File

@ -231,6 +231,7 @@ const radioButtonStyles = `
} }
`; `;
const styles = ` const styles = `
@layer primevue {
.p-component, .p-component * { .p-component, .p-component * {
box-sizing: border-box; box-sizing: border-box;
} }
@ -354,6 +355,7 @@ ${buttonStyles}
${checkboxStyles} ${checkboxStyles}
${inputTextStyles} ${inputTextStyles}
${radioButtonStyles} ${radioButtonStyles}
}
`; `;
const { load: loadStyle } = useStyle(styles, { name: 'common', manual: true }); const { load: loadStyle } = useStyle(styles, { name: 'common', manual: true });

View File

@ -3,16 +3,18 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-blockui-container { @layer primevue {
position: relative; .p-blockui-container {
} position: relative;
}
.p-blockui.p-component-overlay {
position: absolute; .p-blockui.p-component-overlay {
} position: absolute;
}
.p-blockui-document.p-component-overlay {
position: fixed; .p-blockui-document.p-component-overlay {
position: fixed;
}
} }
`; `;

View File

@ -3,36 +3,38 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-breadcrumb { @layer primevue {
overflow-x: auto; .p-breadcrumb {
} overflow-x: auto;
}
.p-breadcrumb .p-breadcrumb-list {
margin: 0; .p-breadcrumb .p-breadcrumb-list {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
display: flex; list-style-type: none;
align-items: center; display: flex;
flex-wrap: nowrap; align-items: center;
} flex-wrap: nowrap;
}
.p-breadcrumb .p-menuitem-text {
line-height: 1; .p-breadcrumb .p-menuitem-text {
} line-height: 1;
}
.p-breadcrumb .p-menuitem-link {
text-decoration: none; .p-breadcrumb .p-menuitem-link {
display: flex; text-decoration: none;
align-items: center; display: flex;
} align-items: center;
}
.p-breadcrumb .p-menuitem-separator {
display: flex; .p-breadcrumb .p-menuitem-separator {
align-items: center; display: flex;
} align-items: center;
}
.p-breadcrumb::-webkit-scrollbar {
display: none; .p-breadcrumb::-webkit-scrollbar {
display: none;
}
} }
`; `;

View File

@ -3,150 +3,152 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-calendar { @layer primevue {
display: inline-flex; .p-calendar {
max-width: 100%; display: inline-flex;
} max-width: 100%;
}
.p-calendar .p-inputtext {
flex: 1 1 auto; .p-calendar .p-inputtext {
width: 1%; flex: 1 1 auto;
} width: 1%;
}
.p-calendar-w-btn .p-inputtext {
border-top-right-radius: 0; .p-calendar-w-btn .p-inputtext {
border-bottom-right-radius: 0; border-top-right-radius: 0;
} border-bottom-right-radius: 0;
}
.p-calendar-w-btn .p-datepicker-trigger {
border-top-left-radius: 0; .p-calendar-w-btn .p-datepicker-trigger {
border-bottom-left-radius: 0; border-top-left-radius: 0;
} border-bottom-left-radius: 0;
}
/* Fluid */
.p-fluid .p-calendar { /* Fluid */
display: flex; .p-fluid .p-calendar {
} display: flex;
}
.p-fluid .p-calendar .p-inputtext {
width: 1%; .p-fluid .p-calendar .p-inputtext {
} width: 1%;
}
/* Datepicker */
.p-calendar .p-datepicker { /* Datepicker */
min-width: 100%; .p-calendar .p-datepicker {
} min-width: 100%;
}
.p-datepicker {
width: auto; .p-datepicker {
} width: auto;
}
.p-datepicker-inline {
display: inline-block; .p-datepicker-inline {
overflow-x: auto; display: inline-block;
} overflow-x: auto;
}
/* Header */
.p-datepicker-header { /* Header */
display: flex; .p-datepicker-header {
align-items: center; display: flex;
justify-content: space-between; align-items: center;
} justify-content: space-between;
}
.p-datepicker-header .p-datepicker-title {
margin: 0 auto; .p-datepicker-header .p-datepicker-title {
} margin: 0 auto;
}
.p-datepicker-prev,
.p-datepicker-next { .p-datepicker-prev,
cursor: pointer; .p-datepicker-next {
display: inline-flex; cursor: pointer;
justify-content: center; display: inline-flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
position: relative; overflow: hidden;
} position: relative;
}
/* Multiple Month DatePicker */
.p-datepicker-multiple-month .p-datepicker-group-container { /* Multiple Month DatePicker */
display: flex; .p-datepicker-multiple-month .p-datepicker-group-container {
} display: flex;
}
.p-datepicker-multiple-month .p-datepicker-group-container .p-datepicker-group {
flex: 1 1 auto; .p-datepicker-multiple-month .p-datepicker-group-container .p-datepicker-group {
} flex: 1 1 auto;
}
/* DatePicker Table */
.p-datepicker table { /* DatePicker Table */
width: 100%; .p-datepicker table {
border-collapse: collapse; width: 100%;
} border-collapse: collapse;
}
.p-datepicker td > span {
display: flex; .p-datepicker td > span {
justify-content: center; display: flex;
align-items: center; justify-content: center;
cursor: pointer; align-items: center;
margin: 0 auto; cursor: pointer;
overflow: hidden; margin: 0 auto;
position: relative; overflow: hidden;
} position: relative;
}
/* Month Picker */
.p-monthpicker-month { /* Month Picker */
width: 33.3%; .p-monthpicker-month {
display: inline-flex; width: 33.3%;
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
cursor: pointer; justify-content: center;
overflow: hidden; cursor: pointer;
position: relative; overflow: hidden;
} position: relative;
}
/* Year Picker */
.p-yearpicker-year { /* Year Picker */
width: 50%; .p-yearpicker-year {
display: inline-flex; width: 50%;
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
cursor: pointer; justify-content: center;
overflow: hidden; cursor: pointer;
position: relative; overflow: hidden;
} position: relative;
}
/* Button Bar */
.p-datepicker-buttonbar { /* Button Bar */
display: flex; .p-datepicker-buttonbar {
justify-content: space-between; display: flex;
align-items: center; justify-content: space-between;
} align-items: center;
}
/* Time Picker */
.p-timepicker { /* Time Picker */
display: flex; .p-timepicker {
justify-content: center; display: flex;
align-items: center; justify-content: center;
} align-items: center;
}
.p-timepicker button {
display: flex; .p-timepicker button {
align-items: center; display: flex;
justify-content: center; align-items: center;
cursor: pointer; justify-content: center;
overflow: hidden; cursor: pointer;
position: relative; overflow: hidden;
} position: relative;
}
.p-timepicker > div {
display: flex; .p-timepicker > div {
align-items: center; display: flex;
flex-direction: column; align-items: center;
} flex-direction: column;
}
/* Touch UI */
.p-datepicker-touch-ui, /* Touch UI */
.p-calendar .p-datepicker-touch-ui { .p-datepicker-touch-ui,
min-width: 80vw; .p-calendar .p-datepicker-touch-ui {
min-width: 80vw;
}
} }
`; `;

View File

@ -3,74 +3,76 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-carousel { @layer primevue {
display: flex; .p-carousel {
flex-direction: column; display: flex;
} flex-direction: column;
}
.p-carousel-content {
display: flex; .p-carousel-content {
flex-direction: column; display: flex;
overflow: auto; flex-direction: column;
} overflow: auto;
}
.p-carousel-prev,
.p-carousel-next { .p-carousel-prev,
align-self: center; .p-carousel-next {
flex-grow: 0; align-self: center;
flex-shrink: 0; flex-grow: 0;
display: flex; flex-shrink: 0;
justify-content: center; display: flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
position: relative; overflow: hidden;
} position: relative;
}
.p-carousel-container {
display: flex; .p-carousel-container {
flex-direction: row; display: flex;
} flex-direction: row;
}
.p-carousel-items-content {
overflow: hidden; .p-carousel-items-content {
width: 100%; overflow: hidden;
} width: 100%;
}
.p-carousel-items-container {
display: flex; .p-carousel-items-container {
flex-direction: row; display: flex;
} flex-direction: row;
}
.p-carousel-indicators {
display: flex; .p-carousel-indicators {
flex-direction: row; display: flex;
justify-content: center; flex-direction: row;
flex-wrap: wrap; justify-content: center;
} flex-wrap: wrap;
}
.p-carousel-indicator > button {
display: flex; .p-carousel-indicator > button {
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
/* Vertical */
.p-carousel-vertical .p-carousel-container { /* Vertical */
flex-direction: column; .p-carousel-vertical .p-carousel-container {
} flex-direction: column;
}
.p-carousel-vertical .p-carousel-items-container {
flex-direction: column; .p-carousel-vertical .p-carousel-items-container {
height: 100%; flex-direction: column;
} height: 100%;
}
/* Keyboard Support */
.p-items-hidden .p-carousel-item { /* Keyboard Support */
visibility: hidden; .p-items-hidden .p-carousel-item {
} visibility: hidden;
}
.p-items-hidden .p-carousel-item.p-carousel-item-active {
visibility: visible; .p-items-hidden .p-carousel-item.p-carousel-item-active {
visibility: visible;
}
} }
`; `;

View File

@ -3,85 +3,87 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-cascadeselect { @layer primevue {
display: inline-flex; .p-cascadeselect {
cursor: pointer; display: inline-flex;
user-select: none; cursor: pointer;
} user-select: none;
}
.p-cascadeselect-trigger {
display: flex; .p-cascadeselect-trigger {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
} flex-shrink: 0;
}
.p-cascadeselect-label {
display: block; .p-cascadeselect-label {
white-space: nowrap; display: block;
overflow: hidden; white-space: nowrap;
flex: 1 1 auto; overflow: hidden;
width: 1%; flex: 1 1 auto;
text-overflow: ellipsis; width: 1%;
cursor: pointer; text-overflow: ellipsis;
} cursor: pointer;
}
.p-cascadeselect-label-empty {
overflow: hidden; .p-cascadeselect-label-empty {
visibility: hidden; overflow: hidden;
} visibility: hidden;
}
.p-cascadeselect .p-cascadeselect-panel {
min-width: 100%; .p-cascadeselect .p-cascadeselect-panel {
} min-width: 100%;
}
.p-cascadeselect-item {
cursor: pointer; .p-cascadeselect-item {
font-weight: normal; cursor: pointer;
white-space: nowrap; font-weight: normal;
} white-space: nowrap;
}
.p-cascadeselect-item-content {
display: flex; .p-cascadeselect-item-content {
align-items: center; display: flex;
overflow: hidden; align-items: center;
position: relative; overflow: hidden;
} position: relative;
}
.p-cascadeselect-group-icon {
margin-left: auto; .p-cascadeselect-group-icon {
} margin-left: auto;
}
.p-cascadeselect-items {
margin: 0; .p-cascadeselect-items {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
min-width: 100%; list-style-type: none;
} min-width: 100%;
}
.p-fluid .p-cascadeselect {
display: flex; .p-fluid .p-cascadeselect {
} display: flex;
}
.p-fluid .p-cascadeselect .p-cascadeselect-label {
width: 1%; .p-fluid .p-cascadeselect .p-cascadeselect-label {
} width: 1%;
}
.p-cascadeselect-sublist {
position: absolute; .p-cascadeselect-sublist {
min-width: 100%; position: absolute;
z-index: 1; min-width: 100%;
display: none; z-index: 1;
} display: none;
}
.p-cascadeselect-item-active {
overflow: visible !important; .p-cascadeselect-item-active {
} overflow: visible !important;
}
.p-cascadeselect-item-active > .p-cascadeselect-sublist {
display: block; .p-cascadeselect-item-active > .p-cascadeselect-sublist {
left: 100%; display: block;
top: 0; left: 100%;
top: 0;
}
} }
`; `;

View File

@ -3,8 +3,10 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-chart { @layer primevue {
position: relative; .p-chart {
position: relative;
}
} }
`; `;

View File

@ -3,26 +3,28 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-chip { @layer primevue {
display: inline-flex; .p-chip {
align-items: center; display: inline-flex;
} align-items: center;
}
.p-chip-text {
line-height: 1.5; .p-chip-text {
} line-height: 1.5;
}
.p-chip-icon.pi {
line-height: 1.5; .p-chip-icon.pi {
} line-height: 1.5;
}
.p-chip-remove-icon {
line-height: 1.5; .p-chip-remove-icon {
cursor: pointer; line-height: 1.5;
} cursor: pointer;
}
.p-chip img {
border-radius: 50%; .p-chip img {
border-radius: 50%;
}
} }
`; `;

View File

@ -3,50 +3,52 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-chips { @layer primevue {
display: inline-flex; .p-chips {
} display: inline-flex;
}
.p-chips-multiple-container {
margin: 0; .p-chips-multiple-container {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
cursor: text; list-style-type: none;
overflow: hidden; cursor: text;
display: flex; overflow: hidden;
align-items: center; display: flex;
flex-wrap: wrap; align-items: center;
} flex-wrap: wrap;
}
.p-chips-token {
cursor: default; .p-chips-token {
display: inline-flex; cursor: default;
align-items: center; display: inline-flex;
flex: 0 0 auto; align-items: center;
} flex: 0 0 auto;
}
.p-chips-input-token {
flex: 1 1 auto; .p-chips-input-token {
display: inline-flex; flex: 1 1 auto;
} display: inline-flex;
}
.p-chips-token-icon {
cursor: pointer; .p-chips-token-icon {
} cursor: pointer;
}
.p-chips-input-token input {
border: 0 none; .p-chips-input-token input {
outline: 0 none; border: 0 none;
background-color: transparent; outline: 0 none;
margin: 0; background-color: transparent;
padding: 0; margin: 0;
box-shadow: none; padding: 0;
border-radius: 0; box-shadow: none;
width: 100%; border-radius: 0;
} width: 100%;
}
.p-fluid .p-chips {
display: flex; .p-fluid .p-chips {
display: flex;
}
} }
`; `;

View File

@ -3,12 +3,14 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-colorpicker-panel .p-colorpicker-color { @layer primevue {
background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%) .p-colorpicker-panel .p-colorpicker-color {
} background: linear-gradient(to top, #000 0%, rgb(0 0 0 / 0) 100%), linear-gradient(to right, #fff 0%, rgb(255 255 255 / 0) 100%)
}
.p-colorpicker-panel .p-colorpicker-hue {
background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red) .p-colorpicker-panel .p-colorpicker-hue {
background: linear-gradient(0deg, red 0, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, red)
}
} }
`; `;

View File

@ -3,74 +3,76 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-confirm-popup { @layer primevue {
position: absolute; .p-confirm-popup {
margin-top: 10px; position: absolute;
top: 0; margin-top: 10px;
left: 0; top: 0;
} left: 0;
}
.p-confirm-popup-flipped {
margin-top: 0; .p-confirm-popup-flipped {
margin-bottom: 10px; margin-top: 0;
} margin-bottom: 10px;
}
/* Animation */
.p-confirm-popup-enter-from { /* Animation */
opacity: 0; .p-confirm-popup-enter-from {
transform: scaleY(0.8); opacity: 0;
} transform: scaleY(0.8);
}
.p-confirm-popup-leave-to {
opacity: 0; .p-confirm-popup-leave-to {
} opacity: 0;
}
.p-confirm-popup-enter-active {
transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1); .p-confirm-popup-enter-active {
} transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1);
}
.p-confirm-popup-leave-active {
transition: opacity 0.1s linear; .p-confirm-popup-leave-active {
} transition: opacity 0.1s linear;
}
.p-confirm-popup:after,
.p-confirm-popup:before { .p-confirm-popup:after,
bottom: 100%; .p-confirm-popup:before {
left: calc(var(--overlayArrowLeft, 0) + 1.25rem); bottom: 100%;
content: ' '; left: calc(var(--overlayArrowLeft, 0) + 1.25rem);
height: 0; content: ' ';
width: 0; height: 0;
position: absolute; width: 0;
pointer-events: none; position: absolute;
} pointer-events: none;
}
.p-confirm-popup:after {
border-width: 8px; .p-confirm-popup:after {
margin-left: -8px; border-width: 8px;
} margin-left: -8px;
}
.p-confirm-popup:before {
border-width: 10px; .p-confirm-popup:before {
margin-left: -10px; border-width: 10px;
} margin-left: -10px;
}
.p-confirm-popup-flipped:after,
.p-confirm-popup-flipped:before { .p-confirm-popup-flipped:after,
bottom: auto; .p-confirm-popup-flipped:before {
top: 100%; bottom: auto;
} top: 100%;
}
.p-confirm-popup.p-confirm-popup-flipped:after {
border-bottom-color: transparent; .p-confirm-popup.p-confirm-popup-flipped:after {
} border-bottom-color: transparent;
}
.p-confirm-popup.p-confirm-popup-flipped:before {
border-bottom-color: transparent; .p-confirm-popup.p-confirm-popup-flipped:before {
} border-bottom-color: transparent;
}
.p-confirm-popup .p-confirm-popup-content {
display: flex; .p-confirm-popup .p-confirm-popup-content {
align-items: center; display: flex;
align-items: center;
}
} }
`; `;

View File

@ -3,45 +3,47 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-contextmenu ul { @layer primevue {
margin: 0; .p-contextmenu ul {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-contextmenu .p-submenu-list {
position: absolute; .p-contextmenu .p-submenu-list {
min-width: 100%; position: absolute;
z-index: 1; min-width: 100%;
} z-index: 1;
}
.p-contextmenu .p-menuitem-link {
cursor: pointer; .p-contextmenu .p-menuitem-link {
display: flex; cursor: pointer;
align-items: center; display: flex;
text-decoration: none; align-items: center;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-contextmenu .p-menuitem-text {
line-height: 1; .p-contextmenu .p-menuitem-text {
} line-height: 1;
}
.p-contextmenu .p-menuitem {
position: relative; .p-contextmenu .p-menuitem {
} position: relative;
}
.p-contextmenu .p-menuitem-link .p-submenu-icon {
margin-left: auto; .p-contextmenu .p-menuitem-link .p-submenu-icon {
} margin-left: auto;
}
.p-contextmenu-enter-from {
opacity: 0; .p-contextmenu-enter-from {
} opacity: 0;
}
.p-contextmenu-enter-active {
transition: opacity 250ms; .p-contextmenu-enter-active {
transition: opacity 250ms;
}
} }
`; `;

View File

@ -3,239 +3,241 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-datatable { @layer primevue {
position: relative; .p-datatable {
} position: relative;
}
.p-datatable-table {
border-spacing: 0px; .p-datatable-table {
width: 100%; border-spacing: 0px;
} width: 100%;
}
.p-datatable .p-sortable-column {
cursor: pointer; .p-datatable .p-sortable-column {
user-select: none; cursor: pointer;
} user-select: none;
}
.p-datatable .p-sortable-column .p-column-title,
.p-datatable .p-sortable-column .p-sortable-column-icon, .p-datatable .p-sortable-column .p-column-title,
.p-datatable .p-sortable-column .p-sortable-column-badge { .p-datatable .p-sortable-column .p-sortable-column-icon,
vertical-align: middle; .p-datatable .p-sortable-column .p-sortable-column-badge {
} vertical-align: middle;
}
.p-datatable .p-sortable-column .p-sortable-column-badge {
display: inline-flex; .p-datatable .p-sortable-column .p-sortable-column-badge {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-datatable-hoverable-rows .p-selectable-row {
cursor: pointer; .p-datatable-hoverable-rows .p-selectable-row {
} cursor: pointer;
}
/* Scrollable */
.p-datatable-scrollable > .p-datatable-wrapper { /* Scrollable */
position: relative; .p-datatable-scrollable > .p-datatable-wrapper {
} position: relative;
}
.p-datatable-scrollable-table > .p-datatable-thead {
top: 0; .p-datatable-scrollable-table > .p-datatable-thead {
z-index: 1; top: 0;
} z-index: 1;
}
.p-datatable-scrollable-table > .p-datatable-frozen-tbody {
position: sticky; .p-datatable-scrollable-table > .p-datatable-frozen-tbody {
z-index: 1; position: sticky;
} z-index: 1;
}
.p-datatable-scrollable-table > .p-datatable-tfoot {
bottom: 0; .p-datatable-scrollable-table > .p-datatable-tfoot {
z-index: 1; bottom: 0;
} z-index: 1;
}
.p-datatable-scrollable .p-frozen-column {
position: sticky; .p-datatable-scrollable .p-frozen-column {
background: inherit; position: sticky;
} background: inherit;
}
.p-datatable-scrollable th.p-frozen-column {
z-index: 1; .p-datatable-scrollable th.p-frozen-column {
} z-index: 1;
}
.p-datatable-flex-scrollable {
display: flex; .p-datatable-flex-scrollable {
flex-direction: column; display: flex;
height: 100%; flex-direction: column;
} height: 100%;
}
.p-datatable-flex-scrollable > .p-datatable-wrapper {
display: flex; .p-datatable-flex-scrollable > .p-datatable-wrapper {
flex-direction: column; display: flex;
flex: 1; flex-direction: column;
height: 100%; flex: 1;
} height: 100%;
}
.p-datatable-scrollable-table > .p-datatable-tbody > .p-rowgroup-header {
position: sticky; .p-datatable-scrollable-table > .p-datatable-tbody > .p-rowgroup-header {
z-index: 1; position: sticky;
} z-index: 1;
}
/* Resizable */
.p-datatable-resizable-table > .p-datatable-thead > tr > th, /* Resizable */
.p-datatable-resizable-table > .p-datatable-tfoot > tr > td, .p-datatable-resizable-table > .p-datatable-thead > tr > th,
.p-datatable-resizable-table > .p-datatable-tbody > tr > td { .p-datatable-resizable-table > .p-datatable-tfoot > tr > td,
overflow: hidden; .p-datatable-resizable-table > .p-datatable-tbody > tr > td {
white-space: nowrap; overflow: hidden;
} white-space: nowrap;
}
.p-datatable-resizable-table > .p-datatable-thead > tr > th.p-resizable-column:not(.p-frozen-column) {
background-clip: padding-box; .p-datatable-resizable-table > .p-datatable-thead > tr > th.p-resizable-column:not(.p-frozen-column) {
position: relative; background-clip: padding-box;
} position: relative;
}
.p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-resizable-column:last-child .p-column-resizer {
display: none; .p-datatable-resizable-table-fit > .p-datatable-thead > tr > th.p-resizable-column:last-child .p-column-resizer {
} display: none;
}
.p-datatable .p-column-resizer {
display: block; .p-datatable .p-column-resizer {
position: absolute !important; display: block;
top: 0; position: absolute !important;
right: 0; top: 0;
margin: 0; right: 0;
width: 0.5rem; margin: 0;
height: 100%; width: 0.5rem;
padding: 0px; height: 100%;
cursor: col-resize; padding: 0px;
border: 1px solid transparent; cursor: col-resize;
} border: 1px solid transparent;
}
.p-datatable .p-column-header-content {
display: flex; .p-datatable .p-column-header-content {
align-items: center; display: flex;
} align-items: center;
}
.p-datatable .p-column-resizer-helper {
width: 1px; .p-datatable .p-column-resizer-helper {
position: absolute; width: 1px;
z-index: 10; position: absolute;
display: none; z-index: 10;
} display: none;
}
.p-datatable .p-row-editor-init,
.p-datatable .p-row-editor-save, .p-datatable .p-row-editor-init,
.p-datatable .p-row-editor-cancel { .p-datatable .p-row-editor-save,
display: inline-flex; .p-datatable .p-row-editor-cancel {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
} position: relative;
}
/* Expand */
.p-datatable .p-row-toggler { /* Expand */
display: inline-flex; .p-datatable .p-row-toggler {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
} position: relative;
}
/* Reorder */
.p-datatable-reorder-indicator-up, /* Reorder */
.p-datatable-reorder-indicator-down { .p-datatable-reorder-indicator-up,
position: absolute; .p-datatable-reorder-indicator-down {
display: none; position: absolute;
} display: none;
}
.p-reorderable-column,
.p-datatable-reorderablerow-handle { .p-reorderable-column,
cursor: move; .p-datatable-reorderablerow-handle {
} cursor: move;
}
/* Loader */
.p-datatable .p-datatable-loading-overlay { /* Loader */
position: absolute; .p-datatable .p-datatable-loading-overlay {
display: flex; position: absolute;
align-items: center; display: flex;
justify-content: center; align-items: center;
z-index: 2; justify-content: center;
} z-index: 2;
}
/* Filter */
.p-column-filter-row { /* Filter */
display: flex; .p-column-filter-row {
align-items: center; display: flex;
width: 100%; align-items: center;
} width: 100%;
}
.p-column-filter-menu {
display: inline-flex; .p-column-filter-menu {
margin-left: auto; display: inline-flex;
} margin-left: auto;
}
.p-column-filter-row .p-column-filter-element {
flex: 1 1 auto; .p-column-filter-row .p-column-filter-element {
width: 1%; flex: 1 1 auto;
} width: 1%;
}
.p-column-filter-menu-button,
.p-column-filter-clear-button { .p-column-filter-menu-button,
display: inline-flex; .p-column-filter-clear-button {
justify-content: center; display: inline-flex;
align-items: center; justify-content: center;
cursor: pointer; align-items: center;
text-decoration: none; cursor: pointer;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-column-filter-row-items {
margin: 0; .p-column-filter-row-items {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-column-filter-row-item {
cursor: pointer; .p-column-filter-row-item {
} cursor: pointer;
}
.p-column-filter-add-button,
.p-column-filter-remove-button { .p-column-filter-add-button,
justify-content: center; .p-column-filter-remove-button {
} justify-content: center;
}
.p-column-filter-add-button .p-button-label,
.p-column-filter-remove-button .p-button-label { .p-column-filter-add-button .p-button-label,
flex-grow: 0; .p-column-filter-remove-button .p-button-label {
} flex-grow: 0;
}
.p-column-filter-buttonbar {
display: flex; .p-column-filter-buttonbar {
align-items: center; display: flex;
justify-content: space-between; align-items: center;
} justify-content: space-between;
}
.p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {
width: auto; .p-column-filter-buttonbar .p-button:not(.p-button-icon-only) {
} width: auto;
}
/* Responsive */
.p-datatable .p-datatable-tbody > tr > td > .p-column-title { /* Responsive */
display: none; .p-datatable .p-datatable-tbody > tr > td > .p-column-title {
} display: none;
}
/* VirtualScroller */
.p-datatable-virtualscroller-spacer { /* VirtualScroller */
display: flex; .p-datatable-virtualscroller-spacer {
} display: flex;
}
.p-datatable .p-virtualscroller .p-virtualscroller-loading {
transform: none !important; .p-datatable .p-virtualscroller .p-virtualscroller-loading {
min-height: 0; transform: none !important;
position: sticky; min-height: 0;
top: 0; position: sticky;
left: 0; top: 0;
left: 0;
}
} }
`; `;

View File

@ -3,136 +3,138 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-dialog-mask.p-component-overlay { @layer primevue {
pointer-events: auto; .p-dialog-mask.p-component-overlay {
} pointer-events: auto;
}
.p-dialog {
max-height: 90%; .p-dialog {
transform: scale(1); max-height: 90%;
} transform: scale(1);
}
.p-dialog-content {
overflow-y: auto; .p-dialog-content {
} overflow-y: auto;
}
.p-dialog-header {
display: flex; .p-dialog-header {
align-items: center; display: flex;
justify-content: space-between; align-items: center;
flex-shrink: 0; justify-content: space-between;
} flex-shrink: 0;
}
.p-dialog-footer {
flex-shrink: 0; .p-dialog-footer {
} flex-shrink: 0;
}
.p-dialog .p-dialog-header-icons {
display: flex; .p-dialog .p-dialog-header-icons {
align-items: center; display: flex;
} align-items: center;
}
.p-dialog .p-dialog-header-icon {
display: flex; .p-dialog .p-dialog-header-icon {
align-items: center; display: flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
} position: relative;
}
/* Fluid */
.p-fluid .p-dialog-footer .p-button { /* Fluid */
width: auto; .p-fluid .p-dialog-footer .p-button {
} width: auto;
}
/* Animation */
/* Center */ /* Animation */
.p-dialog-enter-active { /* Center */
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); .p-dialog-enter-active {
} transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
.p-dialog-leave-active { }
transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); .p-dialog-leave-active {
} transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
.p-dialog-enter-from, }
.p-dialog-leave-to { .p-dialog-enter-from,
opacity: 0; .p-dialog-leave-to {
transform: scale(0.7); opacity: 0;
} transform: scale(0.7);
}
/* Top, Bottom, Left, Right, Top* and Bottom* */
.p-dialog-top .p-dialog, /* Top, Bottom, Left, Right, Top* and Bottom* */
.p-dialog-bottom .p-dialog, .p-dialog-top .p-dialog,
.p-dialog-left .p-dialog, .p-dialog-bottom .p-dialog,
.p-dialog-right .p-dialog, .p-dialog-left .p-dialog,
.p-dialog-topleft .p-dialog, .p-dialog-right .p-dialog,
.p-dialog-topright .p-dialog, .p-dialog-topleft .p-dialog,
.p-dialog-bottomleft .p-dialog, .p-dialog-topright .p-dialog,
.p-dialog-bottomright .p-dialog { .p-dialog-bottomleft .p-dialog,
margin: 0.75rem; .p-dialog-bottomright .p-dialog {
transform: translate3d(0px, 0px, 0px); margin: 0.75rem;
} transform: translate3d(0px, 0px, 0px);
.p-dialog-top .p-dialog-enter-active, }
.p-dialog-top .p-dialog-leave-active, .p-dialog-top .p-dialog-enter-active,
.p-dialog-bottom .p-dialog-enter-active, .p-dialog-top .p-dialog-leave-active,
.p-dialog-bottom .p-dialog-leave-active, .p-dialog-bottom .p-dialog-enter-active,
.p-dialog-left .p-dialog-enter-active, .p-dialog-bottom .p-dialog-leave-active,
.p-dialog-left .p-dialog-leave-active, .p-dialog-left .p-dialog-enter-active,
.p-dialog-right .p-dialog-enter-active, .p-dialog-left .p-dialog-leave-active,
.p-dialog-right .p-dialog-leave-active, .p-dialog-right .p-dialog-enter-active,
.p-dialog-topleft .p-dialog-enter-active, .p-dialog-right .p-dialog-leave-active,
.p-dialog-topleft .p-dialog-leave-active, .p-dialog-topleft .p-dialog-enter-active,
.p-dialog-topright .p-dialog-enter-active, .p-dialog-topleft .p-dialog-leave-active,
.p-dialog-topright .p-dialog-leave-active, .p-dialog-topright .p-dialog-enter-active,
.p-dialog-bottomleft .p-dialog-enter-active, .p-dialog-topright .p-dialog-leave-active,
.p-dialog-bottomleft .p-dialog-leave-active, .p-dialog-bottomleft .p-dialog-enter-active,
.p-dialog-bottomright .p-dialog-enter-active, .p-dialog-bottomleft .p-dialog-leave-active,
.p-dialog-bottomright .p-dialog-leave-active { .p-dialog-bottomright .p-dialog-enter-active,
transition: all 0.3s ease-out; .p-dialog-bottomright .p-dialog-leave-active {
} transition: all 0.3s ease-out;
.p-dialog-top .p-dialog-enter-from, }
.p-dialog-top .p-dialog-leave-to { .p-dialog-top .p-dialog-enter-from,
transform: translate3d(0px, -100%, 0px); .p-dialog-top .p-dialog-leave-to {
} transform: translate3d(0px, -100%, 0px);
.p-dialog-bottom .p-dialog-enter-from, }
.p-dialog-bottom .p-dialog-leave-to { .p-dialog-bottom .p-dialog-enter-from,
transform: translate3d(0px, 100%, 0px); .p-dialog-bottom .p-dialog-leave-to {
} transform: translate3d(0px, 100%, 0px);
.p-dialog-left .p-dialog-enter-from, }
.p-dialog-left .p-dialog-leave-to, .p-dialog-left .p-dialog-enter-from,
.p-dialog-topleft .p-dialog-enter-from, .p-dialog-left .p-dialog-leave-to,
.p-dialog-topleft .p-dialog-leave-to, .p-dialog-topleft .p-dialog-enter-from,
.p-dialog-bottomleft .p-dialog-enter-from, .p-dialog-topleft .p-dialog-leave-to,
.p-dialog-bottomleft .p-dialog-leave-to { .p-dialog-bottomleft .p-dialog-enter-from,
transform: translate3d(-100%, 0px, 0px); .p-dialog-bottomleft .p-dialog-leave-to {
} transform: translate3d(-100%, 0px, 0px);
.p-dialog-right .p-dialog-enter-from, }
.p-dialog-right .p-dialog-leave-to, .p-dialog-right .p-dialog-enter-from,
.p-dialog-topright .p-dialog-enter-from, .p-dialog-right .p-dialog-leave-to,
.p-dialog-topright .p-dialog-leave-to, .p-dialog-topright .p-dialog-enter-from,
.p-dialog-bottomright .p-dialog-enter-from, .p-dialog-topright .p-dialog-leave-to,
.p-dialog-bottomright .p-dialog-leave-to { .p-dialog-bottomright .p-dialog-enter-from,
transform: translate3d(100%, 0px, 0px); .p-dialog-bottomright .p-dialog-leave-to {
} transform: translate3d(100%, 0px, 0px);
}
/* Maximize */
.p-dialog-maximized { /* Maximize */
-webkit-transition: none; .p-dialog-maximized {
transition: none; -webkit-transition: none;
transform: none; transition: none;
width: 100vw !important; transform: none;
height: 100vh !important; width: 100vw !important;
top: 0px !important; height: 100vh !important;
left: 0px !important; top: 0px !important;
max-height: 100%; left: 0px !important;
height: 100%; max-height: 100%;
} height: 100%;
.p-dialog-maximized .p-dialog-content { }
flex-grow: 1; .p-dialog-maximized .p-dialog-content {
} flex-grow: 1;
}
.p-confirm-dialog .p-dialog-content {
display: flex; .p-confirm-dialog .p-dialog-content {
align-items: center; display: flex;
align-items: center;
}
} }
`; `;

View File

@ -3,65 +3,67 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-divider-horizontal { @layer primevue {
display: flex; .p-divider-horizontal {
width: 100%; display: flex;
position: relative; width: 100%;
align-items: center; position: relative;
} align-items: center;
}
.p-divider-horizontal:before {
position: absolute; .p-divider-horizontal:before {
display: block; position: absolute;
top: 50%; display: block;
left: 0; top: 50%;
width: 100%; left: 0;
content: ''; width: 100%;
} content: '';
}
.p-divider-content {
z-index: 1; .p-divider-content {
} z-index: 1;
}
.p-divider-vertical {
min-height: 100%; .p-divider-vertical {
margin: 0 1rem; min-height: 100%;
display: flex; margin: 0 1rem;
position: relative; display: flex;
justify-content: center; position: relative;
} justify-content: center;
}
.p-divider-vertical:before {
position: absolute; .p-divider-vertical:before {
display: block; position: absolute;
top: 0; display: block;
left: 50%; top: 0;
height: 100%; left: 50%;
content: ''; height: 100%;
} content: '';
}
.p-divider-solid.p-divider-horizontal:before {
border-top-style: solid; .p-divider-solid.p-divider-horizontal:before {
} border-top-style: solid;
}
.p-divider-solid.p-divider-vertical:before {
border-left-style: solid; .p-divider-solid.p-divider-vertical:before {
} border-left-style: solid;
}
.p-divider-dashed.p-divider-horizontal:before {
border-top-style: dashed; .p-divider-dashed.p-divider-horizontal:before {
} border-top-style: dashed;
}
.p-divider-dashed.p-divider-vertical:before {
border-left-style: dashed; .p-divider-dashed.p-divider-vertical:before {
} border-left-style: dashed;
}
.p-divider-dotted.p-divider-horizontal:before {
border-top-style: dotted; .p-divider-dotted.p-divider-horizontal:before {
} border-top-style: dotted;
}
.p-divider-dotted.p-divider-vertical:before {
border-left-style: dotted; .p-divider-dotted.p-divider-vertical:before {
border-left-style: dotted;
}
} }
`; `;

View File

@ -3,110 +3,112 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-dock { @layer primevue {
position: absolute; .p-dock {
z-index: 1; position: absolute;
display: flex; z-index: 1;
justify-content: center; display: flex;
align-items: center; justify-content: center;
pointer-events: none; align-items: center;
} pointer-events: none;
}
.p-dock-list-container {
display: flex; .p-dock-list-container {
pointer-events: auto; display: flex;
} pointer-events: auto;
}
.p-dock-list {
margin: 0; .p-dock-list {
padding: 0; margin: 0;
list-style: none; padding: 0;
display: flex; list-style: none;
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-dock-item {
transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); .p-dock-item {
will-change: transform; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
} will-change: transform;
}
.p-dock-link {
display: flex; .p-dock-link {
flex-direction: column; display: flex;
align-items: center; flex-direction: column;
justify-content: center; align-items: center;
position: relative; justify-content: center;
overflow: hidden; position: relative;
cursor: default; overflow: hidden;
} cursor: default;
}
.p-dock-item-second-prev,
.p-dock-item-second-next { .p-dock-item-second-prev,
transform: scale(1.2); .p-dock-item-second-next {
} transform: scale(1.2);
}
.p-dock-item-prev,
.p-dock-item-next { .p-dock-item-prev,
transform: scale(1.4); .p-dock-item-next {
} transform: scale(1.4);
}
.p-dock-item-current {
transform: scale(1.6); .p-dock-item-current {
z-index: 1; transform: scale(1.6);
} z-index: 1;
}
/* Position */
/* top */ /* Position */
.p-dock-top { /* top */
left: 0; .p-dock-top {
top: 0; left: 0;
width: 100%; top: 0;
} width: 100%;
}
.p-dock-top .p-dock-item {
transform-origin: center top; .p-dock-top .p-dock-item {
} transform-origin: center top;
}
/* bottom */
.p-dock-bottom { /* bottom */
left: 0; .p-dock-bottom {
bottom: 0; left: 0;
width: 100%; bottom: 0;
} width: 100%;
}
.p-dock-bottom .p-dock-item {
transform-origin: center bottom; .p-dock-bottom .p-dock-item {
} transform-origin: center bottom;
}
/* right */
.p-dock-right { /* right */
right: 0; .p-dock-right {
top: 0; right: 0;
height: 100%; top: 0;
} height: 100%;
}
.p-dock-right .p-dock-item {
transform-origin: center right; .p-dock-right .p-dock-item {
} transform-origin: center right;
}
.p-dock-right .p-dock-list {
flex-direction: column; .p-dock-right .p-dock-list {
} flex-direction: column;
}
/* left */
.p-dock-left { /* left */
left: 0; .p-dock-left {
top: 0; left: 0;
height: 100%; top: 0;
} height: 100%;
}
.p-dock-left .p-dock-item {
transform-origin: center left; .p-dock-left .p-dock-item {
} transform-origin: center left;
}
.p-dock-left .p-dock-list {
flex-direction: column; .p-dock-left .p-dock-list {
flex-direction: column;
}
} }
`; `;

View File

@ -3,97 +3,99 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-dropdown { @layer primevue {
display: inline-flex; .p-dropdown {
cursor: pointer; display: inline-flex;
position: relative; cursor: pointer;
user-select: none; position: relative;
} user-select: none;
}
.p-dropdown-clear-icon {
position: absolute; .p-dropdown-clear-icon {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
.p-dropdown-trigger {
display: flex; .p-dropdown-trigger {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
} flex-shrink: 0;
}
.p-dropdown-label {
display: block; .p-dropdown-label {
white-space: nowrap; display: block;
overflow: hidden; white-space: nowrap;
flex: 1 1 auto; overflow: hidden;
width: 1%; flex: 1 1 auto;
text-overflow: ellipsis; width: 1%;
cursor: pointer; text-overflow: ellipsis;
} cursor: pointer;
}
.p-dropdown-label-empty {
overflow: hidden; .p-dropdown-label-empty {
opacity: 0; overflow: hidden;
} opacity: 0;
}
input.p-dropdown-label {
cursor: default; input.p-dropdown-label {
} cursor: default;
}
.p-dropdown .p-dropdown-panel {
min-width: 100%; .p-dropdown .p-dropdown-panel {
} min-width: 100%;
}
.p-dropdown-panel {
position: absolute; .p-dropdown-panel {
top: 0; position: absolute;
left: 0; top: 0;
} left: 0;
}
.p-dropdown-items-wrapper {
overflow: auto; .p-dropdown-items-wrapper {
} overflow: auto;
}
.p-dropdown-item {
cursor: pointer; .p-dropdown-item {
font-weight: normal; cursor: pointer;
white-space: nowrap; font-weight: normal;
position: relative; white-space: nowrap;
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-dropdown-item-group {
cursor: auto; .p-dropdown-item-group {
} cursor: auto;
}
.p-dropdown-items {
margin: 0; .p-dropdown-items {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
} list-style-type: none;
}
.p-dropdown-filter {
width: 100%; .p-dropdown-filter {
} width: 100%;
}
.p-dropdown-filter-container {
position: relative; .p-dropdown-filter-container {
} position: relative;
}
.p-dropdown-filter-icon {
position: absolute; .p-dropdown-filter-icon {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
.p-fluid .p-dropdown {
display: flex; .p-fluid .p-dropdown {
} display: flex;
}
.p-fluid .p-dropdown .p-dropdown-label {
width: 1%; .p-fluid .p-dropdown .p-dropdown-label {
width: 1%;
}
} }
`; `;

View File

@ -3,23 +3,25 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-fieldset-legend > a, @layer primevue {
.p-fieldset-legend > span { .p-fieldset-legend > a,
display: flex; .p-fieldset-legend > span {
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-fieldset-toggleable .p-fieldset-legend a {
cursor: pointer; .p-fieldset-toggleable .p-fieldset-legend a {
user-select: none; cursor: pointer;
overflow: hidden; user-select: none;
position: relative; overflow: hidden;
text-decoration: none; position: relative;
} text-decoration: none;
}
.p-fieldset-legend-text {
line-height: 1; .p-fieldset-legend-text {
line-height: 1;
}
} }
`; `;

View File

@ -3,48 +3,50 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-fileupload-content { @layer primevue {
position: relative; .p-fileupload-content {
} position: relative;
}
.p-fileupload-content .p-progressbar {
width: 100%; .p-fileupload-content .p-progressbar {
position: absolute; width: 100%;
top: 0; position: absolute;
left: 0; top: 0;
} left: 0;
}
.p-button.p-fileupload-choose {
position: relative; .p-button.p-fileupload-choose {
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-fileupload-buttonbar {
display: flex; .p-fileupload-buttonbar {
flex-wrap: wrap; display: flex;
} flex-wrap: wrap;
}
.p-fileupload > input[type='file'],
.p-fileupload-basic input[type='file'] { .p-fileupload > input[type='file'],
display: none; .p-fileupload-basic input[type='file'] {
} display: none;
}
.p-fluid .p-fileupload .p-button {
width: auto; .p-fluid .p-fileupload .p-button {
} width: auto;
}
.p-fileupload-file {
display: flex; .p-fileupload-file {
flex-wrap: wrap; display: flex;
align-items: center; flex-wrap: wrap;
} align-items: center;
}
.p-fileupload-file-thumbnail {
flex-shrink: 0; .p-fileupload-file-thumbnail {
} flex-shrink: 0;
}
.p-fileupload-file-actions {
margin-left: auto; .p-fileupload-file-actions {
margin-left: auto;
}
} }
`; `;

View File

@ -3,287 +3,289 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-galleria-content { @layer primevue {
display: flex; .p-galleria-content {
flex-direction: column; display: flex;
} flex-direction: column;
}
.p-galleria-item-wrapper {
display: flex; .p-galleria-item-wrapper {
flex-direction: column; display: flex;
position: relative; flex-direction: column;
} position: relative;
}
.p-galleria-item-container {
position: relative; .p-galleria-item-container {
display: flex; position: relative;
height: 100%; display: flex;
} height: 100%;
}
.p-galleria-item-nav {
position: absolute; .p-galleria-item-nav {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
display: inline-flex; margin-top: -0.5rem;
justify-content: center; display: inline-flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
} overflow: hidden;
}
.p-galleria-item-prev {
left: 0; .p-galleria-item-prev {
border-top-left-radius: 0; left: 0;
border-bottom-left-radius: 0; border-top-left-radius: 0;
} border-bottom-left-radius: 0;
}
.p-galleria-item-next {
right: 0; .p-galleria-item-next {
border-top-right-radius: 0; right: 0;
border-bottom-right-radius: 0; border-top-right-radius: 0;
} border-bottom-right-radius: 0;
}
.p-galleria-item {
display: flex; .p-galleria-item {
justify-content: center; display: flex;
align-items: center; justify-content: center;
height: 100%; align-items: center;
width: 100%; height: 100%;
} width: 100%;
}
.p-galleria-item-nav-onhover .p-galleria-item-nav {
pointer-events: none; .p-galleria-item-nav-onhover .p-galleria-item-nav {
opacity: 0; pointer-events: none;
transition: opacity 0.2s ease-in-out; opacity: 0;
} transition: opacity 0.2s ease-in-out;
}
.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav {
pointer-events: all; .p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav {
opacity: 1; pointer-events: all;
} opacity: 1;
}
.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {
pointer-events: none; .p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {
} pointer-events: none;
}
.p-galleria-caption {
position: absolute; .p-galleria-caption {
bottom: 0; position: absolute;
left: 0; bottom: 0;
width: 100%; left: 0;
} width: 100%;
}
/* Thumbnails */
.p-galleria-thumbnail-wrapper { /* Thumbnails */
display: flex; .p-galleria-thumbnail-wrapper {
flex-direction: column; display: flex;
overflow: auto; flex-direction: column;
flex-shrink: 0; overflow: auto;
} flex-shrink: 0;
}
.p-galleria-thumbnail-prev,
.p-galleria-thumbnail-next { .p-galleria-thumbnail-prev,
align-self: center; .p-galleria-thumbnail-next {
flex: 0 0 auto; align-self: center;
display: flex; flex: 0 0 auto;
justify-content: center; display: flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
position: relative; overflow: hidden;
} position: relative;
}
.p-galleria-thumbnail-prev span,
.p-galleria-thumbnail-next span { .p-galleria-thumbnail-prev span,
display: flex; .p-galleria-thumbnail-next span {
justify-content: center; display: flex;
align-items: center; justify-content: center;
} align-items: center;
}
.p-galleria-thumbnail-container {
display: flex; .p-galleria-thumbnail-container {
flex-direction: row; display: flex;
} flex-direction: row;
}
.p-galleria-thumbnail-items-container {
overflow: hidden; .p-galleria-thumbnail-items-container {
width: 100%; overflow: hidden;
} width: 100%;
}
.p-galleria-thumbnail-items {
display: flex; .p-galleria-thumbnail-items {
} display: flex;
}
.p-galleria-thumbnail-item {
overflow: auto; .p-galleria-thumbnail-item {
display: flex; overflow: auto;
align-items: center; display: flex;
justify-content: center; align-items: center;
cursor: pointer; justify-content: center;
opacity: 0.5; cursor: pointer;
} opacity: 0.5;
}
.p-galleria-thumbnail-item:hover {
opacity: 1; .p-galleria-thumbnail-item:hover {
transition: opacity 0.3s; opacity: 1;
} transition: opacity 0.3s;
}
.p-galleria-thumbnail-item-current {
opacity: 1; .p-galleria-thumbnail-item-current {
} opacity: 1;
}
/* Positions */
/* Thumbnails */ /* Positions */
.p-galleria-thumbnails-left .p-galleria-content, /* Thumbnails */
.p-galleria-thumbnails-right .p-galleria-content { .p-galleria-thumbnails-left .p-galleria-content,
flex-direction: row; .p-galleria-thumbnails-right .p-galleria-content {
} flex-direction: row;
}
.p-galleria-thumbnails-left .p-galleria-item-wrapper,
.p-galleria-thumbnails-right .p-galleria-item-wrapper { .p-galleria-thumbnails-left .p-galleria-item-wrapper,
flex-direction: row; .p-galleria-thumbnails-right .p-galleria-item-wrapper {
} flex-direction: row;
}
.p-galleria-thumbnails-left .p-galleria-item-wrapper,
.p-galleria-thumbnails-top .p-galleria-item-wrapper { .p-galleria-thumbnails-left .p-galleria-item-wrapper,
order: 2; .p-galleria-thumbnails-top .p-galleria-item-wrapper {
} order: 2;
}
.p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,
.p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper { .p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,
order: 1; .p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper {
} order: 1;
}
.p-galleria-thumbnails-left .p-galleria-thumbnail-container,
.p-galleria-thumbnails-right .p-galleria-thumbnail-container { .p-galleria-thumbnails-left .p-galleria-thumbnail-container,
flex-direction: column; .p-galleria-thumbnails-right .p-galleria-thumbnail-container {
flex-grow: 1; flex-direction: column;
} flex-grow: 1;
}
.p-galleria-thumbnails-left .p-galleria-thumbnail-items,
.p-galleria-thumbnails-right .p-galleria-thumbnail-items { .p-galleria-thumbnails-left .p-galleria-thumbnail-items,
flex-direction: column; .p-galleria-thumbnails-right .p-galleria-thumbnail-items {
height: 100%; flex-direction: column;
} height: 100%;
}
/* Indicators */
.p-galleria-indicators { /* Indicators */
display: flex; .p-galleria-indicators {
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-galleria-indicator > button {
display: inline-flex; .p-galleria-indicator > button {
align-items: center; display: inline-flex;
} align-items: center;
}
.p-galleria-indicators-left .p-galleria-item-wrapper,
.p-galleria-indicators-right .p-galleria-item-wrapper { .p-galleria-indicators-left .p-galleria-item-wrapper,
flex-direction: row; .p-galleria-indicators-right .p-galleria-item-wrapper {
align-items: center; flex-direction: row;
} align-items: center;
}
.p-galleria-indicators-left .p-galleria-item-container,
.p-galleria-indicators-top .p-galleria-item-container { .p-galleria-indicators-left .p-galleria-item-container,
order: 2; .p-galleria-indicators-top .p-galleria-item-container {
} order: 2;
}
.p-galleria-indicators-left .p-galleria-indicators,
.p-galleria-indicators-top .p-galleria-indicators { .p-galleria-indicators-left .p-galleria-indicators,
order: 1; .p-galleria-indicators-top .p-galleria-indicators {
} order: 1;
}
.p-galleria-indicators-left .p-galleria-indicators,
.p-galleria-indicators-right .p-galleria-indicators { .p-galleria-indicators-left .p-galleria-indicators,
flex-direction: column; .p-galleria-indicators-right .p-galleria-indicators {
} flex-direction: column;
}
.p-galleria-indicator-onitem .p-galleria-indicators {
position: absolute; .p-galleria-indicator-onitem .p-galleria-indicators {
display: flex; position: absolute;
} display: flex;
}
.p-galleria-indicator-onitem.p-galleria-indicators-top .p-galleria-indicators {
top: 0; .p-galleria-indicator-onitem.p-galleria-indicators-top .p-galleria-indicators {
left: 0; top: 0;
width: 100%; left: 0;
align-items: flex-start; width: 100%;
} align-items: flex-start;
}
.p-galleria-indicator-onitem.p-galleria-indicators-right .p-galleria-indicators {
right: 0; .p-galleria-indicator-onitem.p-galleria-indicators-right .p-galleria-indicators {
top: 0; right: 0;
height: 100%; top: 0;
align-items: flex-end; height: 100%;
} align-items: flex-end;
}
.p-galleria-indicator-onitem.p-galleria-indicators-bottom .p-galleria-indicators {
bottom: 0; .p-galleria-indicator-onitem.p-galleria-indicators-bottom .p-galleria-indicators {
left: 0; bottom: 0;
width: 100%; left: 0;
align-items: flex-end; width: 100%;
} align-items: flex-end;
}
.p-galleria-indicator-onitem.p-galleria-indicators-left .p-galleria-indicators {
left: 0; .p-galleria-indicator-onitem.p-galleria-indicators-left .p-galleria-indicators {
top: 0; left: 0;
height: 100%; top: 0;
align-items: flex-start; height: 100%;
} align-items: flex-start;
}
/* FullScreen */
.p-galleria-mask { /* FullScreen */
position: fixed; .p-galleria-mask {
top: 0; position: fixed;
left: 0; top: 0;
width: 100%; left: 0;
height: 100%; width: 100%;
display: flex; height: 100%;
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-galleria-close {
position: absolute; .p-galleria-close {
top: 0; position: absolute;
right: 0; top: 0;
display: flex; right: 0;
justify-content: center; display: flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
} overflow: hidden;
}
.p-galleria-mask .p-galleria-item-nav {
position: fixed; .p-galleria-mask .p-galleria-item-nav {
top: 50%; position: fixed;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
/* Animation */
.p-galleria-enter-active { /* Animation */
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); .p-galleria-enter-active {
} transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
}
.p-galleria-leave-active {
transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); .p-galleria-leave-active {
} transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
}
.p-galleria-enter-from,
.p-galleria-leave-to { .p-galleria-enter-from,
opacity: 0; .p-galleria-leave-to {
transform: scale(0.7); opacity: 0;
} transform: scale(0.7);
}
.p-galleria-enter-active .p-galleria-item-nav {
opacity: 0; .p-galleria-enter-active .p-galleria-item-nav {
} opacity: 0;
}
/* Keyboard Support */
.p-items-hidden .p-galleria-thumbnail-item { /* Keyboard Support */
visibility: hidden; .p-items-hidden .p-galleria-thumbnail-item {
} visibility: hidden;
}
.p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {
visibility: visible; .p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {
visibility: visible;
}
} }
`; `;

View File

@ -3,68 +3,70 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-image-mask { @layer primevue {
display: flex; .p-image-mask {
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-image-preview-container {
position: relative; .p-image-preview-container {
display: inline-block; position: relative;
} display: inline-block;
}
.p-image-preview-indicator {
position: absolute; .p-image-preview-indicator {
left: 0; position: absolute;
top: 0; left: 0;
width: 100%; top: 0;
height: 100%; width: 100%;
display: flex; height: 100%;
align-items: center; display: flex;
justify-content: center; align-items: center;
opacity: 0; justify-content: center;
transition: opacity 0.3s; opacity: 0;
} transition: opacity 0.3s;
}
.p-image-preview-container:hover > .p-image-preview-indicator {
opacity: 1; .p-image-preview-container:hover > .p-image-preview-indicator {
cursor: pointer; opacity: 1;
} cursor: pointer;
}
.p-image-preview-container > img {
cursor: pointer; .p-image-preview-container > img {
} cursor: pointer;
}
.p-image-toolbar {
position: absolute; .p-image-toolbar {
top: 0; position: absolute;
right: 0; top: 0;
display: flex; right: 0;
} display: flex;
}
.p-image-action.p-link {
display: flex; .p-image-action.p-link {
justify-content: center; display: flex;
align-items: center; justify-content: center;
} align-items: center;
}
.p-image-preview {
transition: transform 0.15s; .p-image-preview {
max-width: 100vw; transition: transform 0.15s;
max-height: 100vh; max-width: 100vw;
} max-height: 100vh;
}
.p-image-preview-enter-active {
transition: all 150ms cubic-bezier(0, 0, 0.2, 1); .p-image-preview-enter-active {
} transition: all 150ms cubic-bezier(0, 0, 0.2, 1);
.p-image-preview-leave-active { }
transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); .p-image-preview-leave-active {
} transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
.p-image-preview-enter-from, }
.p-image-preview-leave-to { .p-image-preview-enter-from,
opacity: 0; .p-image-preview-leave-to {
transform: scale(0.7); opacity: 0;
transform: scale(0.7);
}
} }
`; `;

View File

@ -3,20 +3,22 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-inline-message { @layer primevue {
display: inline-flex; .p-inline-message {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
vertical-align: top; justify-content: center;
} vertical-align: top;
}
.p-inline-message-icon-only .p-inline-message-text {
visibility: hidden; .p-inline-message-icon-only .p-inline-message-text {
width: 0; visibility: hidden;
} width: 0;
}
.p-fluid .p-inline-message {
display: flex; .p-fluid .p-inline-message {
display: flex;
}
} }
`; `;

View File

@ -3,22 +3,24 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-inplace .p-inplace-display { @layer primevue {
display: inline; .p-inplace .p-inplace-display {
cursor: pointer; display: inline;
} cursor: pointer;
}
.p-inplace .p-inplace-content {
display: inline; .p-inplace .p-inplace-content {
} display: inline;
}
.p-fluid .p-inplace.p-inplace-closable .p-inplace-content {
display: flex; .p-fluid .p-inplace.p-inplace-closable .p-inplace-content {
} display: flex;
}
.p-fluid .p-inplace.p-inplace-closable .p-inplace-content > .p-inputtext {
flex: 1 1 auto; .p-fluid .p-inplace.p-inplace-closable .p-inplace-content > .p-inputtext {
width: 1%; flex: 1 1 auto;
width: 1%;
}
} }
`; `;

View File

@ -3,105 +3,107 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-inputnumber { @layer primevue {
display: inline-flex; .p-inputnumber {
} display: inline-flex;
}
.p-inputnumber-button {
display: flex; .p-inputnumber-button {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex: 0 0 auto; justify-content: center;
} flex: 0 0 auto;
}
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label { .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button .p-button-label,
display: none; .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button .p-button-label {
} display: none;
}
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {
border-top-left-radius: 0; .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-up {
border-bottom-left-radius: 0; border-top-left-radius: 0;
border-bottom-right-radius: 0; border-bottom-left-radius: 0;
padding: 0; border-bottom-right-radius: 0;
} padding: 0;
}
.p-inputnumber-buttons-stacked .p-inputnumber-input {
border-top-right-radius: 0; .p-inputnumber-buttons-stacked .p-inputnumber-input {
border-bottom-right-radius: 0; border-top-right-radius: 0;
} border-bottom-right-radius: 0;
}
.p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {
border-top-left-radius: 0; .p-inputnumber-buttons-stacked .p-button.p-inputnumber-button-down {
border-top-right-radius: 0; border-top-left-radius: 0;
border-bottom-left-radius: 0; border-top-right-radius: 0;
padding: 0; border-bottom-left-radius: 0;
} padding: 0;
}
.p-inputnumber-buttons-stacked .p-inputnumber-button-group {
display: flex; .p-inputnumber-buttons-stacked .p-inputnumber-button-group {
flex-direction: column; display: flex;
} flex-direction: column;
}
.p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {
flex: 1 1 auto; .p-inputnumber-buttons-stacked .p-inputnumber-button-group .p-button.p-inputnumber-button {
} flex: 1 1 auto;
}
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {
order: 3; .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-up {
border-top-left-radius: 0; order: 3;
border-bottom-left-radius: 0; border-top-left-radius: 0;
} border-bottom-left-radius: 0;
}
.p-inputnumber-buttons-horizontal .p-inputnumber-input {
order: 2; .p-inputnumber-buttons-horizontal .p-inputnumber-input {
border-radius: 0; order: 2;
} border-radius: 0;
}
.p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {
order: 1; .p-inputnumber-buttons-horizontal .p-button.p-inputnumber-button-down {
border-top-right-radius: 0; order: 1;
border-bottom-right-radius: 0; border-top-right-radius: 0;
} border-bottom-right-radius: 0;
}
.p-inputnumber-buttons-vertical {
flex-direction: column; .p-inputnumber-buttons-vertical {
} flex-direction: column;
}
.p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {
order: 1; .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-up {
border-bottom-left-radius: 0; order: 1;
border-bottom-right-radius: 0; border-bottom-left-radius: 0;
width: 100%; border-bottom-right-radius: 0;
} width: 100%;
}
.p-inputnumber-buttons-vertical .p-inputnumber-input {
order: 2; .p-inputnumber-buttons-vertical .p-inputnumber-input {
border-radius: 0; order: 2;
text-align: center; border-radius: 0;
} text-align: center;
}
.p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {
order: 3; .p-inputnumber-buttons-vertical .p-button.p-inputnumber-button-down {
border-top-left-radius: 0; order: 3;
border-top-right-radius: 0; border-top-left-radius: 0;
width: 100%; border-top-right-radius: 0;
} width: 100%;
}
.p-inputnumber-input {
flex: 1 1 auto; .p-inputnumber-input {
} flex: 1 1 auto;
}
.p-fluid .p-inputnumber {
width: 100%; .p-fluid .p-inputnumber {
} width: 100%;
}
.p-fluid .p-inputnumber .p-inputnumber-input {
width: 1%; .p-fluid .p-inputnumber .p-inputnumber-input {
} width: 1%;
}
.p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {
width: 100%; .p-fluid .p-inputnumber-buttons-vertical .p-inputnumber-input {
width: 100%;
}
} }
`; `;

View File

@ -3,24 +3,26 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-inputswitch { @layer primevue {
display: inline-block; .p-inputswitch {
} display: inline-block;
}
.p-inputswitch-slider {
position: absolute; .p-inputswitch-slider {
cursor: pointer; position: absolute;
top: 0; cursor: pointer;
left: 0; top: 0;
right: 0; left: 0;
bottom: 0; right: 0;
border: 1px solid transparent; bottom: 0;
} border: 1px solid transparent;
}
.p-inputswitch-slider:before {
position: absolute; .p-inputswitch-slider:before {
content: ''; position: absolute;
top: 50%; content: '';
top: 50%;
}
} }
`; `;

View File

@ -8,18 +8,20 @@ const styles = `
stroke-dashoffset: 0; stroke-dashoffset: 0;
} }
} }
.p-knob-range { @layer primevue {
fill: none; .p-knob-range {
transition: stroke 0.1s ease-in; fill: none;
} transition: stroke 0.1s ease-in;
.p-knob-value { }
animation-name: dash-frame; .p-knob-value {
animation-fill-mode: forwards; animation-name: dash-frame;
fill: none; animation-fill-mode: forwards;
} fill: none;
.p-knob-text { }
font-size: 1.3rem; .p-knob-text {
text-align: center; font-size: 1.3rem;
text-align: center;
}
} }
`; `;

View File

@ -3,38 +3,40 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-listbox-list-wrapper { @layer primevue {
overflow: auto; .p-listbox-list-wrapper {
} overflow: auto;
}
.p-listbox-list {
list-style-type: none; .p-listbox-list {
margin: 0; list-style-type: none;
padding: 0; margin: 0;
} padding: 0;
}
.p-listbox-item {
cursor: pointer; .p-listbox-item {
position: relative; cursor: pointer;
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-listbox-item-group {
cursor: auto; .p-listbox-item-group {
} cursor: auto;
}
.p-listbox-filter-container {
position: relative; .p-listbox-filter-container {
} position: relative;
}
.p-listbox-filter-icon {
position: absolute; .p-listbox-filter-icon {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
.p-listbox-filter {
width: 100%; .p-listbox-filter {
width: 100%;
}
} }
`; `;

View File

@ -3,115 +3,117 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-megamenu { @layer primevue {
display: flex; .p-megamenu {
} display: flex;
}
.p-megamenu-root-list {
margin: 0; .p-megamenu-root-list {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-megamenu-root-list > .p-menuitem {
position: relative; .p-megamenu-root-list > .p-menuitem {
} position: relative;
}
.p-megamenu .p-menuitem-link {
cursor: pointer; .p-megamenu .p-menuitem-link {
display: flex; cursor: pointer;
align-items: center; display: flex;
text-decoration: none; align-items: center;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-megamenu .p-menuitem-text {
line-height: 1; .p-megamenu .p-menuitem-text {
} line-height: 1;
}
.p-megamenu-panel {
display: none; .p-megamenu-panel {
position: absolute; display: none;
width: auto; position: absolute;
z-index: 1; width: auto;
} z-index: 1;
}
.p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {
display: block; .p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {
} display: block;
}
.p-megamenu-submenu {
margin: 0; .p-megamenu-submenu {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
/* Horizontal */
.p-megamenu-horizontal { /* Horizontal */
align-items: center; .p-megamenu-horizontal {
} align-items: center;
}
.p-megamenu-horizontal .p-megamenu-root-list {
display: flex; .p-megamenu-horizontal .p-megamenu-root-list {
align-items: center; display: flex;
flex-wrap: wrap; align-items: center;
} flex-wrap: wrap;
}
.p-megamenu-horizontal .p-megamenu-end {
margin-left: auto; .p-megamenu-horizontal .p-megamenu-end {
align-self: center; margin-left: auto;
} align-self: center;
}
/* Vertical */
.p-megamenu-vertical { /* Vertical */
flex-direction: column; .p-megamenu-vertical {
} flex-direction: column;
}
.p-megamenu-vertical .p-megamenu-root-list {
flex-direction: column; .p-megamenu-vertical .p-megamenu-root-list {
} flex-direction: column;
}
.p-megamenu-vertical .p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {
left: 100%; .p-megamenu-vertical .p-megamenu-root-list > .p-menuitem-active > .p-megamenu-panel {
top: 0; left: 100%;
} top: 0;
}
.p-megamenu-vertical .p-megamenu-root-list > .p-menuitem > .p-menuitem-content > .p-menuitem-link > .p-submenu-icon {
margin-left: auto; .p-megamenu-vertical .p-megamenu-root-list > .p-menuitem > .p-menuitem-content > .p-menuitem-link > .p-submenu-icon {
} margin-left: auto;
}
.p-megamenu-grid {
display: flex; .p-megamenu-grid {
} display: flex;
}
.p-megamenu-col-2,
.p-megamenu-col-3, .p-megamenu-col-2,
.p-megamenu-col-4, .p-megamenu-col-3,
.p-megamenu-col-6, .p-megamenu-col-4,
.p-megamenu-col-12 { .p-megamenu-col-6,
flex: 0 0 auto; .p-megamenu-col-12 {
padding: 0.5rem; flex: 0 0 auto;
} padding: 0.5rem;
}
.p-megamenu-col-2 {
width: 16.6667%; .p-megamenu-col-2 {
} width: 16.6667%;
}
.p-megamenu-col-3 {
width: 25%; .p-megamenu-col-3 {
} width: 25%;
}
.p-megamenu-col-4 {
width: 33.3333%; .p-megamenu-col-4 {
} width: 33.3333%;
}
.p-megamenu-col-6 {
width: 50%; .p-megamenu-col-6 {
} width: 50%;
}
.p-megamenu-col-12 {
width: 100%; .p-megamenu-col-12 {
width: 100%;
}
} }
`; `;

View File

@ -3,23 +3,25 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-menu ul { @layer primevue {
margin: 0; .p-menu ul {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-menu .p-menuitem-link {
cursor: pointer; .p-menu .p-menuitem-link {
display: flex; cursor: pointer;
align-items: center; display: flex;
text-decoration: none; align-items: center;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-menu .p-menuitem-text {
line-height: 1; .p-menu .p-menuitem-text {
line-height: 1;
}
} }
`; `;

View File

@ -3,76 +3,78 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-menubar { @layer primevue {
display: flex; .p-menubar {
align-items: center; display: flex;
} align-items: center;
}
.p-menubar ul {
margin: 0; .p-menubar ul {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-menubar .p-menuitem-link {
cursor: pointer; .p-menubar .p-menuitem-link {
display: flex; cursor: pointer;
align-items: center; display: flex;
text-decoration: none; align-items: center;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-menubar .p-menuitem-text {
line-height: 1; .p-menubar .p-menuitem-text {
} line-height: 1;
}
.p-menubar .p-menuitem {
position: relative; .p-menubar .p-menuitem {
} position: relative;
}
.p-menubar-root-list {
display: flex; .p-menubar-root-list {
align-items: center; display: flex;
flex-wrap: wrap; align-items: center;
} flex-wrap: wrap;
}
.p-menubar-root-list > li ul {
display: none; .p-menubar-root-list > li ul {
z-index: 1; display: none;
} z-index: 1;
}
.p-menubar-root-list > .p-menuitem-active > .p-submenu-list {
display: block; .p-menubar-root-list > .p-menuitem-active > .p-submenu-list {
} display: block;
}
.p-menubar .p-submenu-list {
display: none; .p-menubar .p-submenu-list {
position: absolute; display: none;
z-index: 1; position: absolute;
} z-index: 1;
}
.p-menubar .p-submenu-list > .p-menuitem-active > .p-submenu-list {
display: block; .p-menubar .p-submenu-list > .p-menuitem-active > .p-submenu-list {
left: 100%; display: block;
top: 0; left: 100%;
} top: 0;
}
.p-menubar .p-submenu-list .p-menuitem .p-menuitem-content .p-menuitem-link .p-submenu-icon {
margin-left: auto; .p-menubar .p-submenu-list .p-menuitem .p-menuitem-content .p-menuitem-link .p-submenu-icon {
} margin-left: auto;
}
.p-menubar .p-menubar-end {
margin-left: auto; .p-menubar .p-menubar-end {
align-self: center; margin-left: auto;
} align-self: center;
}
.p-menubar-button {
display: none; .p-menubar-button {
cursor: pointer; display: none;
align-items: center; cursor: pointer;
justify-content: center; align-items: center;
text-decoration: none; justify-content: center;
text-decoration: none;
}
} }
`; `;

View File

@ -3,53 +3,55 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-message-wrapper { @layer primevue {
display: flex; .p-message-wrapper {
align-items: center; display: flex;
} align-items: center;
}
.p-message-icon {
flex-shrink: 0; .p-message-icon {
} flex-shrink: 0;
}
.p-message-close {
display: flex; .p-message-close {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
} flex-shrink: 0;
}
.p-message-close.p-link {
margin-left: auto; .p-message-close.p-link {
overflow: hidden; margin-left: auto;
position: relative; overflow: hidden;
} position: relative;
}
.p-message-enter-from {
opacity: 0; .p-message-enter-from {
} opacity: 0;
}
.p-message-enter-active {
transition: opacity 0.3s; .p-message-enter-active {
} transition: opacity 0.3s;
}
.p-message.p-message-leave-from {
max-height: 1000px; .p-message.p-message-leave-from {
} max-height: 1000px;
}
.p-message.p-message-leave-to {
max-height: 0; .p-message.p-message-leave-to {
opacity: 0; max-height: 0;
margin: 0 !important; opacity: 0;
} margin: 0 !important;
}
.p-message-leave-active {
overflow: hidden; .p-message-leave-active {
transition: max-height 0.3s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin 0.15s; overflow: hidden;
} transition: max-height 0.3s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin 0.15s;
}
.p-message-leave-active .p-message-close {
display: none; .p-message-leave-active .p-message-close {
display: none;
}
} }
`; `;

View File

@ -3,110 +3,112 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-multiselect { @layer primevue {
display: inline-flex; .p-multiselect {
cursor: pointer; display: inline-flex;
user-select: none; cursor: pointer;
} user-select: none;
}
.p-multiselect-trigger {
display: flex; .p-multiselect-trigger {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
} flex-shrink: 0;
}
.p-multiselect-label-container {
overflow: hidden; .p-multiselect-label-container {
flex: 1 1 auto; overflow: hidden;
cursor: pointer; flex: 1 1 auto;
} cursor: pointer;
}
.p-multiselect-label {
display: block; .p-multiselect-label {
white-space: nowrap; display: block;
cursor: pointer; white-space: nowrap;
overflow: hidden; cursor: pointer;
text-overflow: ellipsis; overflow: hidden;
} text-overflow: ellipsis;
}
.p-multiselect-label-empty {
overflow: hidden; .p-multiselect-label-empty {
visibility: hidden; overflow: hidden;
} visibility: hidden;
}
.p-multiselect-token {
cursor: default; .p-multiselect-token {
display: inline-flex; cursor: default;
align-items: center; display: inline-flex;
flex: 0 0 auto; align-items: center;
} flex: 0 0 auto;
}
.p-multiselect-token-icon {
cursor: pointer; .p-multiselect-token-icon {
} cursor: pointer;
}
.p-multiselect .p-multiselect-panel {
min-width: 100%; .p-multiselect .p-multiselect-panel {
} min-width: 100%;
}
.p-multiselect-items-wrapper {
overflow: auto; .p-multiselect-items-wrapper {
} overflow: auto;
}
.p-multiselect-items {
margin: 0; .p-multiselect-items {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
} list-style-type: none;
}
.p-multiselect-item {
cursor: pointer; .p-multiselect-item {
display: flex; cursor: pointer;
align-items: center; display: flex;
font-weight: normal; align-items: center;
white-space: nowrap; font-weight: normal;
position: relative; white-space: nowrap;
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-multiselect-item-group {
cursor: auto; .p-multiselect-item-group {
} cursor: auto;
}
.p-multiselect-header {
display: flex; .p-multiselect-header {
align-items: center; display: flex;
justify-content: space-between; align-items: center;
} justify-content: space-between;
}
.p-multiselect-filter-container {
position: relative; .p-multiselect-filter-container {
flex: 1 1 auto; position: relative;
} flex: 1 1 auto;
}
.p-multiselect-filter-icon {
position: absolute; .p-multiselect-filter-icon {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
.p-multiselect-filter-container .p-inputtext {
width: 100%; .p-multiselect-filter-container .p-inputtext {
} width: 100%;
}
.p-multiselect-close {
display: flex; .p-multiselect-close {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
overflow: hidden; flex-shrink: 0;
position: relative; overflow: hidden;
margin-left: auto; position: relative;
} margin-left: auto;
}
.p-fluid .p-multiselect {
display: flex; .p-fluid .p-multiselect {
display: flex;
}
} }
`; `;

View File

@ -3,42 +3,44 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-orderlist { @layer primevue {
display: flex; .p-orderlist {
} display: flex;
}
.p-orderlist-controls {
display: flex; .p-orderlist-controls {
flex-direction: column; display: flex;
justify-content: center; flex-direction: column;
} justify-content: center;
}
.p-orderlist-list-container {
flex: 1 1 auto; .p-orderlist-list-container {
} flex: 1 1 auto;
}
.p-orderlist-list {
list-style-type: none; .p-orderlist-list {
margin: 0; list-style-type: none;
padding: 0; margin: 0;
overflow: auto; padding: 0;
min-height: 12rem; overflow: auto;
max-height: 24rem; min-height: 12rem;
} max-height: 24rem;
}
.p-orderlist-item {
cursor: pointer; .p-orderlist-item {
overflow: hidden; cursor: pointer;
position: relative; overflow: hidden;
} position: relative;
}
.p-orderlist.p-state-disabled .p-orderlist-item,
.p-orderlist.p-state-disabled .p-button { .p-orderlist.p-state-disabled .p-orderlist-item,
cursor: default; .p-orderlist.p-state-disabled .p-button {
} cursor: default;
}
.p-orderlist.p-state-disabled .p-orderlist-list {
overflow: hidden; .p-orderlist.p-state-disabled .p-orderlist-list {
overflow: hidden;
}
} }
`; `;

View File

@ -3,57 +3,59 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-organizationchart-table { @layer primevue {
border-spacing: 0; .p-organizationchart-table {
border-collapse: separate; border-spacing: 0;
margin: 0 auto; border-collapse: separate;
} margin: 0 auto;
}
.p-organizationchart-table > tbody > tr > td {
text-align: center; .p-organizationchart-table > tbody > tr > td {
vertical-align: top; text-align: center;
padding: 0 0.75rem; vertical-align: top;
} padding: 0 0.75rem;
}
.p-organizationchart-node-content {
display: inline-block; .p-organizationchart-node-content {
position: relative; display: inline-block;
} position: relative;
}
.p-organizationchart-node-content .p-node-toggler {
position: absolute; .p-organizationchart-node-content .p-node-toggler {
bottom: -0.75rem; position: absolute;
margin-left: -0.75rem; bottom: -0.75rem;
z-index: 2; margin-left: -0.75rem;
left: 50%; z-index: 2;
user-select: none; left: 50%;
cursor: pointer; user-select: none;
width: 1.5rem; cursor: pointer;
height: 1.5rem; width: 1.5rem;
text-decoration: none; height: 1.5rem;
} text-decoration: none;
}
.p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {
position: relative; .p-organizationchart-node-content .p-node-toggler .p-node-toggler-icon {
top: 0.25rem; position: relative;
} top: 0.25rem;
}
.p-organizationchart-line-down {
margin: 0 auto; .p-organizationchart-line-down {
height: 20px; margin: 0 auto;
width: 1px; height: 20px;
} width: 1px;
}
.p-organizationchart-line-right {
border-radius: 0px; .p-organizationchart-line-right {
} border-radius: 0px;
}
.p-organizationchart-line-left {
border-radius: 0; .p-organizationchart-line-left {
} border-radius: 0;
}
.p-organizationchart-selectable-node {
cursor: pointer; .p-organizationchart-selectable-node {
cursor: pointer;
}
} }
`; `;

View File

@ -3,74 +3,76 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-overlaypanel { @layer primevue {
margin-top: 10px; .p-overlaypanel {
} margin-top: 10px;
}
.p-overlaypanel-flipped {
margin-top: 0; .p-overlaypanel-flipped {
margin-bottom: 10px; margin-top: 0;
} margin-bottom: 10px;
}
.p-overlaypanel-close {
display: flex; .p-overlaypanel-close {
justify-content: center; display: flex;
align-items: center; justify-content: center;
overflow: hidden; align-items: center;
position: relative; overflow: hidden;
} position: relative;
}
/* Animation */
.p-overlaypanel-enter-from { /* Animation */
opacity: 0; .p-overlaypanel-enter-from {
transform: scaleY(0.8); opacity: 0;
} transform: scaleY(0.8);
}
.p-overlaypanel-leave-to {
opacity: 0; .p-overlaypanel-leave-to {
} opacity: 0;
}
.p-overlaypanel-enter-active {
transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1); .p-overlaypanel-enter-active {
} transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1), opacity 0.12s cubic-bezier(0, 0, 0.2, 1);
}
.p-overlaypanel-leave-active {
transition: opacity 0.1s linear; .p-overlaypanel-leave-active {
} transition: opacity 0.1s linear;
}
.p-overlaypanel:after,
.p-overlaypanel:before { .p-overlaypanel:after,
bottom: 100%; .p-overlaypanel:before {
left: calc(var(--overlayArrowLeft, 0) + 1.25rem); bottom: 100%;
content: ' '; left: calc(var(--overlayArrowLeft, 0) + 1.25rem);
height: 0; content: ' ';
width: 0; height: 0;
position: absolute; width: 0;
pointer-events: none; position: absolute;
} pointer-events: none;
}
.p-overlaypanel:after {
border-width: 8px; .p-overlaypanel:after {
margin-left: -8px; border-width: 8px;
} margin-left: -8px;
}
.p-overlaypanel:before {
border-width: 10px; .p-overlaypanel:before {
margin-left: -10px; border-width: 10px;
} margin-left: -10px;
}
.p-overlaypanel-flipped:after,
.p-overlaypanel-flipped:before { .p-overlaypanel-flipped:after,
bottom: auto; .p-overlaypanel-flipped:before {
top: 100%; bottom: auto;
} top: 100%;
}
.p-overlaypanel.p-overlaypanel-flipped:after {
border-bottom-color: transparent; .p-overlaypanel.p-overlaypanel-flipped:after {
} border-bottom-color: transparent;
}
.p-overlaypanel.p-overlaypanel-flipped:before {
border-bottom-color: transparent; .p-overlaypanel.p-overlaypanel-flipped:before {
border-bottom-color: transparent;
}
} }
`; `;

View File

@ -3,44 +3,46 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-paginator-default { @layer primevue {
display: flex; .p-paginator-default {
} display: flex;
}
.p-paginator {
display: flex; .p-paginator {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-wrap: wrap; justify-content: center;
} flex-wrap: wrap;
}
.p-paginator-left-content {
margin-right: auto; .p-paginator-left-content {
} margin-right: auto;
}
.p-paginator-right-content {
margin-left: auto; .p-paginator-right-content {
} margin-left: auto;
}
.p-paginator-page,
.p-paginator-next, .p-paginator-page,
.p-paginator-last, .p-paginator-next,
.p-paginator-first, .p-paginator-last,
.p-paginator-prev, .p-paginator-first,
.p-paginator-current { .p-paginator-prev,
cursor: pointer; .p-paginator-current {
display: inline-flex; cursor: pointer;
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
line-height: 1; justify-content: center;
user-select: none; line-height: 1;
overflow: hidden; user-select: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-paginator-element:focus {
z-index: 1; .p-paginator-element:focus {
position: relative; z-index: 1;
position: relative;
}
} }
`; `;

View File

@ -3,24 +3,26 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-panel-header { @layer primevue {
display: flex; .p-panel-header {
justify-content: space-between; display: flex;
align-items: center; justify-content: space-between;
} align-items: center;
}
.p-panel-title {
line-height: 1; .p-panel-title {
} line-height: 1;
}
.p-panel-header-icon {
display: inline-flex; .p-panel-header-icon {
justify-content: center; display: inline-flex;
align-items: center; justify-content: center;
cursor: pointer; align-items: center;
text-decoration: none; cursor: pointer;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
position: relative;
}
} }
`; `;

View File

@ -3,37 +3,39 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-panelmenu .p-panelmenu-header-action { @layer primevue {
display: flex; .p-panelmenu .p-panelmenu-header-action {
align-items: center; display: flex;
user-select: none; align-items: center;
cursor: pointer; user-select: none;
position: relative; cursor: pointer;
text-decoration: none; position: relative;
} text-decoration: none;
}
.p-panelmenu .p-panelmenu-header-action:focus {
z-index: 1; .p-panelmenu .p-panelmenu-header-action:focus {
} z-index: 1;
}
.p-panelmenu .p-submenu-list {
margin: 0; .p-panelmenu .p-submenu-list {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-panelmenu .p-menuitem-link {
display: flex; .p-panelmenu .p-menuitem-link {
align-items: center; display: flex;
user-select: none; align-items: center;
cursor: pointer; user-select: none;
text-decoration: none; cursor: pointer;
position: relative; text-decoration: none;
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-panelmenu .p-menuitem-text {
line-height: 1; .p-panelmenu .p-menuitem-text {
line-height: 1;
}
} }
`; `;

View File

@ -3,31 +3,33 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-password { @layer primevue {
display: inline-flex; .p-password {
} display: inline-flex;
}
.p-password .p-password-panel {
min-width: 100%; .p-password .p-password-panel {
} min-width: 100%;
}
.p-password-meter {
height: 10px; .p-password-meter {
} height: 10px;
}
.p-password-strength {
height: 100%; .p-password-strength {
width: 0; height: 100%;
transition: width 1s ease-in-out; width: 0;
} transition: width 1s ease-in-out;
}
.p-fluid .p-password {
display: flex; .p-fluid .p-password {
} display: flex;
}
.p-password-input::-ms-reveal,
.p-password-input::-ms-clear { .p-password-input::-ms-reveal,
display: none; .p-password-input::-ms-clear {
display: none;
}
} }
`; `;

View File

@ -3,38 +3,40 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-picklist { @layer primevue {
display: flex; .p-picklist {
} display: flex;
}
.p-picklist-buttons {
display: flex; .p-picklist-buttons {
flex-direction: column; display: flex;
justify-content: center; flex-direction: column;
} justify-content: center;
}
.p-picklist-list-wrapper {
flex: 1 1 50%; .p-picklist-list-wrapper {
} flex: 1 1 50%;
}
.p-picklist-list {
list-style-type: none; .p-picklist-list {
margin: 0; list-style-type: none;
padding: 0; margin: 0;
overflow: auto; padding: 0;
min-height: 12rem; overflow: auto;
max-height: 24rem; min-height: 12rem;
} max-height: 24rem;
}
.p-picklist-item {
cursor: pointer; .p-picklist-item {
overflow: hidden; cursor: pointer;
position: relative; overflow: hidden;
} position: relative;
}
.p-picklist-item.p-picklist-flip-enter-active.p-picklist-flip-enter-to,
.p-picklist-item.p-picklist-flip-leave-active.p-picklist-flip-leave-to { .p-picklist-item.p-picklist-flip-enter-active.p-picklist-flip-enter-to,
transition: none !important; .p-picklist-item.p-picklist-flip-leave-active.p-picklist-flip-leave-to {
transition: none !important;
}
} }
`; `;

View File

@ -3,112 +3,114 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-progressbar { @layer primevue {
position: relative; .p-progressbar {
overflow: hidden; position: relative;
} overflow: hidden;
.p-progressbar-determinate .p-progressbar-value {
height: 100%;
width: 0%;
position: absolute;
display: none;
border: 0 none;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.p-progressbar-determinate .p-progressbar-label {
display: inline-flex;
}
.p-progressbar-determinate .p-progressbar-value-animate {
transition: width 1s ease-in-out;
}
.p-progressbar-indeterminate .p-progressbar-value::before {
content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
-webkit-animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}
.p-progressbar-indeterminate .p-progressbar-value::after {
content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
-webkit-animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
-webkit-animation-delay: 1.15s;
animation-delay: 1.15s;
}
@-webkit-keyframes p-progressbar-indeterminate-anim {
0% {
left: -35%;
right: 100%;
} }
60% {
left: 100%; .p-progressbar-determinate .p-progressbar-value {
right: -90%; height: 100%;
width: 0%;
position: absolute;
display: none;
border: 0 none;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
} }
100% {
left: 100%; .p-progressbar-determinate .p-progressbar-label {
right: -90%; display: inline-flex;
} }
}
@keyframes p-progressbar-indeterminate-anim { .p-progressbar-determinate .p-progressbar-value-animate {
0% { transition: width 1s ease-in-out;
left: -35%;
right: 100%;
} }
60% {
left: 100%; .p-progressbar-indeterminate .p-progressbar-value::before {
right: -90%; content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
-webkit-animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
animation: p-progressbar-indeterminate-anim 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
} }
100% {
left: 100%; .p-progressbar-indeterminate .p-progressbar-value::after {
right: -90%; content: '';
position: absolute;
background-color: inherit;
top: 0;
left: 0;
bottom: 0;
will-change: left, right;
-webkit-animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
animation: p-progressbar-indeterminate-anim-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
-webkit-animation-delay: 1.15s;
animation-delay: 1.15s;
} }
}
@-webkit-keyframes p-progressbar-indeterminate-anim {
@-webkit-keyframes p-progressbar-indeterminate-anim-short { 0% {
0% { left: -35%;
left: -200%; right: 100%;
right: 100%; }
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
} }
60% { @keyframes p-progressbar-indeterminate-anim {
left: 107%; 0% {
right: -8%; left: -35%;
right: 100%;
}
60% {
left: 100%;
right: -90%;
}
100% {
left: 100%;
right: -90%;
}
} }
100% {
left: 107%; @-webkit-keyframes p-progressbar-indeterminate-anim-short {
right: -8%; 0% {
left: -200%;
right: 100%;
}
60% {
left: 107%;
right: -8%;
}
100% {
left: 107%;
right: -8%;
}
} }
} @keyframes p-progressbar-indeterminate-anim-short {
@keyframes p-progressbar-indeterminate-anim-short { 0% {
0% { left: -200%;
left: -200%; right: 100%;
right: 100%; }
} 60% {
60% { left: 107%;
left: 107%; right: -8%;
right: -8%; }
} 100% {
100% { left: 107%;
left: 107%; right: -8%;
right: -8%; }
} }
} }
`; `;

View File

@ -3,30 +3,32 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-progress-spinner { @layer primevue {
position: relative; .p-progress-spinner {
margin: 0 auto; position: relative;
width: 100px; margin: 0 auto;
height: 100px; width: 100px;
display: inline-block; height: 100px;
} display: inline-block;
}
.p-progress-spinner::before {
content: ''; .p-progress-spinner::before {
display: block; content: '';
padding-top: 100%; display: block;
} padding-top: 100%;
}
.p-progress-spinner-svg {
height: 100%; .p-progress-spinner-svg {
transform-origin: center center; height: 100%;
width: 100%; transform-origin: center center;
position: absolute; width: 100%;
top: 0; position: absolute;
bottom: 0; top: 0;
left: 0; bottom: 0;
right: 0; left: 0;
margin: auto; right: 0;
margin: auto;
}
} }
`; `;

View File

@ -3,20 +3,22 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-rating { @layer primevue {
position: relative; .p-rating {
display: flex; position: relative;
align-items: center; display: flex;
} align-items: center;
}
.p-rating-item {
display: inline-flex; .p-rating-item {
align-items: center; display: inline-flex;
cursor: pointer; align-items: center;
} cursor: pointer;
}
.p-rating.p-readonly .p-rating-item {
cursor: default; .p-rating.p-readonly .p-rating-item {
cursor: default;
}
} }
`; `;

View File

@ -2,34 +2,36 @@ import BaseDirective from 'primevue/basedirective';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-ripple {
overflow: hidden;
position: relative;
}
.p-ink {
display: block;
position: absolute;
background: rgba(255, 255, 255, 0.5);
border-radius: 100%;
transform: scale(0);
pointer-events: none;
}
.p-ink-active {
animation: ripple 0.4s linear;
}
.p-ripple-disabled .p-ink {
display: none !important;
}
@keyframes ripple { @keyframes ripple {
100% { 100% {
opacity: 0; opacity: 0;
transform: scale(2.5); transform: scale(2.5);
} }
} }
@layer primevue {
.p-ripple {
overflow: hidden;
position: relative;
}
.p-ink {
display: block;
position: absolute;
background: rgba(255, 255, 255, 0.5);
border-radius: 100%;
transform: scale(0);
pointer-events: none;
}
.p-ink-active {
animation: ripple 0.4s linear;
}
.p-ripple-disabled .p-ink {
display: none !important;
}
}
`; `;
const classes = { const classes = {

View File

@ -3,60 +3,62 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-scrollpanel-wrapper { @layer primevue {
overflow: hidden; .p-scrollpanel-wrapper {
width: 100%; overflow: hidden;
height: 100%; width: 100%;
position: relative; height: 100%;
z-index: 1; position: relative;
float: left; z-index: 1;
} float: left;
}
.p-scrollpanel-content {
height: calc(100% + 18px); .p-scrollpanel-content {
width: calc(100% + 18px); height: calc(100% + 18px);
padding: 0 18px 18px 0; width: calc(100% + 18px);
position: relative; padding: 0 18px 18px 0;
overflow: scroll; position: relative;
box-sizing: border-box; overflow: scroll;
scrollbar-width: none; box-sizing: border-box;
} scrollbar-width: none;
}
.p-scrollpanel-content::-webkit-scrollbar {
display: none; .p-scrollpanel-content::-webkit-scrollbar {
} display: none;
}
.p-scrollpanel-bar {
position: relative; .p-scrollpanel-bar {
background: #c1c1c1; position: relative;
border-radius: 3px; background: #c1c1c1;
z-index: 2; border-radius: 3px;
cursor: pointer; z-index: 2;
opacity: 0; cursor: pointer;
transition: opacity 0.25s linear; opacity: 0;
} transition: opacity 0.25s linear;
}
.p-scrollpanel-bar-y {
width: 9px; .p-scrollpanel-bar-y {
top: 0; width: 9px;
} top: 0;
}
.p-scrollpanel-bar-x {
height: 9px; .p-scrollpanel-bar-x {
bottom: 0; height: 9px;
} bottom: 0;
}
.p-scrollpanel-hidden {
visibility: hidden; .p-scrollpanel-hidden {
} visibility: hidden;
}
.p-scrollpanel:hover .p-scrollpanel-bar,
.p-scrollpanel:active .p-scrollpanel-bar { .p-scrollpanel:hover .p-scrollpanel-bar,
opacity: 1; .p-scrollpanel:active .p-scrollpanel-bar {
} opacity: 1;
}
.p-scrollpanel-grabbed {
user-select: none; .p-scrollpanel-grabbed {
user-select: none;
}
} }
`; `;

View File

@ -3,37 +3,39 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-scrolltop { @layer primevue {
position: fixed; .p-scrolltop {
bottom: 20px; position: fixed;
right: 20px; bottom: 20px;
display: flex; right: 20px;
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-scrolltop-sticky {
position: sticky; .p-scrolltop-sticky {
} position: sticky;
}
.p-scrolltop-sticky.p-link {
margin-left: auto; .p-scrolltop-sticky.p-link {
} margin-left: auto;
}
.p-scrolltop-enter-from {
opacity: 0; .p-scrolltop-enter-from {
} opacity: 0;
}
.p-scrolltop-enter-active {
transition: opacity 0.15s; .p-scrolltop-enter-active {
} transition: opacity 0.15s;
}
.p-scrolltop.p-scrolltop-leave-to {
opacity: 0; .p-scrolltop.p-scrolltop-leave-to {
} opacity: 0;
}
.p-scrolltop-leave-active {
transition: opacity 0.15s; .p-scrolltop-leave-active {
transition: opacity 0.15s;
}
} }
`; `;

View File

@ -3,152 +3,154 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-sidebar-mask { @layer primevue {
display: none; .p-sidebar-mask {
pointer-events: none; display: none;
background-color: transparent; pointer-events: none;
transition-property: background-color; background-color: transparent;
} transition-property: background-color;
}
.p-sidebar-mask.p-component-overlay {
pointer-events: auto; .p-sidebar-mask.p-component-overlay {
} pointer-events: auto;
}
.p-sidebar-visible {
display: flex; .p-sidebar-visible {
} display: flex;
}
.p-sidebar {
display: flex; .p-sidebar {
flex-direction: column; display: flex;
pointer-events: auto; flex-direction: column;
transform: translate3d(0px, 0px, 0px); pointer-events: auto;
position: relative; transform: translate3d(0px, 0px, 0px);
transition: transform 0.3s; position: relative;
} transition: transform 0.3s;
}
.p-sidebar-content {
overflow-y: auto; .p-sidebar-content {
flex-grow: 1; overflow-y: auto;
} flex-grow: 1;
}
.p-sidebar-header {
display: flex; .p-sidebar-header {
align-items: center; display: flex;
justify-content: flex-end; align-items: center;
flex-shrink: 0; justify-content: flex-end;
} flex-shrink: 0;
}
.p-sidebar-icon {
display: flex; .p-sidebar-icon {
align-items: center; display: flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
} position: relative;
}
.p-sidebar-full .p-sidebar {
transition: none; .p-sidebar-full .p-sidebar {
transform: none; transition: none;
width: 100vw !important; transform: none;
height: 100vh !important; width: 100vw !important;
max-height: 100%; height: 100vh !important;
top: 0px !important; max-height: 100%;
left: 0px !important; top: 0px !important;
} left: 0px !important;
}
/* Animation */
/* Center */ /* Animation */
.p-sidebar-left .p-sidebar-enter-from, /* Center */
.p-sidebar-left .p-sidebar-leave-to { .p-sidebar-left .p-sidebar-enter-from,
transform: translateX(-100%); .p-sidebar-left .p-sidebar-leave-to {
} transform: translateX(-100%);
.p-sidebar-right .p-sidebar-enter-from, }
.p-sidebar-right .p-sidebar-leave-to { .p-sidebar-right .p-sidebar-enter-from,
transform: translateX(100%); .p-sidebar-right .p-sidebar-leave-to {
} transform: translateX(100%);
.p-sidebar-top .p-sidebar-enter-from, }
.p-sidebar-top .p-sidebar-leave-to { .p-sidebar-top .p-sidebar-enter-from,
transform: translateY(-100%); .p-sidebar-top .p-sidebar-leave-to {
} transform: translateY(-100%);
.p-sidebar-bottom .p-sidebar-enter-from, }
.p-sidebar-bottom .p-sidebar-leave-to { .p-sidebar-bottom .p-sidebar-enter-from,
transform: translateY(100%); .p-sidebar-bottom .p-sidebar-leave-to {
} transform: translateY(100%);
.p-sidebar-full .p-sidebar-enter-from, }
.p-sidebar-full .p-sidebar-leave-to { .p-sidebar-full .p-sidebar-enter-from,
opacity: 0; .p-sidebar-full .p-sidebar-leave-to {
} opacity: 0;
.p-sidebar-full .p-sidebar-enter-active, }
.p-sidebar-full .p-sidebar-leave-active { .p-sidebar-full .p-sidebar-enter-active,
transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1); .p-sidebar-full .p-sidebar-leave-active {
} transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
/* Size */
.p-sidebar-left .p-sidebar { /* Size */
width: 20rem; .p-sidebar-left .p-sidebar {
height: 100%;
}
.p-sidebar-right .p-sidebar {
width: 20rem;
height: 100%;
}
.p-sidebar-top .p-sidebar {
height: 10rem;
width: 100%;
}
.p-sidebar-bottom .p-sidebar {
height: 10rem;
width: 100%;
}
.p-sidebar-left .p-sidebar-sm,
.p-sidebar-right .p-sidebar-sm {
width: 20rem;
}
.p-sidebar-left .p-sidebar-md,
.p-sidebar-right .p-sidebar-md {
width: 40rem;
}
.p-sidebar-left .p-sidebar-lg,
.p-sidebar-right .p-sidebar-lg {
width: 60rem;
}
.p-sidebar-top .p-sidebar-sm,
.p-sidebar-bottom .p-sidebar-sm {
height: 10rem;
}
.p-sidebar-top .p-sidebar-md,
.p-sidebar-bottom .p-sidebar-md {
height: 20rem;
}
.p-sidebar-top .p-sidebar-lg,
.p-sidebar-bottom .p-sidebar-lg {
height: 30rem;
}
.p-sidebar-left .p-sidebar-content,
.p-sidebar-right .p-sidebar-content,
.p-sidebar-top .p-sidebar-content,
.p-sidebar-bottom .p-sidebar-content {
width: 100%;
height: 100%;
}
@media screen and (max-width: 64em) {
.p-sidebar-left .p-sidebar-lg,
.p-sidebar-left .p-sidebar-md,
.p-sidebar-right .p-sidebar-lg,
.p-sidebar-right .p-sidebar-md {
width: 20rem; width: 20rem;
height: 100%;
}
.p-sidebar-right .p-sidebar {
width: 20rem;
height: 100%;
}
.p-sidebar-top .p-sidebar {
height: 10rem;
width: 100%;
}
.p-sidebar-bottom .p-sidebar {
height: 10rem;
width: 100%;
}
.p-sidebar-left .p-sidebar-sm,
.p-sidebar-right .p-sidebar-sm {
width: 20rem;
}
.p-sidebar-left .p-sidebar-md,
.p-sidebar-right .p-sidebar-md {
width: 40rem;
}
.p-sidebar-left .p-sidebar-lg,
.p-sidebar-right .p-sidebar-lg {
width: 60rem;
}
.p-sidebar-top .p-sidebar-sm,
.p-sidebar-bottom .p-sidebar-sm {
height: 10rem;
}
.p-sidebar-top .p-sidebar-md,
.p-sidebar-bottom .p-sidebar-md {
height: 20rem;
}
.p-sidebar-top .p-sidebar-lg,
.p-sidebar-bottom .p-sidebar-lg {
height: 30rem;
}
.p-sidebar-left .p-sidebar-content,
.p-sidebar-right .p-sidebar-content,
.p-sidebar-top .p-sidebar-content,
.p-sidebar-bottom .p-sidebar-content {
width: 100%;
height: 100%;
}
@media screen and (max-width: 64em) {
.p-sidebar-left .p-sidebar-lg,
.p-sidebar-left .p-sidebar-md,
.p-sidebar-right .p-sidebar-lg,
.p-sidebar-right .p-sidebar-md {
width: 20rem;
}
} }
} }
`; `;

View File

@ -3,36 +3,38 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-skeleton { @layer primevue {
overflow: hidden; .p-skeleton {
} overflow: hidden;
.p-skeleton::after {
content: '';
animation: p-skeleton-animation 1.2s infinite;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
transform: translateX(-100%);
z-index: 1;
}
.p-skeleton.p-skeleton-circle {
border-radius: 50%;
}
.p-skeleton-none::after {
animation: none;
}
@keyframes p-skeleton-animation {
from {
transform: translateX(-100%);
} }
to {
transform: translateX(100%); .p-skeleton::after {
content: '';
animation: p-skeleton-animation 1.2s infinite;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
transform: translateX(-100%);
z-index: 1;
}
.p-skeleton.p-skeleton-circle {
border-radius: 50%;
}
.p-skeleton-none::after {
animation: none;
}
@keyframes p-skeleton-animation {
from {
transform: translateX(-100%);
}
to {
transform: translateX(100%);
}
} }
} }
`; `;

View File

@ -3,42 +3,44 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-slider { @layer primevue {
position: relative; .p-slider {
} position: relative;
}
.p-slider .p-slider-handle {
cursor: grab; .p-slider .p-slider-handle {
touch-action: none; cursor: grab;
display: block; touch-action: none;
} display: block;
}
.p-slider-range {
display: block; .p-slider-range {
} display: block;
}
.p-slider-horizontal .p-slider-range {
top: 0; .p-slider-horizontal .p-slider-range {
left: 0; top: 0;
height: 100%; left: 0;
} height: 100%;
}
.p-slider-horizontal .p-slider-handle {
top: 50%; .p-slider-horizontal .p-slider-handle {
} top: 50%;
}
.p-slider-vertical {
height: 100px; .p-slider-vertical {
} height: 100px;
}
.p-slider-vertical .p-slider-handle {
left: 50%; .p-slider-vertical .p-slider-handle {
} left: 50%;
}
.p-slider-vertical .p-slider-range {
bottom: 0; .p-slider-vertical .p-slider-range {
left: 0; bottom: 0;
width: 100%; left: 0;
width: 100%;
}
} }
`; `;

View File

@ -3,81 +3,83 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-speeddial { @layer primevue {
position: absolute; .p-speeddial {
display: flex; position: absolute;
} display: flex;
}
.p-speeddial-button {
z-index: 1; .p-speeddial-button {
} z-index: 1;
}
.p-speeddial-list {
margin: 0; .p-speeddial-list {
padding: 0; margin: 0;
list-style: none; padding: 0;
display: flex; list-style: none;
align-items: center; display: flex;
justify-content: center; align-items: center;
transition: top 0s linear 0.2s; justify-content: center;
pointer-events: none; transition: top 0s linear 0.2s;
z-index: 2; pointer-events: none;
} z-index: 2;
}
.p-speeddial-item {
transform: scale(0); .p-speeddial-item {
opacity: 0; transform: scale(0);
transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s; opacity: 0;
will-change: transform; transition: transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 0.8s;
} will-change: transform;
}
.p-speeddial-action {
display: flex; .p-speeddial-action {
align-items: center; display: flex;
justify-content: center; align-items: center;
border-radius: 50%; justify-content: center;
position: relative; border-radius: 50%;
overflow: hidden; position: relative;
} overflow: hidden;
}
.p-speeddial-circle .p-speeddial-item,
.p-speeddial-semi-circle .p-speeddial-item, .p-speeddial-circle .p-speeddial-item,
.p-speeddial-quarter-circle .p-speeddial-item { .p-speeddial-semi-circle .p-speeddial-item,
position: absolute; .p-speeddial-quarter-circle .p-speeddial-item {
} position: absolute;
}
.p-speeddial-rotate {
transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; .p-speeddial-rotate {
will-change: transform; transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
} will-change: transform;
}
.p-speeddial-mask {
position: absolute; .p-speeddial-mask {
left: 0; position: absolute;
top: 0; left: 0;
width: 100%; top: 0;
height: 100%; width: 100%;
opacity: 0; height: 100%;
transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 0;
} transition: opacity 250ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
.p-speeddial-mask-visible {
pointer-events: none; .p-speeddial-mask-visible {
opacity: 1; pointer-events: none;
transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1); opacity: 1;
} transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
}
.p-speeddial-opened .p-speeddial-list {
pointer-events: auto; .p-speeddial-opened .p-speeddial-list {
} pointer-events: auto;
}
.p-speeddial-opened .p-speeddial-item {
transform: scale(1); .p-speeddial-opened .p-speeddial-item {
opacity: 1; transform: scale(1);
} opacity: 1;
}
.p-speeddial-opened .p-speeddial-rotate {
transform: rotate(45deg); .p-speeddial-opened .p-speeddial-rotate {
transform: rotate(45deg);
}
} }
`; `;

View File

@ -3,36 +3,38 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-splitbutton { @layer primevue {
display: inline-flex; .p-splitbutton {
position: relative; display: inline-flex;
} position: relative;
}
.p-splitbutton .p-splitbutton-defaultbutton,
.p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button, .p-splitbutton .p-splitbutton-defaultbutton,
.p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button { .p-splitbutton.p-button-rounded > .p-splitbutton-defaultbutton.p-button,
flex: 1 1 auto; .p-splitbutton.p-button-outlined > .p-splitbutton-defaultbutton.p-button {
border-top-right-radius: 0; flex: 1 1 auto;
border-bottom-right-radius: 0; border-top-right-radius: 0;
border-right: 0 none; border-bottom-right-radius: 0;
} border-right: 0 none;
}
.p-splitbutton-menubutton,
.p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button, .p-splitbutton-menubutton,
.p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button { .p-splitbutton.p-button-rounded > .p-splitbutton-menubutton.p-button,
display: flex; .p-splitbutton.p-button-outlined > .p-splitbutton-menubutton.p-button {
align-items: center; display: flex;
justify-content: center; align-items: center;
border-top-left-radius: 0; justify-content: center;
border-bottom-left-radius: 0; border-top-left-radius: 0;
} border-bottom-left-radius: 0;
}
.p-splitbutton .p-menu {
min-width: 100%; .p-splitbutton .p-menu {
} min-width: 100%;
}
.p-fluid .p-splitbutton {
display: flex; .p-fluid .p-splitbutton {
display: flex;
}
} }
`; `;

View File

@ -3,50 +3,52 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-splitter { @layer primevue {
display: flex; .p-splitter {
flex-wrap: nowrap; display: flex;
} flex-wrap: nowrap;
}
.p-splitter-vertical {
flex-direction: column; .p-splitter-vertical {
} flex-direction: column;
}
.p-splitter-gutter {
flex-grow: 0; .p-splitter-gutter {
flex-shrink: 0; flex-grow: 0;
display: flex; flex-shrink: 0;
align-items: center; display: flex;
justify-content: center; align-items: center;
cursor: col-resize; justify-content: center;
} cursor: col-resize;
}
.p-splitter-horizontal.p-splitter-resizing {
cursor: col-resize; .p-splitter-horizontal.p-splitter-resizing {
user-select: none; cursor: col-resize;
} user-select: none;
}
.p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {
height: 24px; .p-splitter-horizontal > .p-splitter-gutter > .p-splitter-gutter-handle {
width: 100%; height: 24px;
} width: 100%;
}
.p-splitter-horizontal > .p-splitter-gutter {
cursor: col-resize; .p-splitter-horizontal > .p-splitter-gutter {
} cursor: col-resize;
}
.p-splitter-vertical.p-splitter-resizing {
cursor: row-resize; .p-splitter-vertical.p-splitter-resizing {
user-select: none; cursor: row-resize;
} user-select: none;
}
.p-splitter-vertical > .p-splitter-gutter {
cursor: row-resize; .p-splitter-vertical > .p-splitter-gutter {
} cursor: row-resize;
}
.p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {
width: 24px; .p-splitter-vertical > .p-splitter-gutter > .p-splitter-gutter-handle {
height: 100%; width: 24px;
height: 100%;
}
} }
`; `;

View File

@ -3,17 +3,19 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-splitter-panel { @layer primevue {
flex-grow: 1; .p-splitter-panel {
} flex-grow: 1;
}
.p-splitter-panel-nested {
display: flex; .p-splitter-panel-nested {
} display: flex;
}
.p-splitter-panel .p-splitter {
flex-grow: 1; .p-splitter-panel .p-splitter {
border: 0 none; flex-grow: 1;
border: 0 none;
}
} }
`; `;

View File

@ -3,56 +3,58 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-steps { @layer primevue {
position: relative; .p-steps {
} position: relative;
}
.p-steps .p-steps-list {
padding: 0; .p-steps .p-steps-list {
margin: 0; padding: 0;
list-style-type: none; margin: 0;
display: flex; list-style-type: none;
} display: flex;
}
.p-steps-item {
position: relative; .p-steps-item {
display: flex; position: relative;
justify-content: center; display: flex;
flex: 1 1 auto; justify-content: center;
overflow: hidden; flex: 1 1 auto;
} overflow: hidden;
}
.p-steps-item .p-menuitem-link {
display: inline-flex; .p-steps-item .p-menuitem-link {
flex-direction: column; display: inline-flex;
align-items: center; flex-direction: column;
overflow: hidden; align-items: center;
text-decoration: none; overflow: hidden;
} text-decoration: none;
}
.p-steps.p-steps-readonly .p-steps-item {
cursor: auto; .p-steps.p-steps-readonly .p-steps-item {
} cursor: auto;
}
.p-steps-item.p-steps-current .p-menuitem-link {
cursor: default; .p-steps-item.p-steps-current .p-menuitem-link {
} cursor: default;
}
.p-steps-title {
white-space: nowrap; .p-steps-title {
overflow: hidden; white-space: nowrap;
text-overflow: ellipsis; overflow: hidden;
max-width: 100%; text-overflow: ellipsis;
} max-width: 100%;
}
.p-steps-number {
display: flex; .p-steps-number {
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-steps-title {
display: block; .p-steps-title {
display: block;
}
} }
`; `;

View File

@ -3,44 +3,46 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tabmenu { @layer primevue {
overflow-x: auto; .p-tabmenu {
} overflow-x: auto;
}
.p-tabmenu-nav {
display: flex; .p-tabmenu-nav {
margin: 0; display: flex;
padding: 0; margin: 0;
list-style-type: none; padding: 0;
flex-wrap: nowrap; list-style-type: none;
} flex-wrap: nowrap;
}
.p-tabmenu-nav a {
cursor: pointer; .p-tabmenu-nav a {
user-select: none; cursor: pointer;
display: flex; user-select: none;
align-items: center; display: flex;
position: relative; align-items: center;
text-decoration: none; position: relative;
text-decoration: none; text-decoration: none;
overflow: hidden; text-decoration: none;
} overflow: hidden;
}
.p-tabmenu-nav a:focus {
z-index: 1; .p-tabmenu-nav a:focus {
} z-index: 1;
}
.p-tabmenu-nav .p-menuitem-text {
line-height: 1; .p-tabmenu-nav .p-menuitem-text {
} line-height: 1;
}
.p-tabmenu-ink-bar {
display: none; .p-tabmenu-ink-bar {
z-index: 1; display: none;
} z-index: 1;
}
.p-tabmenu::-webkit-scrollbar {
display: none; .p-tabmenu::-webkit-scrollbar {
display: none;
}
} }
`; `;

View File

@ -3,74 +3,76 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tabview-nav-container { @layer primevue {
position: relative; .p-tabview-nav-container {
} position: relative;
}
.p-tabview-scrollable .p-tabview-nav-container {
overflow: hidden; .p-tabview-scrollable .p-tabview-nav-container {
} overflow: hidden;
}
.p-tabview-nav-content {
overflow-x: auto; .p-tabview-nav-content {
overflow-y: hidden; overflow-x: auto;
scroll-behavior: smooth; overflow-y: hidden;
scrollbar-width: none; scroll-behavior: smooth;
overscroll-behavior: contain auto; scrollbar-width: none;
} overscroll-behavior: contain auto;
}
.p-tabview-nav {
display: flex; .p-tabview-nav {
margin: 0; display: flex;
padding: 0; margin: 0;
list-style-type: none; padding: 0;
flex: 1 1 auto; list-style-type: none;
} flex: 1 1 auto;
}
.p-tabview-header-action {
cursor: pointer; .p-tabview-header-action {
user-select: none; cursor: pointer;
display: flex; user-select: none;
align-items: center; display: flex;
position: relative; align-items: center;
text-decoration: none; position: relative;
overflow: hidden; text-decoration: none;
} overflow: hidden;
}
.p-tabview-ink-bar {
display: none; .p-tabview-ink-bar {
z-index: 1; display: none;
} z-index: 1;
}
.p-tabview-header-action:focus {
z-index: 1; .p-tabview-header-action:focus {
} z-index: 1;
}
.p-tabview-title {
line-height: 1; .p-tabview-title {
white-space: nowrap; line-height: 1;
} white-space: nowrap;
}
.p-tabview-nav-btn {
position: absolute; .p-tabview-nav-btn {
top: 0; position: absolute;
z-index: 2; top: 0;
height: 100%; z-index: 2;
display: flex; height: 100%;
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-tabview-nav-prev {
left: 0; .p-tabview-nav-prev {
} left: 0;
}
.p-tabview-nav-next {
right: 0; .p-tabview-nav-next {
} right: 0;
}
.p-tabview-nav-content::-webkit-scrollbar {
display: none; .p-tabview-nav-content::-webkit-scrollbar {
display: none;
}
} }
`; `;

View File

@ -3,20 +3,22 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tag { @layer primevue {
display: inline-flex; .p-tag {
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-tag-icon,
.p-tag-value, .p-tag-icon,
.p-tag-icon.pi { .p-tag-value,
line-height: 1.5; .p-tag-icon.pi {
} line-height: 1.5;
}
.p-tag.p-tag-rounded {
border-radius: 10rem; .p-tag.p-tag-rounded {
border-radius: 10rem;
}
} }
`; `;

View File

@ -3,27 +3,29 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-terminal { @layer primevue {
height: 18rem; .p-terminal {
overflow: auto; height: 18rem;
} overflow: auto;
}
.p-terminal-prompt-container {
display: flex; .p-terminal-prompt-container {
align-items: center; display: flex;
} align-items: center;
}
.p-terminal-input {
flex: 1 1 auto; .p-terminal-input {
border: 0 none; flex: 1 1 auto;
background-color: transparent; border: 0 none;
color: inherit; background-color: transparent;
padding: 0; color: inherit;
outline: 0 none; padding: 0;
} outline: 0 none;
}
.p-terminal-input::-ms-clear {
display: none; .p-terminal-input::-ms-clear {
display: none;
}
} }
`; `;

View File

@ -3,13 +3,15 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-inputtextarea-resizable { @layer primevue {
overflow: hidden; .p-inputtextarea-resizable {
resize: none; overflow: hidden;
} resize: none;
}
.p-fluid .p-inputtextarea {
width: 100%; .p-fluid .p-inputtextarea {
width: 100%;
}
} }
`; `;

View File

@ -3,44 +3,46 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tieredmenu ul { @layer primevue {
margin: 0; .p-tieredmenu ul {
padding: 0; margin: 0;
list-style: none; padding: 0;
} list-style: none;
}
.p-tieredmenu .p-submenu-list {
position: absolute; .p-tieredmenu .p-submenu-list {
min-width: 100%; position: absolute;
z-index: 1; min-width: 100%;
display: none; z-index: 1;
} display: none;
}
.p-tieredmenu .p-menuitem-link {
cursor: pointer; .p-tieredmenu .p-menuitem-link {
display: flex; cursor: pointer;
align-items: center; display: flex;
text-decoration: none; align-items: center;
overflow: hidden; text-decoration: none;
position: relative; overflow: hidden;
} position: relative;
}
.p-tieredmenu .p-menuitem-text {
line-height: 1; .p-tieredmenu .p-menuitem-text {
} line-height: 1;
}
.p-tieredmenu .p-menuitem {
position: relative; .p-tieredmenu .p-menuitem {
} position: relative;
}
.p-tieredmenu .p-menuitem-link .p-submenu-icon {
margin-left: auto; .p-tieredmenu .p-menuitem-link .p-submenu-icon {
} margin-left: auto;
}
.p-tieredmenu .p-menuitem-active > .p-submenu-list {
display: block; .p-tieredmenu .p-menuitem-active > .p-submenu-list {
left: 100%; display: block;
top: 0; left: 100%;
top: 0;
}
} }
`; `;

View File

@ -3,115 +3,117 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-timeline { @layer primevue {
display: flex; .p-timeline {
flex-grow: 1; display: flex;
flex-direction: column; flex-grow: 1;
} flex-direction: column;
}
.p-timeline-left .p-timeline-event-opposite {
text-align: right; .p-timeline-left .p-timeline-event-opposite {
} text-align: right;
}
.p-timeline-left .p-timeline-event-content {
text-align: left; .p-timeline-left .p-timeline-event-content {
} text-align: left;
}
.p-timeline-right .p-timeline-event {
flex-direction: row-reverse; .p-timeline-right .p-timeline-event {
} flex-direction: row-reverse;
}
.p-timeline-right .p-timeline-event-opposite {
text-align: left; .p-timeline-right .p-timeline-event-opposite {
} text-align: left;
}
.p-timeline-right .p-timeline-event-content {
text-align: right; .p-timeline-right .p-timeline-event-content {
} text-align: right;
}
.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {
flex-direction: row-reverse; .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) {
} flex-direction: row-reverse;
}
.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {
text-align: right; .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-opposite {
} text-align: right;
}
.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {
text-align: left; .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(odd) .p-timeline-event-content {
} text-align: left;
}
.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {
text-align: left; .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-opposite {
} text-align: left;
}
.p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {
text-align: right; .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(even) .p-timeline-event-content {
} text-align: right;
}
.p-timeline-event {
display: flex; .p-timeline-event {
position: relative; display: flex;
min-height: 70px; position: relative;
} min-height: 70px;
}
.p-timeline-event:last-child {
min-height: 0; .p-timeline-event:last-child {
} min-height: 0;
}
.p-timeline-event-opposite {
flex: 1; .p-timeline-event-opposite {
padding: 0 1rem; flex: 1;
} padding: 0 1rem;
}
.p-timeline-event-content {
flex: 1; .p-timeline-event-content {
padding: 0 1rem; flex: 1;
} padding: 0 1rem;
}
.p-timeline-event-separator {
flex: 0; .p-timeline-event-separator {
display: flex; flex: 0;
align-items: center; display: flex;
flex-direction: column; align-items: center;
} flex-direction: column;
}
.p-timeline-event-marker {
display: flex; .p-timeline-event-marker {
align-self: baseline; display: flex;
} align-self: baseline;
}
.p-timeline-event-connector {
flex-grow: 1; .p-timeline-event-connector {
} flex-grow: 1;
}
.p-timeline-horizontal {
flex-direction: row; .p-timeline-horizontal {
} flex-direction: row;
}
.p-timeline-horizontal .p-timeline-event {
flex-direction: column; .p-timeline-horizontal .p-timeline-event {
flex: 1; flex-direction: column;
} flex: 1;
}
.p-timeline-horizontal .p-timeline-event:last-child {
flex: 0; .p-timeline-horizontal .p-timeline-event:last-child {
} flex: 0;
}
.p-timeline-horizontal .p-timeline-event-separator {
flex-direction: row; .p-timeline-horizontal .p-timeline-event-separator {
} flex-direction: row;
}
.p-timeline-horizontal .p-timeline-event-connector {
width: 100%; .p-timeline-horizontal .p-timeline-event-connector {
} width: 100%;
}
.p-timeline-bottom .p-timeline-event {
flex-direction: column-reverse; .p-timeline-bottom .p-timeline-event {
} flex-direction: column-reverse;
}
.p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {
flex-direction: column-reverse; .p-timeline-horizontal.p-timeline-alternate .p-timeline-event:nth-child(even) {
flex-direction: column-reverse;
}
} }
`; `;

View File

@ -3,77 +3,79 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-toast { @layer primevue {
width: 25rem; .p-toast {
white-space: pre-line; width: 25rem;
word-break: break-word; white-space: pre-line;
} word-break: break-word;
}
.p-toast-message-icon {
flex-shrink: 0; .p-toast-message-icon {
} flex-shrink: 0;
}
.p-toast-message-content {
display: flex; .p-toast-message-content {
align-items: flex-start; display: flex;
} align-items: flex-start;
}
.p-toast-message-text {
flex: 1 1 auto; .p-toast-message-text {
} flex: 1 1 auto;
}
.p-toast-top-center {
transform: translateX(-50%); .p-toast-top-center {
} transform: translateX(-50%);
}
.p-toast-bottom-center {
transform: translateX(-50%); .p-toast-bottom-center {
} transform: translateX(-50%);
}
.p-toast-center {
min-width: 20vw; .p-toast-center {
transform: translate(-50%, -50%); min-width: 20vw;
} transform: translate(-50%, -50%);
}
.p-toast-icon-close {
display: flex; .p-toast-icon-close {
align-items: center; display: flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
} position: relative;
}
.p-toast-icon-close.p-link {
cursor: pointer; .p-toast-icon-close.p-link {
} cursor: pointer;
}
/* Animations */
.p-toast-message-enter-from { /* Animations */
opacity: 0; .p-toast-message-enter-from {
-webkit-transform: translateY(50%); opacity: 0;
-ms-transform: translateY(50%); -webkit-transform: translateY(50%);
transform: translateY(50%); -ms-transform: translateY(50%);
} transform: translateY(50%);
}
.p-toast-message-leave-from {
max-height: 1000px; .p-toast-message-leave-from {
} max-height: 1000px;
}
.p-toast .p-toast-message.p-toast-message-leave-to {
max-height: 0; .p-toast .p-toast-message.p-toast-message-leave-to {
opacity: 0; max-height: 0;
margin-bottom: 0; opacity: 0;
overflow: hidden; margin-bottom: 0;
} overflow: hidden;
}
.p-toast-message-enter-active {
-webkit-transition: transform 0.3s, opacity 0.3s; .p-toast-message-enter-active {
transition: transform 0.3s, opacity 0.3s; -webkit-transition: transform 0.3s, opacity 0.3s;
} transition: transform 0.3s, opacity 0.3s;
}
.p-toast-message-leave-active {
-webkit-transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s; .p-toast-message-leave-active {
transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s; -webkit-transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
}
} }
`; `;

View File

@ -3,24 +3,26 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-toolbar { @layer primevue {
display: flex; .p-toolbar {
align-items: center; display: flex;
justify-content: space-between; align-items: center;
flex-wrap: wrap; justify-content: space-between;
} flex-wrap: wrap;
}
.p-toolbar-group-start,
.p-toolbar-group-center, .p-toolbar-group-start,
.p-toolbar-group-end { .p-toolbar-group-center,
display: flex; .p-toolbar-group-end {
align-items: center; display: flex;
} align-items: center;
}
.p-toolbar-group-left,
.p-toolbar-group-right { .p-toolbar-group-left,
display: flex; .p-toolbar-group-right {
align-items: center; display: flex;
align-items: center;
}
} }
`; `;

View File

@ -2,59 +2,61 @@ import BaseDirective from 'primevue/basedirective';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tooltip { @layer primevue {
position:absolute; .p-tooltip {
display:none; position:absolute;
pointer-events:none; display:none;
padding: .25em .5rem; pointer-events:none;
max-width: 12.5rem; padding: .25em .5rem;
} max-width: 12.5rem;
}
.p-tooltip.p-tooltip-right,
.p-tooltip.p-tooltip-left { .p-tooltip.p-tooltip-right,
padding: 0 .25rem; .p-tooltip.p-tooltip-left {
} padding: 0 .25rem;
}
.p-tooltip.p-tooltip-top,
.p-tooltip.p-tooltip-bottom { .p-tooltip.p-tooltip-top,
padding:.25em 0; .p-tooltip.p-tooltip-bottom {
} padding:.25em 0;
}
.p-tooltip .p-tooltip-text {
white-space: pre-line; .p-tooltip .p-tooltip-text {
word-break: break-word; white-space: pre-line;
} word-break: break-word;
}
.p-tooltip-arrow {
position: absolute; .p-tooltip-arrow {
width: 0; position: absolute;
height: 0; width: 0;
border-color: transparent; height: 0;
border-style: solid; border-color: transparent;
} border-style: solid;
}
.p-tooltip-right .p-tooltip-arrow {
margin-top: -.25rem; .p-tooltip-right .p-tooltip-arrow {
border-width: .25em .25em .25em 0; margin-top: -.25rem;
} border-width: .25em .25em .25em 0;
}
.p-tooltip-left .p-tooltip-arrow {
margin-top: -.25rem; .p-tooltip-left .p-tooltip-arrow {
border-width: .25em 0 .25em .25rem; margin-top: -.25rem;
} border-width: .25em 0 .25em .25rem;
}
.p-tooltip.p-tooltip-top {
padding: .25em 0; .p-tooltip.p-tooltip-top {
} padding: .25em 0;
}
.p-tooltip-top .p-tooltip-arrow {
margin-left: -.25rem; .p-tooltip-top .p-tooltip-arrow {
border-width: .25em .25em 0; margin-left: -.25rem;
} border-width: .25em .25em 0;
}
.p-tooltip-bottom .p-tooltip-arrow {
margin-left: -.25rem; .p-tooltip-bottom .p-tooltip-arrow {
border-width: 0 .25em .25rem; margin-left: -.25rem;
border-width: 0 .25em .25rem;
}
} }
`; `;

View File

@ -3,86 +3,88 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-tree-container { @layer primevue {
margin: 0; .p-tree-container {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
overflow: auto; list-style-type: none;
} overflow: auto;
}
.p-treenode-children {
margin: 0; .p-treenode-children {
padding: 0; margin: 0;
list-style-type: none; padding: 0;
} list-style-type: none;
}
.p-tree-wrapper {
overflow: auto; .p-tree-wrapper {
} overflow: auto;
}
.p-treenode-selectable {
cursor: pointer; .p-treenode-selectable {
user-select: none; cursor: pointer;
} user-select: none;
}
.p-tree-toggler {
cursor: pointer; .p-tree-toggler {
user-select: none; cursor: pointer;
display: inline-flex; user-select: none;
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
overflow: hidden; justify-content: center;
position: relative; overflow: hidden;
flex-shrink: 0; position: relative;
} flex-shrink: 0;
}
.p-treenode-leaf > .p-treenode-content .p-tree-toggler {
visibility: hidden; .p-treenode-leaf > .p-treenode-content .p-tree-toggler {
} visibility: hidden;
}
.p-treenode-content {
display: flex; .p-treenode-content {
align-items: center; display: flex;
} align-items: center;
}
.p-tree-filter {
width: 100%; .p-tree-filter {
} width: 100%;
}
.p-tree-filter-container {
position: relative; .p-tree-filter-container {
display: block; position: relative;
width: 100%; display: block;
} width: 100%;
}
.p-tree-filter-icon {
position: absolute; .p-tree-filter-icon {
top: 50%; position: absolute;
margin-top: -0.5rem; top: 50%;
} margin-top: -0.5rem;
}
.p-tree-loading {
position: relative; .p-tree-loading {
min-height: 4rem; position: relative;
} min-height: 4rem;
}
.p-tree .p-tree-loading-overlay {
position: absolute; .p-tree .p-tree-loading-overlay {
z-index: 1; position: absolute;
display: flex; z-index: 1;
align-items: center; display: flex;
justify-content: center; align-items: center;
} justify-content: center;
}
.p-tree-flex-scrollable {
display: flex; .p-tree-flex-scrollable {
flex: 1; display: flex;
height: 100%; flex: 1;
flex-direction: column; height: 100%;
} flex-direction: column;
}
.p-tree-flex-scrollable .p-tree-wrapper {
flex: 1; .p-tree-flex-scrollable .p-tree-wrapper {
flex: 1;
}
} }
`; `;

View File

@ -3,55 +3,57 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-treeselect { @layer primevue {
display: inline-flex; .p-treeselect {
cursor: pointer; display: inline-flex;
user-select: none; cursor: pointer;
} user-select: none;
}
.p-treeselect-trigger {
display: flex; .p-treeselect-trigger {
align-items: center; display: flex;
justify-content: center; align-items: center;
flex-shrink: 0; justify-content: center;
} flex-shrink: 0;
}
.p-treeselect-label-container {
overflow: hidden; .p-treeselect-label-container {
flex: 1 1 auto; overflow: hidden;
cursor: pointer; flex: 1 1 auto;
} cursor: pointer;
}
.p-treeselect-label {
display: block; .p-treeselect-label {
white-space: nowrap; display: block;
cursor: pointer; white-space: nowrap;
overflow: hidden; cursor: pointer;
text-overflow: ellipsis; overflow: hidden;
} text-overflow: ellipsis;
}
.p-treeselect-label-empty {
overflow: hidden; .p-treeselect-label-empty {
visibility: hidden; overflow: hidden;
} visibility: hidden;
}
.p-treeselect-token {
cursor: default; .p-treeselect-token {
display: inline-flex; cursor: default;
align-items: center; display: inline-flex;
flex: 0 0 auto; align-items: center;
} flex: 0 0 auto;
}
.p-treeselect .p-treeselect-panel {
min-width: 100%; .p-treeselect .p-treeselect-panel {
} min-width: 100%;
}
.p-treeselect-items-wrapper {
overflow: auto; .p-treeselect-items-wrapper {
} overflow: auto;
}
.p-fluid .p-treeselect {
display: flex; .p-fluid .p-treeselect {
display: flex;
}
} }
`; `;

View File

@ -3,173 +3,175 @@ import BaseComponent from 'primevue/basecomponent';
import { useStyle } from 'primevue/usestyle'; import { useStyle } from 'primevue/usestyle';
const styles = ` const styles = `
.p-treetable { @layer primevue {
position: relative; .p-treetable {
} position: relative;
}
.p-treetable table {
border-collapse: collapse; .p-treetable table {
width: 100%; border-collapse: collapse;
table-layout: fixed; width: 100%;
} table-layout: fixed;
}
.p-treetable .p-sortable-column {
cursor: pointer; .p-treetable .p-sortable-column {
user-select: none; cursor: pointer;
} user-select: none;
}
.p-treetable-responsive-scroll > .p-treetable-wrapper {
overflow-x: auto; .p-treetable-responsive-scroll > .p-treetable-wrapper {
} overflow-x: auto;
}
.p-treetable-responsive-scroll > .p-treetable-wrapper > table,
.p-treetable-auto-layout > .p-treetable-wrapper > table { .p-treetable-responsive-scroll > .p-treetable-wrapper > table,
table-layout: auto; .p-treetable-auto-layout > .p-treetable-wrapper > table {
} table-layout: auto;
}
.p-treetable-hoverable-rows .p-treetable-tbody > tr {
cursor: pointer; .p-treetable-hoverable-rows .p-treetable-tbody > tr {
} cursor: pointer;
}
.p-treetable-toggler {
cursor: pointer; .p-treetable-toggler {
user-select: none; cursor: pointer;
display: inline-flex; user-select: none;
align-items: center; display: inline-flex;
justify-content: center; align-items: center;
vertical-align: middle; justify-content: center;
overflow: hidden; vertical-align: middle;
position: relative; overflow: hidden;
} position: relative;
}
.p-treetable-toggler + .p-checkbox {
vertical-align: middle; .p-treetable-toggler + .p-checkbox {
} vertical-align: middle;
}
.p-treetable-toggler + .p-checkbox + span {
vertical-align: middle; .p-treetable-toggler + .p-checkbox + span {
} vertical-align: middle;
}
/* Resizable */
.p-treetable-resizable > .p-treetable-wrapper { /* Resizable */
overflow-x: auto; .p-treetable-resizable > .p-treetable-wrapper {
} overflow-x: auto;
}
.p-treetable-resizable .p-treetable-thead > tr > th,
.p-treetable-resizable .p-treetable-tfoot > tr > td, .p-treetable-resizable .p-treetable-thead > tr > th,
.p-treetable-resizable .p-treetable-tbody > tr > td { .p-treetable-resizable .p-treetable-tfoot > tr > td,
overflow: hidden; .p-treetable-resizable .p-treetable-tbody > tr > td {
} overflow: hidden;
}
.p-treetable-resizable .p-resizable-column:not(.p-frozen-column) {
background-clip: padding-box; .p-treetable-resizable .p-resizable-column:not(.p-frozen-column) {
position: relative; background-clip: padding-box;
} position: relative;
}
.p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
display: none; .p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {
} display: none;
}
.p-treetable .p-column-resizer {
display: block; .p-treetable .p-column-resizer {
position: absolute !important; display: block;
top: 0; position: absolute !important;
right: 0; top: 0;
margin: 0; right: 0;
width: 0.5rem; margin: 0;
height: 100%; width: 0.5rem;
padding: 0px; height: 100%;
cursor: col-resize; padding: 0px;
border: 1px solid transparent; cursor: col-resize;
} border: 1px solid transparent;
}
.p-treetable .p-column-resizer-helper {
width: 1px; .p-treetable .p-column-resizer-helper {
position: absolute; width: 1px;
z-index: 10; position: absolute;
display: none; z-index: 10;
} display: none;
}
.p-treetable .p-treetable-loading-overlay {
position: absolute; .p-treetable .p-treetable-loading-overlay {
display: flex; position: absolute;
align-items: center; display: flex;
justify-content: center; align-items: center;
z-index: 2; justify-content: center;
} z-index: 2;
}
/* Scrollable */
.p-treetable-scrollable .p-treetable-wrapper { /* Scrollable */
position: relative; .p-treetable-scrollable .p-treetable-wrapper {
overflow: auto; position: relative;
} overflow: auto;
}
.p-treetable-scrollable .p-treetable-table {
display: block; .p-treetable-scrollable .p-treetable-table {
} display: block;
}
.p-treetable-scrollable .p-treetable-thead,
.p-treetable-scrollable .p-treetable-tbody, .p-treetable-scrollable .p-treetable-thead,
.p-treetable-scrollable .p-treetable-tfoot { .p-treetable-scrollable .p-treetable-tbody,
display: block; .p-treetable-scrollable .p-treetable-tfoot {
} display: block;
}
.p-treetable-scrollable .p-treetable-thead > tr,
.p-treetable-scrollable .p-treetable-tbody > tr, .p-treetable-scrollable .p-treetable-thead > tr,
.p-treetable-scrollable .p-treetable-tfoot > tr { .p-treetable-scrollable .p-treetable-tbody > tr,
display: flex; .p-treetable-scrollable .p-treetable-tfoot > tr {
flex-wrap: nowrap; display: flex;
width: 100%; flex-wrap: nowrap;
} width: 100%;
}
.p-treetable-scrollable .p-treetable-thead > tr > th,
.p-treetable-scrollable .p-treetable-tbody > tr > td, .p-treetable-scrollable .p-treetable-thead > tr > th,
.p-treetable-scrollable .p-treetable-tfoot > tr > td { .p-treetable-scrollable .p-treetable-tbody > tr > td,
display: flex; .p-treetable-scrollable .p-treetable-tfoot > tr > td {
flex: 1 1 0; display: flex;
align-items: center; flex: 1 1 0;
} align-items: center;
}
.p-treetable-scrollable .p-treetable-thead {
position: sticky; .p-treetable-scrollable .p-treetable-thead {
top: 0; position: sticky;
z-index: 1; top: 0;
} z-index: 1;
}
.p-treetable-scrollable .p-treetable-tfoot {
position: sticky; .p-treetable-scrollable .p-treetable-tfoot {
bottom: 0; position: sticky;
z-index: 1; bottom: 0;
} z-index: 1;
}
.p-treetable-scrollable .p-frozen-column {
position: sticky; .p-treetable-scrollable .p-frozen-column {
background: inherit; position: sticky;
} background: inherit;
}
.p-treetable-scrollable th.p-frozen-column {
z-index: 1; .p-treetable-scrollable th.p-frozen-column {
} z-index: 1;
}
.p-treetable-scrollable-both .p-treetable-thead > tr > th,
.p-treetable-scrollable-both .p-treetable-tbody > tr > td, .p-treetable-scrollable-both .p-treetable-thead > tr > th,
.p-treetable-scrollable-both .p-treetable-tfoot > tr > td, .p-treetable-scrollable-both .p-treetable-tbody > tr > td,
.p-treetable-scrollable-horizontal .p-treetable-thead > tr > th .p-treetable-scrollable-horizontal .p-treetable-tbody > tr > td, .p-treetable-scrollable-both .p-treetable-tfoot > tr > td,
.p-treetable-scrollable-horizontal .p-treetable-tfoot > tr > td { .p-treetable-scrollable-horizontal .p-treetable-thead > tr > th .p-treetable-scrollable-horizontal .p-treetable-tbody > tr > td,
flex: 0 0 auto; .p-treetable-scrollable-horizontal .p-treetable-tfoot > tr > td {
} flex: 0 0 auto;
}
.p-treetable-flex-scrollable {
display: flex; .p-treetable-flex-scrollable {
flex-direction: column; display: flex;
height: 100%; flex-direction: column;
} height: 100%;
}
.p-treetable-flex-scrollable .p-treetable-wrapper {
display: flex; .p-treetable-flex-scrollable .p-treetable-wrapper {
flex-direction: column; display: flex;
flex: 1; flex-direction: column;
height: 100%; flex: 1;
height: 100%;
}
} }
`; `;