💄 Adding* the style of the primevue datatable component
This commit is contained in:
Paul Valerie GOMA
parent
88f6ee8fef
commit
b2045352ac
109
src/assets/style/primevue-style/datatable.css
Normal file
109
src/assets/style/primevue-style/datatable.css
Normal file
|
|
@ -0,0 +1,109 @@
|
||||||
|
:root{
|
||||||
|
--p-datatable-paginator-bottom-border-color: var(--p-datatable-border-color);
|
||||||
|
--p-datatable-paginator-bottom-border-width: 0 0 1px 0;
|
||||||
|
--p-datatable-paginator-top-border-color: var(--p-datatable-border-color);
|
||||||
|
--p-datatable-paginator-top-border-width: 0 0 1px 0;
|
||||||
|
--p-datatable-filter-inline-gap: 0.5rem;
|
||||||
|
--p-datatable-filter-constraint-focus-background: var(--p-list-option-focus-background);
|
||||||
|
--p-datatable-filter-constraint-selected-background: var(--p-list-option-selected-background);
|
||||||
|
--p-datatable-filter-constraint-selected-focus-background: var(--p-list-option-selected-focus-background);
|
||||||
|
--p-datatable-filter-constraint-color: var(--p-list-option-color);
|
||||||
|
--p-datatable-filter-constraint-focus-color: var(--p-list-option-focus-color);
|
||||||
|
--p-datatable-filter-constraint-selected-color: var(--p-list-option-selected-color);
|
||||||
|
--p-datatable-filter-constraint-selected-focus-color: var(--p-list-option-selected-focus-color);
|
||||||
|
--p-datatable-filter-constraint-padding: var(--p-list-option-padding);
|
||||||
|
--p-datatable-filter-constraint-border-radius: var(--p-list-option-border-radius);
|
||||||
|
--p-datatable-filter-constraint-separator-border-color: var(--p-content-border-color);
|
||||||
|
--p-datatable-filter-constraint-list-padding: var(--p-list-padding);
|
||||||
|
--p-datatable-filter-constraint-list-gap: var(--p-list-gap);
|
||||||
|
--p-datatable-filter-rule-border-color: var(--p-content-border-color);
|
||||||
|
--p-datatable-filter-overlay-popover-background: var(--p-overlay-popover-background);
|
||||||
|
--p-datatable-filter-overlay-popover-border-color: var(--p-overlay-popover-border-color);
|
||||||
|
--p-datatable-filter-overlay-popover-border-radius: var(--p-overlay-popover-border-radius);
|
||||||
|
--p-datatable-filter-overlay-popover-color: var(--p-overlay-popover-color);
|
||||||
|
--p-datatable-filter-overlay-popover-shadow: var(--p-overlay-popover-shadow);
|
||||||
|
--p-datatable-filter-overlay-popover-padding: var(--p-overlay-popover-padding);
|
||||||
|
--p-datatable-filter-overlay-popover-gap: 0.5rem;
|
||||||
|
--p-datatable-filter-overlay-select-background: var(--p-overlay-select-background);
|
||||||
|
--p-datatable-filter-overlay-select-border-color: var(--p-overlay-select-border-color);
|
||||||
|
--p-datatable-filter-overlay-select-border-radius: var(--p-overlay-select-border-radius);
|
||||||
|
--p-datatable-filter-overlay-select-color: var(--p-overlay-select-color);
|
||||||
|
--p-datatable-filter-overlay-select-shadow: var(--p-overlay-select-shadow);
|
||||||
|
--p-datatable-row-toggle-button-hover-background: var(--datatable-hover-background);
|
||||||
|
--p-datatable-row-toggle-button-selected-hover-background: var(--datatable-background);
|
||||||
|
--p-datatable-row-toggle-button-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-toggle-button-hover-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-toggle-button-selected-hover-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-toggle-button-size: 1.75rem;
|
||||||
|
--p-datatable-row-toggle-button-border-radius: 0px;
|
||||||
|
--p-datatable-row-toggle-button-focus-ring-width: var(--focus-width);
|
||||||
|
--p-datatable-row-toggle-button-focus-ring-style: var(--focus-style);
|
||||||
|
--p-datatable-row-toggle-button-focus-ring-color: var(--focus-color);
|
||||||
|
--p-datatable-row-toggle-button-focus-ring-offset: var(--focus-offset);
|
||||||
|
/* --p-datatable-row-toggle-button-focus-ring-shadow: var(--p-focus-ring-shadow); */
|
||||||
|
--p-datatable-loading-icon-size: 2rem;
|
||||||
|
--p-datatable-sort-icon-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-sort-icon-hover-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-sort-icon-size: 0.875rem;
|
||||||
|
--p-datatable-resize-indicator-width: 1px;
|
||||||
|
--p-datatable-resize-indicator-color: var(--p-primary-color);
|
||||||
|
--p-datatable-column-resizer-width: 0.5rem;
|
||||||
|
--p-datatable-drop-point-color: var(--p-primary-color);
|
||||||
|
--p-datatable-footer-background: var(--datatable-background);
|
||||||
|
--p-datatable-footer-border-color: var(--p-datatable-border-color);
|
||||||
|
--p-datatable-footer-color: var(--p-content-color);
|
||||||
|
--p-datatable-footer-border-width: 0 0 1px 0;
|
||||||
|
--p-datatable-footer-padding: 1rem;
|
||||||
|
--p-datatable-footer-lg-padding: 1.25rem;
|
||||||
|
--p-datatable-footer-sm-padding: 0.5rem;
|
||||||
|
--p-datatable-column-footer-font-weight: 600;
|
||||||
|
--p-datatable-footer-cell-background: var(--datatable-background);
|
||||||
|
--p-datatable-footer-cell-border-color: var(--p-datatable-border-color);
|
||||||
|
--p-datatable-footer-cell-color: var(--p-content-color);
|
||||||
|
--p-datatable-footer-cell-padding: 1rem;
|
||||||
|
--p-datatable-footer-cell-lg-padding: 1.25rem;
|
||||||
|
--p-datatable-footer-cell-sm-padding: 0.5rem;
|
||||||
|
--p-datatable-body-cell-border-color: var(--p-datatable-border-color);
|
||||||
|
--p-datatable-body-cell-padding: 1rem;
|
||||||
|
--p-datatable-body-cell-lg-padding: 1.25rem;
|
||||||
|
--p-datatable-body-cell-sm-padding: 0.5rem;
|
||||||
|
--p-datatable-row-background: var(--datatable-alt-background);
|
||||||
|
--p-datatable-row-hover-background: var(--datatable-hover-background);
|
||||||
|
--p-datatable-row-selected-background: var(--datatable-active-background);
|
||||||
|
--p-datatable-row-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-hover-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-selected-color: var(--datatable-row-color);
|
||||||
|
--p-datatable-row-focus-ring-width: var(--focus-width);
|
||||||
|
--p-datatable-row-focus-ring-style: var(--focus-style);
|
||||||
|
--p-datatable-row-focus-ring-color: var(--focus-color);
|
||||||
|
--p-datatable-row-focus-ring-offset: -1px;
|
||||||
|
/* --p-datatable-row-focus-ring-shadow: var(--p-focus-ring-shadow); */
|
||||||
|
--p-datatable-column-title-font-weight: var(--text-body-SM-detail-text-Bold-weight);
|
||||||
|
--p-datatable-header-cell-background: var(--datatable-background);
|
||||||
|
--p-datatable-header-cell-hover-background: var(--datatable-hover-background);
|
||||||
|
--p-datatable-header-cell-selected-background: var(--datatable-active-background);
|
||||||
|
--p-datatable-header-cell-border-color: var(--border-plain-grey);
|
||||||
|
--p-datatable-header-cell-color: var(--datatable-header-cell-color);
|
||||||
|
--p-datatable-header-cell-hover-color: var(--datatable-header-cell-color);
|
||||||
|
--p-datatable-header-cell-selected-color: var(--datatable-header-cell-color);
|
||||||
|
--p-datatable-header-cell-gap: 0.5rem;
|
||||||
|
--p-datatable-header-cell-padding: 1rem;
|
||||||
|
--p-datatable-header-cell-lg-padding: 1.25rem;
|
||||||
|
--p-datatable-header-cell-sm-padding: 0.5rem;
|
||||||
|
--p-datatable-header-cell-focus-ring-width: var(--focus-width);
|
||||||
|
--p-datatable-header-cell-focus-ring-style: var(--focus-style);
|
||||||
|
--p-datatable-header-cell-focus-ring-color: var(--focus-color);
|
||||||
|
--p-datatable-header-cell-focus-ring-offset: -1px;
|
||||||
|
/* --p-datatable-header-cell-focus-ring-shadow: var(--p-focus-ring-shadow); */
|
||||||
|
--p-datatable-header-background: var(--datatable-background);
|
||||||
|
--p-datatable-header-border-color: var(--border-default-grey);
|
||||||
|
--p-datatable-header-color: var(--datatable-header-cell-color);
|
||||||
|
--p-datatable-header-border-width: 0 0 1px 0;
|
||||||
|
--p-datatable-header-padding: 1rem;
|
||||||
|
--p-datatable-header-lg-padding: 1.25rem;
|
||||||
|
--p-datatable-header-sm-padding: 0.5rem;
|
||||||
|
/* --p-datatable-transition-duration: var(--p-transition-duration); */
|
||||||
|
--p-datatable-body-cell-selected-border-color: var(--datatable-active-background);
|
||||||
|
--p-datatable-row-striped-background: var(--datatable-background);
|
||||||
|
--p-datatable-border-color: var(--p-content-border-color);
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user