vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Migrated Data Components

pull/5507/head
Cagatay Civici 2024-03-13 14:13:29 +03:00
parent 02104cea25
commit c828680c69
17 changed files with 363 additions and 356 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
components/lib/themes/primeone/base/datatable/index.js
View File

@ -22,7 +22,7 @@ export default {
}
.p-datatable .p-sortable-column .p-sortable-column-icon {
color: var(--p-datatable-sort-icon-color);
color: ${dt('datatable.sort.icon.color')};
margin-left: 0.5rem;
transition: color ${dt('transition.duration')};
}
@ -39,17 +39,17 @@ export default {
}
.p-datatable .p-sortable-column:not(.p-highlight):hover {
background: var(--p-datatable-header-cell-background-hover);
color: var(--p-datatable-header-cell-text-color-hover);
background: ${dt('datatable.header.cell.hover.background')};
color: ${dt('datatable.header.cell.hover.color')};
}
.p-datatable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
color: var(--p-datatable-sort-icon-color-hover);
color: ${dt('datatable.sort.icon.hover.color')};
}
.p-datatable .p-sortable-column.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-datatable .p-sortable-column:focus-visible {
@ -58,7 +58,7 @@ export default {
}
.p-datatable .p-sortable-column.p-highlight .p-sortable-column-icon {
color: var(--p-highlight-text-color);
color: ${dt('highlight.color')};
}
.p-datatable-hoverable-rows .p-selectable-row {
@ -95,12 +95,12 @@ export default {
.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-thead,
.p-datatable-scrollable > .p-datatable-wrapper > .p-virtualscroller > .p-datatable-table > .p-datatable-thead {
background: var(--p-datatable-header-cell-background);
background: ${dt('datatable.header.cell.background')};
}
.p-datatable-scrollable > .p-datatable-wrapper > .p-datatable-table > .p-datatable-tfoot,
.p-datatable-scrollable > .p-datatable-wrapper > .p-virtualscroller > .p-datatable-table > .p-datatable-tfoot {
background: var(--p-datatable-footer-cell-background);
background: ${dt('datatable.footer.cell.background')};
}
.p-datatable-flex-scrollable {
@ -161,7 +161,7 @@ export default {
position: absolute;
z-index: 10;
display: none;
background: var(--p-datatable-resizer-color);
background: ${dt('datatable.resizer.color')};
}
.p-datatable .p-row-toggler,
@ -175,7 +175,7 @@ export default {
position: relative;
width: 1.75rem;
height: 1.75rem;
color: var(--p-datatable-row-action-color);
color: ${dt('datatable.row.action.color')};
border: 0 none;
border-radius: 50%;
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
@ -186,8 +186,8 @@ export default {
.p-datatable .p-row-editor-init:enabled:hover,
.p-datatable .p-row-editor-save:enabled:hover,
.p-datatable .p-row-editor-cancel:enabled:hover {
color: var(--p-datatable-row-action-color-hover);
background: var(--p-datatable-row-action-background-hover);
color: ${dt('datatable.row.action.hover.color')};
background: ${dt('datatable.row.action.hover.background')};
}
.p-datatable .p-row-toggler:focus-visible,
@ -206,7 +206,7 @@ export default {
.p-datatable-tbody > tr.p-highlight .p-row-editor-init:hover,
.p-datatable-tbody > tr.p-highlight .p-row-editor-save:hover,
.p-datatable-tbody > tr.p-highlight .p-row-editor-cancel:hover {
background: var(--p-datatable-row-action-background-hover-highlight);
background: ${dt('datatable.row.action.highlight.hover.background')};
color: inherit;
}
@ -251,7 +251,7 @@ export default {
position: relative;
width: 1.75rem;
height: 1.75rem;
color: var(--p-datatable-filter-menu-button-text-color);
color: ${dt('datatable.fiter.menu.button.color')};
border: 0 none;
background: transparent;
border-radius: 50%;
@ -260,20 +260,20 @@ export default {
}
.p-column-filter-menu-button:hover {
background: var(--p-datatable-filter-menu-button-background-hover);
color: var(--p-datatable-filter-menu-button-text-color-hover);
background: ${dt('datatable.fiter.menu.button.hover.background')};
color: ${dt('datatable.fiter.menu.button.hover.color')};
}
.p-column-filter-menu-button.p-column-filter-menu-button-open,
.p-column-filter-menu-button.p-column-filter-menu-button-open:hover {
background: var(--p-datatable-filter-menu-button-background-open);
color: var(--p-datatable-filter-menu-button-text-color-open);
background: ${dt('datatable.fiter.menu.button.open.background')};
color: ${dt('datatable.fiter.menu.button.open.color')};
}
.p-column-filter-menu-button.p-column-filter-menu-button-active,
.p-column-filter-menu-button.p-column-filter-menu-button-active:hover {
background: var(--p-datatable-filter-menu-button-background-active);
color: var(--p-datatable-filter-menu-button-text-color-active);
background: ${dt('datatable.fiter.menu.button.active.background')};
color: ${dt('datatable.fiter.menu.button.active.color')};
}
.p-column-filter-menu-button:focus-visible {
@ -291,7 +291,7 @@ export default {
position: relative;
width: 1.75rem;
height: 1.75rem;
color: var(--p-datatable-filter-clear-button-text-color);
color: ${dt('datatable.fiter.clear.button.color')};
border: 0 none;
background: transparent;
border-radius: 50%;
@ -300,8 +300,8 @@ export default {
}
.p-column-filter-clear-button:hover {
background: var(--p-datatable-filter-clear-button-background-hover);
color: var(--p-datatable-filter-clear-button-text-color-hover);
background: ${dt('datatable.fiter.clear.button.hover.background')};
color: ${dt('datatable.fiter.clear.button.hover.color')};
}
.p-column-filter-clear-button:focus-visible {
@ -326,7 +326,7 @@ export default {
.p-column-filter-constraint {
padding: 0;
border-bottom: 1px solid var(--p-datatable-filter-constraint-border-color);
border-bottom: 1px solid ${dt('datatable.fiter.contstraint.border.color')};
}
.p-column-filter-constraint:last-child {
@ -346,9 +346,9 @@ export default {
}
.p-column-filter-overlay-menu {
background: var(--p-datatable-filter-overlay-background);
color: var(--p-datatable-filter-overlay-text-color);
border: 1px solid var(--p-datatable-filter-overlay-border-color);
background: ${dt('datatable.fiter.overlay.background')};
color: ${dt('datatable.fiter.overlay.color')};
border: 1px solid ${dt('datatable.fiter.overlay.border.color')};
border-radius: ${dt('rounded.base')};
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
min-width: 12.5rem;
@ -409,18 +409,18 @@ export default {
}
.p-datatable-header {
background: var(--p-datatable-header-background);
color: var(--p-datatable-header-text-color);
border: 1px solid var(--p-datatable-header-border-color);
background: ${dt('datatable.header.background')};
color: ${dt('datatable.header.color')};
border: 1px solid ${dt('datatable.header.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;
}
.p-datatable-footer {
background: var(--p-datatable-header-background);
color: var(--p-datatable-header-text-color);
border: 1px solid var(--p-datatable-header-border-color);
background: ${dt('datatable.footer.background')};
color: ${dt('datatable.footer.color')};
border: 1px solid ${dt('datatable.footer.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;
@ -429,44 +429,44 @@ export default {
.p-datatable-thead > tr > th {
text-align: left;
padding: 0.75rem 1rem;
background: var(--p-datatable-header-cell-background);
border: 1px solid var(--p-datatable-header-cell-border-color);
background: ${dt('datatable.header.cell.background')};
border: 1px solid ${dt('datatable.header.cell.border.color')};
border-width: 0 0 1px 0;
color: var(--p-datatable-header-cell-text-color);
color: ${dt('datatable.header.cell.color')};
font-weight: 600;
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
.p-datatable-tbody > tr {
outline-color: transparent;
background: var(--p-datatable-row-background);
color: var(--p-datatable-row-text-color);
background: ${dt('datatable.row.background')};
color: ${dt('datatable.row.color')};
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
.p-datatable-tbody > tr > td {
text-align: left;
border: 1px solid var(--p-datatable-body-cell-border-color);
border: 1px solid ${dt('datatable.body.cell.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
}
.p-datatable-hoverable-rows .p-datatable-tbody > tr:not(.p-highlight):hover {
background: var(--p-datatable-row-background-hover);
color: var(--p-datatable-row-text-color-hover);
background: ${dt('datatable.row.hover.background')};
color: ${dt('datatable.row.hover.color')};
}
.p-datatable-tbody > tr.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-datatable-tbody > tr:has(+ .p-highlight) > td {
border-bottom-color: var(--p-datatable-body-cell-border-color-selected);
border-bottom-color: ${dt('datatable.body.cell.selected.border.color')};
}
.p-datatable-tbody > tr.p-highlight > td {
border-bottom-color: var(--p-datatable-body-cell-border-color-selected);
border-bottom-color: ${dt('datatable.body.cell.selected.border.color')};
}
.p-datatable-tbody > tr:focus-visible {
@ -482,19 +482,19 @@ export default {
.p-datatable-tfoot > tr > td {
text-align: left;
padding: 0.75rem 1rem;
border: 1px solid var(--p-datatable-footer-cell-border-color);
border: 1px solid ${dt('datatable.footer.cell.border.color')};
border-width: 0 0 1px 0;
font-weight: 600;
color: var(--p-datatable-footer-cell-text-color);
background: var(--p-datatable-footer-cell-background);
color: ${dt('datatable.footer.cell.color')};
background: ${dt('datatable.footer.cell.background')};
}
.p-datatable-tbody > tr.p-datatable-dragpoint-top > td {
box-shadow: inset 0 2px 0 0 var(--p-datatable-drop-point-color);
box-shadow: inset 0 2px 0 0 ${dt('datatable.drop.point.color')};
}
.p-datatable-tbody>tr.p-datatable-dragpoint-bottom > td {
box-shadow: inset 0 -2px 0 0 var(--p-datatable-drop-point-color);
box-shadow: inset 0 -2px 0 0 ${dt('datatable.drop.point.color')};
}
.p-datatable-loading-icon {
@ -576,12 +576,12 @@ export default {
}
.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
background: var(--p-datatable-row-background-striped);
background: ${dt('datatable.row.striped.background')});
}
.p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')});
color: ${dt('highlight.color')});
}
.p-datatable.p-datatable-sm .p-datatable-header {

16
components/lib/themes/primeone/base/dataview/index.js
View File

@ -11,25 +11,25 @@ export default {
}
.p-dataview-header {
background: var(--p-dataview-header-background);
color: var(--p-dataview-header-text-color);
border: 1px solid var(--p-dataview-header-border-color);
background: ${dt('dataview.header.background')};
color: ${dt('dataview.header.color')};
border: 1px solid ${dt('dataview.header.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;
}
.p-dataview-content {
background: var(--p-dataview-content-background);
color: var(--p-dataview-content-text-color);
background: ${dt('dataview.content.background')};
color: ${dt('dataview.content.color')};
border: 0 none;
padding: 0;
}
.p-dataview-footer {
background: var(--p-dataview-footer-background);
color: var(--p-dataview-footer-text-color);
border: 1px solid var(--p-dataview-footer-border-color);
background: ${dt('dataview.footer.background')};
color: ${dt('dataview.footer.color')};
border: 1px solid ${dt('dataview.footer.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;

46
components/lib/themes/primeone/base/orderlist/index.js
View File

@ -14,13 +14,13 @@ export default {
.p-orderlist-list-container {
flex: 1 1 auto;
background: var(--p-orderlist-list-background);
border: 1px solid var(--p-orderlist-list-border-color);
background: ${dt('orderlist.list.background')};
border: 1px solid ${dt('orderlist.list.border.color')};
border-radius: ${dt('rounded.base')};
}
.p-orderlist .p-orderlist-header {
color: var(--p-orderlist-header-text-color);
color: ${dt('orderlist.header.color')};
border: 0 none;
padding: 0.75rem 1rem 0.5rem 1rem;
font-weight: 600;
@ -45,8 +45,8 @@ export default {
margin: 2px 0;
border-radius: ${dt('rounded.base')};
border: 0 none;
color: var(--p-orderlist-item-text-color);
background: var(--p-orderlist-item-background);
color: ${dt('orderlist.item.color')};
background: ${dt('orderlist.item.background')};
outline-color: transparent;
transition: transform ${dt('transition.duration')}, background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
@ -60,47 +60,47 @@ export default {
}
.p-orderlist-item:not(.p-highlight):hover {
color: var(--p-orderlist-item-text-color-focus);
background: var(--p-orderlist-item-background-focus);
color: ${dt('orderlist.item.focus.color')};
background: ${dt('orderlist.item.focus.background')};
}
.p-orderlist-item.p-focus {
color: var(--p-orderlist-item-text-color-focus);
background: var(--p-orderlist-item-background-focus);
color: ${dt('orderlist.item.focus.color')};
background: ${dt('orderlist.item.focus.background')};
}
.p-orderlist-item.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
color: ${dt('highlight.color')};
background: ${dt('highlight.background')};
}
.p-orderlist-item.p-highlight.p-focus {
background: var(--p-highlight-background-focus);
color: var(--p-highlight-text-color-focus);
color: ${dt('highlight.focus.color')};
background: ${dt('highlight.focus.background')};
}
.p-orderlist-controls .p-button {
background: var(--p-orderlist-control-background);
border: 1px solid var(--p-orderlist-control-border-color);
color: var(--p-order-listcontrol-text-color);
background: ${dt('orderlist.control.background')};
border: 1px solid ${dt('orderlist.control.border.color')};
color: ${dt('orderlist.control.color')};
outline-color: transparent;
transition: opacity ${dt('transition.duration')}, outline-color ${dt('transition.duration')}, background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')};
}
.p-orderlist-controls .p-button:not(:disabled):hover {
background: var(--p-orderlist-control-background-hover);
border: 1px solid var(--p-orderlist-control-border-color-hover);
color: var(--p-order-listcontrol-text-color-hover);
background: ${dt('orderlist.control.hover.background')};
border: 1px solid ${dt('orderlist.control.hover.border.color')};
color: ${dt('orderlist.control.hover.color')};
}
.p-orderlist-controls .p-button:not(:disabled):active {
background: var(--p-orderlist-control-background-active);
border: 1px solid var(--p-orderlist-control-border-color-active);
color: var(--p-order-listcontrol-text-color-active);
background: ${dt('orderlist.control.active.background')};
border: 1px solid ${dt('orderlist.control.active.border.color')};
color: ${dt('orderlist.control.hover.active')};
}
.p-orderlist-controls .p-button:focus-visible {
outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} var(--p-button-primary-background);
outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} ${dt('focus.ring.color')};
outline-offset: ${dt('focus.ring.offset')};
}
`

30
components/lib/themes/primeone/base/organizationchart/index.js
View File

@ -15,9 +15,9 @@ export default {
.p-organizationchart-node-content {
display: inline-block;
position: relative;
border: 1px solid var(--p-organizationchart-node-border-color);
background: var(--p-organizationchart-node-background);
color: var(--p-organizationchart-node-text-color);
border: 1px solid ${dt('organizationchart.node.border.color')};
background: ${dt('organizationchart.node.background')};
color: ${dt('organizationchart.node.color')};
padding: 0.75rem 1rem;
border-radius: ${dt('rounded.base')};
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')};
@ -28,13 +28,13 @@ export default {
}
.p-organizationchart-node-content.p-organizationchart-selectable-node:not(.p-highlight):hover {
background: var(--p-organizationchart-node-background-hover);
color: var(--p-organizationchart-node-text-color-hover);
background: ${dt('organizationchart.node.hover.background')};
color: ${dt('organizationchart.node.hover.color')};
}
.p-organizationchart-node-content.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-organizationchart-node-content .p-node-toggler {
@ -48,10 +48,10 @@ export default {
width: 1.5rem;
height: 1.5rem;
text-decoration: none;
background: var(--p-organizationchart-toggle-icon-background);
color: var(--p-organizationchart-toggle-icon-color);
background: ${dt('organizationchart.toggle.icon.background')};
color: ${dt('organizationchart.toggle.icon.color')};
border-radius: 50%;
border: 1px solid var(--p-organizationchart-toggle-icon-border-color);
border: 1px solid ${dt('organizationchart.toggle.icon.border.color')};
display: inline-flex;
justify-content: center;
align-items: center;
@ -73,22 +73,22 @@ export default {
margin: 0 auto;
height: 20px;
width: 1px;
background: var(--p-organizationchart-connector-color);
background: ${dt('organizationchart.connector.color')};
}
.p-organizationchart-line-right {
border-radius: 0;
border-left: 1px solid var(--p-organizationchart-connector-color);
border-left: 1px solid ${dt('organizationchart.connector.color')};
border-top-left-radius: ${dt('rounded.base')};
}
.p-organizationchart-line-left {
border-radius: 0;
border-right: 1px solid var(--p-organizationchart-connector-color);
border-right: 1px solid ${dt('organizationchart.connector.color')};
}
.p-organizationchart-line-top {
border-top: 1px solid var(--p-organizationchart-connector-color);
border-top: 1px solid ${dt('organizationchart.connector.color')};
}
.p-organizationchart-selectable-node {
@ -104,7 +104,7 @@ export default {
}
.p-organizationchart-lines :nth-child(1 of .p-organizationchart-line-right) {
border-left: 1px solid var(--p-organizationchart-connector-color);
border-left: 1px solid ${dt('organizationchart.connector.color')};
border-top-left-radius: ${dt('rounded.base')};
}
`

16
components/lib/themes/primeone/base/paginator/index.js
View File

@ -5,8 +5,8 @@ export default {
align-items: center;
justify-content: center;
flex-wrap: wrap;
background: var(--p-paginator-background);
color: var(--p-paginator-text-color);
background: ${dt('paginator.background')};
color: ${dt('paginator.color')};
border: 0 none;
padding: 0.5rem 1rem;
border-radius: ${dt('rounded.base')};
@ -36,7 +36,7 @@ export default {
position: relative;
background: transparent;
border: 0 none;
color: var(--p-paginator-navigator-color);
color: ${dt('paginator.navigator.color')};
min-width: 2.5rem;
height: 2.5rem;
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
@ -48,12 +48,12 @@ export default {
.p-paginator-prev:not(.p-disabled):hover,
.p-paginator-next:not(.p-disabled):hover,
.p-paginator-last:not(.p-disabled):hover {
background: var(--p-paginator-navigator-background-hover);
color: var(--p-paginator-navigator-color-hover);
background: ${dt('paginator.navigator.hover.background')};
color: ${dt('paginator.navigator.hover.color')};
}
.p-paginator-current {
color: var(--p-paginator-current-page-report-text-color);
color: ${dt('paginator.current.page.report.color')};
}
.p-paginator-pages {
@ -63,8 +63,8 @@ export default {
}
.p-paginator-page.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-paginator-page-input .p-inputtext {

48
components/lib/themes/primeone/base/picklist/index.js
View File

@ -14,13 +14,13 @@ export default {
.p-picklist-list-wrapper {
flex: 1 1 50%;
background: var(--p-picklist-list-background);
border: 1px solid var(--p-picklist-list-border-color);
border-radius: var(--p-picklist-base);
background: ${dt('picklist.list.background')};
border: 1px solid ${dt('picklist.list.border.color')};
border-radius: ${dt('rounded.base')};
}
.p-picklist .p-picklist-header {
color: var(--p-picklist-header-text-color);
color: ${dt('picklist.header.color')};
border: 0 none;
padding: 0.75rem 1rem 0.5rem 1rem;
font-weight: 600;
@ -45,8 +45,8 @@ export default {
margin: 2px 0;
border-radius: ${dt('rounded.base')};
border: 0 none;
color: var(--p-picklist-item-text-color);
background: var(--p-picklist-item-background);
color: ${dt('picklist.item.color')};
background: ${dt('picklist.item.background')};
outline-color: transparent;
transition: transform ${dt('transition.duration')}, background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
@ -60,47 +60,47 @@ export default {
}
.p-picklist-item:not(.p-highlight):hover {
color: var(--p-picklist-item-text-color-focus);
background: var(--p-picklist-item-background-focus);
color: ${dt('picklist.item.focus.color')};
background: ${dt('picklist.item.focus.background')};
}
.p-picklist-item.p-focus {
color: var(--p-picklist-item-text-color-focus);
background: var(--p-picklist-item-background-focus);
color: ${dt('picklist.item.focus.color')};
background: ${dt('picklist.item.focus.background')};
}
.p-picklist-item.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
color: ${dt('highlight.color')};
background: ${dt('highlight.background')};
}
.p-picklist-item.p-highlight.p-focus {
background: var(--p-highlight-background-focus);
color: var(--p-highlight-text-color-focus);
color: ${dt('highlight.focus.color')};
background: ${dt('highlight.focus.background')};
}
.p-picklist-buttons .p-button {
background: var(--p-picklist-control-background);
border: 1px solid var(--p-picklist-control-border-color);
color: var(--p-order-listcontrol-text-color);
background: ${dt('picklist.control.background')};
border: 1px solid ${dt('picklist.control.border.color')};
color: ${dt('picklist.control.color')};
outline-color: transparent;
transition: opacity ${dt('transition.duration')}, outline-color ${dt('transition.duration')}, background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')};
}
.p-picklist-buttons .p-button:not(:disabled):hover {
background: var(--p-picklist-control-background-hover);
border: 1px solid var(--p-picklist-control-border-color-hover);
color: var(--p-order-listcontrol-text-color-hover);
background: ${dt('picklist.control.hover.background')};
border: 1px solid ${dt('picklist.control.hover.border.color')};
color: ${dt('picklist.control.hover.color')};
}
.p-picklist-buttons .p-button:not(:disabled):active {
background: var(--p-picklist-control-background-active);
border: 1px solid var(--p-picklist-control-border-color-active);
color: var(--p-order-listcontrol-text-color-active);
background: ${dt('picklist.control.active.background')};
border: 1px solid ${dt('picklist.control.active.border.color')};
color: ${dt('picklist.control.active.color')};
}
.p-picklist-buttons .p-button:focus-visible {
outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} var(--p-button-primary-background);
outline: ${dt('focus.ring.width')} ${dt('focus.ring.style')} ${dt('focus.ring.color')};
outline-offset: ${dt('focus.ring.offset')};
}
`

8
components/lib/themes/primeone/base/timeline/index.js
View File

@ -88,11 +88,11 @@ export default {
justify-content: center;
position: relative;
align-self: baseline;
border: 2px solid var(--p-timeline-marker-border-color);
border: 2px solid ${dt('timeline.marker.border.color')};
border-radius: 50%;
width: 1.125rem;
height: 1.125rem;
background-color: var(--p-timeline-marker-background);
background-color: ${dt('timeline.marker.background')};
}
.p-timeline-event-marker::before {
@ -100,7 +100,7 @@ export default {
border-radius: 50%;
width: 0.375rem;
height: 0.375rem;
background-color: var(--p-timeline-marker-content-color);
background: ${dt('timeline.marker.content.color')};
}
.p-timeline-event-marker::after {
@ -114,7 +114,7 @@ export default {
.p-timeline-event-connector {
flex-grow: 1;
background-color: var(--p-timeline-connector-color);
background-color: ${dt('timeline.connector.color')};
}
.p-timeline-horizontal {

30
components/lib/themes/primeone/base/tree/index.js
View File

@ -1,8 +1,8 @@
export default {
css: ({ dt }) => `
.p-tree {
background: var(--p-tree-background);
color: var(--p-tree-text-color);
background: ${dt('tree.background')};
color: ${dt('tree.color')};
border-radius: ${dt('rounded.base')};
border: 0 none;
padding: 1rem;
@ -35,7 +35,7 @@ export default {
display: flex;
align-items: center;
outline-color: transparent;
color: var(--p-tree-node-text-color);
color: ${dt('tree.node.color')};
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
@ -45,8 +45,8 @@ export default {
}
.p-treenode-content.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-tree-toggler {
@ -61,7 +61,7 @@ export default {
margin-right: 0.5rem;
width: 1.75rem;
height: 1.75rem;
color: var(--p-tree-toggle-color);
color: ${dt('tree.toggle.color')};
border: 0 none;
background: transparent;
border-radius: 50%;
@ -70,8 +70,8 @@ export default {
}
.p-tree-toggler:enabled:hover {
background: var(--p-tree-toggle-background-hover);
color: var(--p-tree-toggle-color-hover);
background: ${dt('tree.toggle.hover.background')};
color: ${dt('tree.toggle.hover.color')};
}
.p-treenode-content.p-highlight .p-tree-toggler,
@ -80,20 +80,20 @@ export default {
}
.p-treenode-content.p-highlight .p-tree-toggler:hover {
background: var(--p-tree-toggle-background-hover-highlight);
background: ${dt('tree.toggle.highlight.hover.background')};
}
.p-treenode-content.p-treenode-selectable:not(.p-highlight):hover {
background: var(--p-tree-node-background-hover);
color: var(--p-tree-node-text-color-hover);
background: ${dt('tree.node.hover.background')};
color: ${dt('tree.node.hover.color')};
}
.p-treenode-content.p-treenode-selectable:not(.p-highlight):hover .p-tree-toggler {
color: var(--p-tree-toggle-color-hover);
color: ${dt('tree.toggle.hover.color')};
}
.p-treenode-content.p-treenode-selectable:not(.p-highlight):hover .p-treenode-icon {
color: var(--p-tree-node-icon-color-hover);
color: ${dt('tree.icon.hover.color')};
}
.p-treenode-children {
@ -118,7 +118,7 @@ export default {
.p-treenode-icon {
margin-right: 0.5rem;
color: var(--p-tree-node-icon-color);
color: ${dt('tree.icon.color')};
transition: color ${dt('transition.duration')};
}
@ -127,7 +127,7 @@ export default {
}
.p-treenode-content .p-checkbox.p-indeterminate .p-checkbox-icon {
color: var(--p-tree-indeterminate-color);
color: ${dt('tree.indeterminate.color')};
}
.p-tree-filter {

74
components/lib/themes/primeone/base/treetable/index.js
View File

@ -23,7 +23,7 @@ export default {
}
.p-treetable .p-sortable-column .p-sortable-column-icon {
color: var(--p-treetable-sort-icon-color);
color: ${dt('treetable.sort.icon.color')};
margin-left: 0.5rem;
transition: color ${dt('transition.duration')};
}
@ -40,17 +40,17 @@ export default {
}
.p-treetable .p-sortable-column:not(.p-highlight):hover {
background: var(--p-treetable-header-cell-background-hover);
color: var(--p-treetable-header-cell-text-color-hover);
background: ${dt('treetable.header.cell.hover.background')};
color: ${dt('treetable.header.cell.hover.color')};
}
.p-treetable .p-sortable-column:not(.p-highlight):hover .p-sortable-column-icon {
color: var(--p-treetable-sort-icon-color-hover);
color: ${dt('treetable.sort.icon.hover.color')};
}
.p-treetable .p-sortable-column.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-treetable .p-sortable-column:focus-visible {
@ -59,7 +59,7 @@ export default {
}
.p-treetable .p-sortable-column.p-highlight .p-sortable-column-icon {
color: var(--p-highlight-text-color);
color: ${dt('highlight.color')};
}
.p-treetable-responsive-scroll > .p-treetable-wrapper {
@ -112,7 +112,7 @@ export default {
position: absolute;
z-index: 10;
display: none;
background: var(--p-treetable-resizer-color);
background: ${dt('treetable.resizer.color')};
}
.p-treetable .p-treetable-loading-overlay {
@ -200,11 +200,11 @@ export default {
}
.p-treetable .p-treetable-scrollable-header {
background: var(--p-treetable-header-background);
background: ${dt('treetable.header.background')};
}
.p-treetable .p-treetable-scrollable-footer {
background: var(--p-treetable-footer-background);
background: ${dt('treetable.footer.background')};
}
.p-treetable .p-paginator-top {
@ -218,18 +218,18 @@ export default {
}
.p-treetable-header {
background: var(--p-treetable-header-background);
color: var(--p-treetable-header-text-color);
border: 1px solid var(--p-treetable-header-border-color);
background: ${dt('treetable.header.background')};
color: ${dt('treetable.header.color')};
border: 1px solid ${dt('treetable.header.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;
}
.p-treetable-footer {
background: var(--p-treetable-header-background);
color: var(--p-treetable-header-text-color);
border: 1px solid var(--p-treetable-header-border-color);
background: ${dt('treetable.footer.background')};
color: ${dt('treetable.footer.color')};
border: 1px solid ${dt('treetable.footer.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
font-weight: 600;
@ -238,44 +238,44 @@ export default {
.p-treetable-thead > tr > th {
text-align: left;
padding: 0.75rem 1rem;
background: var(--p-treetable-header-cell-background);
border: 1px solid var(--p-treetable-header-cell-border-color);
background: ${dt('treetable.header.cell.background')};
border: 1px solid ${dt('treetable.header.cell.border.color')};
border-width: 0 0 1px 0;
color: var(--p-treetable-header-cell-text-color);
color: ${dt('treetable.header.cell.color')});
font-weight: 600;
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
.p-treetable-tbody > tr {
outline-color: transparent;
background: var(--p-treetable-row-background);
color: var(--p-treetable-row-text-color);
background: ${dt('treetable.row.background')};
color: ${dt('treetable.row.color')};
transition: background-color ${dt('transition.duration')}, color ${dt('transition.duration')}, border-color ${dt('transition.duration')}, box-shadow ${dt('transition.duration')}, outline-color ${dt('transition.duration')};
}
.p-treetable-tbody > tr > td {
text-align: left;
border: 1px solid var(--p-treetable-body-cell-border-color);
border: 1px solid ${dt('treetable.body.cell.border.color')};
border-width: 0 0 1px 0;
padding: 0.75rem 1rem;
}
.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover {
background: var(--p-treetable-row-background-hover);
color: var(--p-treetable-row-text-color-hover);
background: ${dt('treetable.row.hover.background')};
color: ${dt('treetable.row.hover.color')};
}
.p-treetable-tbody > tr.p-highlight {
background: var(--p-highlight-background);
color: var(--p-highlight-text-color);
background: ${dt('highlight.background')};
color: ${dt('highlight.color')};
}
.p-treetable-tbody > tr:has(+ .p-highlight) > td {
border-bottom-color: var(--p-treetable-body-cell-border-color-selected);
border-bottom-color: ${dt('treetable.body.cell.selected.border.color')});
}
.p-treetable-tbody > tr.p-highlight > td {
border-bottom-color: var(--p-treetable-body-cell-border-color-selected);
border-bottom-color: ${dt('treetable.body.cell.selected.border.color')});
}
.p-treetable-tbody > tr:focus-visible {
@ -294,7 +294,7 @@ export default {
position: relative;
width: 1.75rem;
height: 1.75rem;
color: var(--p-treetable-toggle-color);
color: ${dt('treetable.toggle.color')};
border: 0 none;
background: transparent;
border-radius: 50%;
@ -313,16 +313,16 @@ export default {
}
.p-treetable-toggler + .p-checkbox.p-indeterminate .p-checkbox-icon {
color: var(--p-treetable-indeterminate-color);
color: ${dt('treetable.indeterminate.color')};
}
.p-treetable-toggler:enabled:hover {
background: var(--p-treetable-toggle-background-hover);
color: var(--p-treetable-toggle-color-hover);
background: ${dt('treetable.toggle.hover.background')};
color: ${dt('treetable.toggle.hover.color')};
}
.p-treetable-hoverable-rows .p-treetable-tbody > tr:not(.p-highlight):hover .p-treetable-toggler {
color: var(--p-treetable-toggle-color-hover);
color: ${dt('treetable.toggle.hover.color')};
background: transparent;
}
@ -331,18 +331,18 @@ export default {
}
.p-treetable-tbody > tr.p-highlight .p-treetable-toggler:hover {
background: var(--p-treetable-toggle-background-hover-highlight);
background: ${dt('treetable.toggle.highlight.hover.background')};
color: inherit;
}
.p-treetable-tfoot > tr > td {
text-align: left;
padding: 0.75rem 1rem;
border: 1px solid var(--p-treetable-footer-cell-border-color);
border: 1px solid ${dt('treetable.footer.cell.border.color')};
border-width: 0 0 1px 0;
font-weight: 600;
color: var(--p-treetable-footer-cell-text-color);
background: var(--p-treetable-footer-cell-background);
color: ${dt('treetable.footer.cell.color')};
background: ${dt('treetable.footer.cell.background')};
}
.p-treetable .p-treetable-loading-icon {

108
components/lib/themes/primeone/presets/aura/datatable/index.js
View File

@ -4,69 +4,69 @@ export default {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
hoverBackground: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
color: '{surface.700}',
hoverColor: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
stripedBackground: '{surface.50}',
hoverBackground: '{surface.100}',
color: '{surface.700}',
hoverColor: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
selectedBorderColor: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
rowAction: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
hoverBackground: '{surface.100}',
highlightHoverBackground: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.500}'
hoverColor: '{surface.500}'
},
filter: {
menuButton: {
backgroundHover: '{surface.100}',
backgroundOpen: '{surface.100}',
backgroundActive: '{highlight.background}',
textColor: '{surface.500}',
textColorOpen: '{surface.500}',
textColorHover: '{surface.600}',
textColorActive: '{highlight.textColor}'
hoverBackground: '{surface.100}',
openBackground: '{surface.100}',
activeBackground: '{highlight.background}',
color: '{surface.500}',
openColor: '{surface.500}',
hoverColor: '{surface.600}',
colorActive: '{highlight.color}'
},
clearButton: {
backgroundHover: '{surface.100}',
textColor: '{surface.500}',
textColorHover: '{surface.600}'
hoverBackground: '{surface.100}',
color: '{surface.500}',
hoverColor: '{surface.600}'
},
overlay: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
contraint: {
constraint: {
borderColor: '{surface.200}'
}
}
@ -75,69 +75,69 @@ export default {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
hoverBackground: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
color: '{surface.0}',
hoverColor: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
stripedBackground: '{surface.950}',
hoverBackground: '{surface.800}',
color: '{surface.0}',
hoverColor: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
selectedBorderColor: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
dropPointColor: '{primary.color}',
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
rowAction: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
hoverBackground: '{surface.800}',
highlightHoverBackground: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
filter: {
menuButton: {
backgroundHover: '{surface.800}',
backgroundOpen: '{surface.800}',
backgroundActive: '{highlight.background}',
textColor: '{surface.400}',
textColorOpen: '{surface.300}',
textColorHover: '{surface.300}',
textColorActive: '{highlight.textColor}'
hoverBackground: '{surface.800}',
openBackground: '{surface.800}',
activeBackground: '{highlight.background}',
color: '{surface.400}',
openColor: '{surface.300}',
hoverColor: '{surface.300}',
colorActive: '{highlight.color}'
},
clearButton: {
backgroundHover: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.300}'
hoverBackground: '{surface.800}',
color: '{surface.400}',
hoverColor: '{surface.300}'
},
overlay: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
color: '{surface.0}'
},
contraint: {
constraint: {
borderColor: '{surface.700}'
}
}

12
components/lib/themes/primeone/presets/aura/dataview/index.js
View File

@ -4,32 +4,32 @@ export default {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
content: {
background: '{surface.0}',
textColor: '{surface.700}'
color: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
}
},
dark: {
header: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
color: '{surface.0}'
},
content: {
background: '{surface.900}',
textColor: '{surface.0}'
color: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
color: '{surface.0}'
}
}
}

47
components/lib/themes/primeone/presets/aura/orderlist/index.js
View File

@ -6,26 +6,24 @@ export default {
borderColor: '{surface.200}'
},
header: {
textColor: '{surface.500}'
color: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
focusBackground: '{surface.100}',
color: '{surface.700}',
focusColor: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
backgroundActive: '{surface.300}',
hoverBackground: '{surface.200}',
activeBackground: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
hoverBorderColor: '{surface.200}',
activeBorderColor: '{surface.300}',
color: '{surface.600}',
hoverColor: '{surface.700}',
activeColor: '{surface.800}'
}
},
dark: {
@ -34,26 +32,23 @@ export default {
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
color: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
focusBackground: '{surface.800}',
color: '{surface.0}',
focusColor: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
backgroundActive: '{surface.600}',
activeBackground: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
hoverBorderColor: '{surface.700}',
activeBorderColor: '{surface.600}',
color: '{surface.300}',
hoverColor: '{surface.200}',
activeColor: '{surface.100}'
}
}
}

24
components/lib/themes/primeone/presets/aura/organizationchart/index.js
View File

@ -3,10 +3,10 @@ export default {
light: {
node: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
hoverBackground: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
color: '{surface.700}',
hoverColor: '{surface.800}'
},
toggleIcon: {
background: '{surface.0}',
@ -17,6 +17,22 @@ export default {
color: '{surface.200}'
}
},
dark: {}
dark: {
node: {
background: '{surface.900}',
hoverBackground: '{surface.800}',
borderColor: '{surface.700}',
color: '{surface.0}',
hoverColor: '{surface.0}'
},
toggleIcon: {
background: '{surface.800}',
borderColor: '{surface.700}',
color: '{surface.400}'
},
connector: {
color: '{surface.700}'
}
}
}
};

16
components/lib/themes/primeone/presets/aura/paginator/index.js
View File

@ -3,29 +3,29 @@ export default {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
color: '{surface.700}'
},
navigator: {
backgroundHover: '{surface.100}',
hoverBackground: '{surface.100}',
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
currentPageReport: {
textColor: '{surface.500}'
color: '{surface.500}'
}
},
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
color: '{surface.0}'
},
navigator: {
backgroundHover: '{surface.800}',
hoverBackground: '{surface.800}',
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
currentPageReport: {
textColor: '{surface.400}'
color: '{surface.400}'
}
}
}

44
components/lib/themes/primeone/presets/aura/picklist/index.js
View File

@ -6,26 +6,24 @@ export default {
borderColor: '{surface.200}'
},
header: {
textColor: '{surface.500}'
color: '{surface.500}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.100}',
backgroundFocus: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}',
textColorFocus: '{surface.800}'
focusBackground: '{surface.100}',
color: '{surface.700}',
focusColor: '{surface.800}'
},
control: {
background: '{surface.100}',
backgroundHover: '{surface.200}',
hoverBackground: '{surface.200}',
backgroundActive: '{surface.300}',
borderColor: '{surface.100}',
borderColorHover: '{surface.200}',
borderColorActive: '{surface.300}',
textColor: '{surface.600}',
textColorHover: '{surface.700}',
textColorActive: '{surface.800}'
hoverBorderColor: '{surface.200}',
activeBorderColor: '{surface.300}',
color: '{surface.600}',
hoverColor: '{surface.700}',
activeColor: '{surface.800}'
}
},
dark: {
@ -34,26 +32,24 @@ export default {
borderColor: '{surface.700}'
},
header: {
textColor: '{surface.400}'
color: '{surface.400}'
},
item: {
background: 'transparent',
backgroundHover: '{surface.800}',
backgroundFocus: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}',
textColorFocus: '{surface.0}'
focusBackground: '{surface.800}',
color: '{surface.0}',
focusColor: '{surface.0}'
},
control: {
background: '{surface.800}',
backgroundHover: '{surface.700}',
hoverBackground: '{surface.700}',
backgroundActive: '{surface.600}',
borderColor: '{surface.800}',
borderColorHover: '{surface.700}',
borderColorActive: '{surface.600}',
textColor: '{surface.300}',
textColorHover: '{surface.200}',
textColorActive: '{surface.100}'
hoverBorderColor: '{surface.700}',
activeBorderColor: '{surface.600}',
color: '{surface.300}',
hoverColor: '{surface.200}',
activeColor: '{surface.100}'
}
}
}

32
components/lib/themes/primeone/presets/aura/tree/index.js
View File

@ -3,22 +3,22 @@ export default {
light: {
root: {
background: '{surface.0}',
textColor: '{surface.700}'
color: '{surface.700}'
},
node: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
hoverBackground: '{surface.100}',
color: '{surface.700}',
hoverColor: '{surface.800}'
},
nodeIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
hoverBackground: '{surface.100}',
highlightHoverBackground: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
@ -27,22 +27,22 @@ export default {
dark: {
root: {
background: '{surface.900}',
textColor: '{surface.0}'
color: '{surface.0}'
},
node: {
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
hoverBackground: '{surface.800}',
color: '{surface.0}',
hoverColor: '{surface.0}'
},
nodeIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
hoverBackground: '{surface.800}',
highlightHoverBackground: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'

60
components/lib/themes/primeone/presets/aura/treetable/index.js
View File

@ -4,46 +4,46 @@ export default {
header: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
headerCell: {
background: '{surface.0}',
backgroundHover: '{surface.100}',
hoverBackground: '{surface.100}',
borderColor: '{surface.200}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
color: '{surface.700}',
hoverColor: '{surface.800}'
},
row: {
background: '{surface.0}',
backgroundStriped: '{surface.50}',
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
stripedBackground: '{surface.50}',
hoverBackground: '{surface.100}',
color: '{surface.700}',
hoverColor: '{surface.800}'
},
bodyCell: {
borderColor: '{surface.200}',
borderColorSelected: '{primary.100}'
selectedBorderColor: '{primary.100}'
},
footerCell: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
footer: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
color: '{surface.700}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
toggle: {
backgroundHover: '{surface.100}',
backgroundHoverHighlight: '{surface.0}',
hoverBackground: '{surface.100}',
highlightHoverBackground: '{surface.0}',
color: '{surface.500}',
colorHover: '{surface.600}'
hoverColor: '{surface.600}'
},
indeterminate: {
color: '{surface.500}'
@ -53,46 +53,46 @@ export default {
header: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
headerCell: {
background: '{surface.900}',
backgroundHover: '{surface.800}',
hoverBackground: '{surface.800}',
borderColor: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
color: '{surface.0}',
hoverColor: '{surface.0}'
},
row: {
background: '{surface.900}',
backgroundStriped: '{surface.950}',
backgroundHover: '{surface.800}',
textColor: '{surface.0}',
textColorHover: '{surface.0}'
stripedBackground: '{surface.950}',
hoverBackground: '{surface.800}',
color: '{surface.0}',
hoverColor: '{surface.0}'
},
bodyCell: {
borderColor: '{surface.800}',
borderColorSelected: '{primary.900}'
selectedBorderColor: '{primary.900}'
},
footerCell: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
footer: {
background: '{surface.900}',
borderColor: '{surface.800}',
textColor: '{surface.0}'
color: '{surface.0}'
},
resizerColor: '{primary.color}',
sortIcon: {
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
toggle: {
backgroundHover: '{surface.800}',
backgroundHoverHighlight: '{surface.900}',
hoverBackground: '{surface.800}',
highlightHoverBackground: '{surface.900}',
color: '{surface.400}',
colorHover: '{surface.300}'
hoverColor: '{surface.300}'
},
indeterminate: {
color: '{surface.400}'