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

Tokens for DataView

pull/5756/head
Cagatay Civici 2024-05-12 21:59:19 +03:00
parent f1d01dd4d5
commit 25949514b8
3 changed files with 97 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
components/lib/dataview/style/DataViewStyle.js
View File

@ -1,35 +1,54 @@
import BaseStyle from 'primevue/base/style';
const theme = ({ dt }) => `
.p-dataview {
border-color: ${dt('dataview.border.color')};
border-width: ${dt('dataview.border.width')};
border-style: solid;
border-radius: ${dt('dataview.border.radius')};
padding: ${dt('dataview.padding')};
}
.p-dataview-header {
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;
border-color: ${dt('dataview.header.border.color')};
border-width: ${dt('dataview.header.border.width')};
border-style: solid;
padding: ${dt('dataview.header.padding')};
border-radius: ${dt('dataview.header.border.radius')};
}
.p-dataview-content {
background: ${dt('dataview.content.background')};
border-color: ${dt('dataview.content.border.color')};
border-width: ${dt('dataview.content.border.width')};
border-style: solid;
color: ${dt('dataview.content.color')};
padding: ${dt('dataview.content.padding')};
border-radius: ${dt('dataview.content.border.radius')};
}
.p-dataview-footer {
background: ${dt('dataview.footer.background')};
color: ${dt('dataview.footer.color')};
border: 1px solid ${dt('dataview.footer.border.color')};
border-width: 1px 0 0 0;
padding: 0.75rem 1rem;
border-color: ${dt('dataview.footer.border.color')};
border-width: ${dt('dataview.footer.border.width')};
border-style: solid;
padding: ${dt('dataview.footer.padding')};
border-radius: ${dt('dataview.footer.border.radius')};
}
.p-dataview-paginator-top {
border: solid ${dt('dataview.header.border.color')};
border-width: 0 0 1px 0;
border-width: ${dt('dataview.paginator.top.border.width')};
border-color: ${dt('dataview.paginator.top.border.color')};
border-style: solid;
}
.p-dataview-paginator-bottom {
border: solid ${dt('dataview.footer.border.color')};
border-width: 1px 0 0 0;
border-width: ${dt('dataview.paginator.bottom.border.width')};
border-color: ${dt('dataview.paginator.bottom.border.color')};
border-style: solid;
}
`;

30
components/lib/themes/aura/dataview/index.js
View File

@ -1,16 +1,40 @@
export default {
root: {
borderColor: 'transparent',
borderWidth: '0',
borderRadius: '0',
padding: '0'
},
header: {
background: '{content.background}',
color: '{content.color}',
borderColor: '{content.border.color}',
color: '{content.color}'
borderWidth: '0 0 1px 0',
padding: '0.75rem 1rem',
borderRadius: '0'
},
content: {
background: '{content.background}',
color: '{content.color}'
color: '{content.color}',
borderColor: 'transparent',
borderWidth: '0',
padding: '0',
borderRadius: '0'
},
footer: {
background: '{content.background}',
color: '{content.color}',
borderColor: '{content.border.color}',
color: '{content.color}'
borderWidth: '1px 0 0 0',
padding: '0.75rem 1rem',
borderRadius: '0'
},
paginatorTop: {
borderColor: '{content.border.color}',
borderWidth: '0 0 1px 0'
},
paginatorBottom: {
borderColor: '{content.border.color}',
borderWidth: '1px 0 0 0'
}
};

46
components/lib/themes/lara/dataview/index.js
View File

@ -1,16 +1,52 @@
export default {
header: {
background: '{content.background}',
root: {
borderColor: '{content.border.color}',
color: '{content.color}'
borderWidth: '1px',
borderRadius: '4px',
padding: '0'
},
header: {
borderColor: '{content.border.color}',
borderWidth: '0 0 1px 0',
padding: '0.875rem 1.125rem',
borderRadius: '3px 3px 0 0'
},
content: {
background: '{content.background}',
color: '{content.color}'
color: '{content.color}',
borderColor: 'transparent',
borderWidth: '0',
padding: '0',
borderRadius: '3px'
},
footer: {
background: '{content.background}',
color: '{content.color}',
borderColor: '{content.border.color}',
color: '{content.color}'
borderWidth: '1px 0 0 0',
padding: '0.875rem 1.125rem',
borderRadius: '0 0 3px 3px'
},
paginatorTop: {
borderColor: '{content.border.color}',
borderWidth: '0 0 1px 0'
},
paginatorBottom: {
borderColor: '{content.border.color}',
borderWidth: '1px 0 0 0'
},
colorScheme: {
light: {
header: {
background: '{surface.100}',
color: '{text.color}'
}
},
dark: {
header: {
background: '{surface.800}',
color: '{text.color}'
}
}
}
};