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

Update tokens

pull/5507/head
Cagatay Civici 2024-02-03 17:47:28 +03:00
parent 5ac44cfc6f
commit bf247d8735
2 changed files with 78 additions and 129 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
components/lib/theme/lara/index.js
View File

@ -83,43 +83,84 @@ export default {
}
},
semantic: {
primary: {
50: '{emerald.50}',
100: '{emerald.100}',
200: '{emerald.200}',
300: '{emerald.300}',
400: '{emerald.400}',
500: '{emerald.500}',
600: '{emerald.600}',
700: '{emerald.700}',
800: '{emerald.800}',
900: '{emerald.900}',
950: '{emerald.950}'
colorScheme: {
light: {
primary: {
50: '{emerald.50}',
100: '{emerald.100}',
200: '{emerald.200}',
300: '{emerald.300}',
400: '{emerald.400}',
500: '{emerald.500}',
600: '{emerald.600}',
700: '{emerald.700}',
800: '{emerald.800}',
900: '{emerald.900}',
950: '{emerald.950}'
},
surface: {
0: '#ffffff',
50: '{slate.50}',
100: '{slate.100}',
200: '{slate.200}',
300: '{slate.300}',
400: '{slate.400}',
500: '{slate.500}',
600: '{slate.600}',
700: '{slate.700}',
800: '{slate.800}',
900: '{slate.900}',
950: '{slate.950}'
},
textColor: '{surface.700}',
textSecondaryColor: '{surface.500}',
borderColor: '{surface.300}'
},
dark: {
primary: {
50: '{emerald.50}',
100: '{emerald.100}',
200: '{emerald.200}',
300: '{emerald.300}',
400: '{emerald.400}',
500: '{emerald.500}',
600: '{emerald.600}',
700: '{emerald.700}',
800: '{emerald.800}',
900: '{emerald.900}',
950: '{emerald.950}'
},
surface: {
0: '#ffffff',
50: '{zinc.50}',
100: '{zinc.100}',
200: '{zinc.200}',
300: '{zinc.300}',
400: '{zinc.400}',
500: '{zinc.500}',
600: '{zinc.600}',
700: '{zinc.700}',
800: '{zinc.800}',
900: '{zinc.900}',
950: '{zinc.950}'
},
textColor: '{dark.surface.0}',
textSecondaryColor: '{dark.surface.500}',
borderColor: '{dark.surface.700}'
},
},
surface: {
0: '#ffffff',
50: '{slate.50}',
100: '{slate.100}',
200: '{slate.200}',
300: '{slate.300}',
400: '{slate.400}',
500: '{slate.500}',
600: '{slate.600}',
700: '{slate.700}',
800: '{slate.800}',
900: '{slate.900}',
950: '{slate.950}'
},
fontFamily: '"Inter var", sans-serif',
borderRadius: '6px',
inlineGap: '{gap.2}', // inline-spacing
transitionDuration: '.2s',
transition: 'background-color {transitionDuration}, color {transitionDuration}, box-shadow {transitionDuration}, border-color {transitionDuration}, outline-color {transitionDuration}',
focusRing: {
width: '2px',
style: 'solid',
color: '{primary.500}',
offset: '2px'
common: {
fontFamily: '"Inter var", sans-serif',
borderRadius: '6px',
inlineGap: '{gap.2}', // inline-spacing
transitionDuration: '.2s',
transition: 'background-color {transitionDuration}, color {transitionDuration}, box-shadow {transitionDuration}, border-color {transitionDuration}, outline-color {transitionDuration}',
focusRing: {
width: '2px',
style: 'solid',
color: '{primary.500}',
offset: '2px'
}
}
},
components: {

94
components/lib/theme/lara/panel/index.js
View File

@ -1,96 +1,4 @@
export default {
variables: {
common: {
header: {
borderWidth: '1px',
borderStyle: 'solid',
paddingX: '{p.5}',
paddingY: '{p.5}',
fontWeight: 700
},
headerIcon: {
width: '2rem',
height: '2rem',
borderWidth: '0',
borderStyle: 'none',
borderRadius: '50%'
},
toggleableHeader: {
paddingX: '{p.5}',
paddingY: '{p.3}'
},
content: {
paddingX: '{p.5}',
paddingY: '{p.5}',
borderWidth: '1px',
borderStyle: 'solid'
},
footer: {
paddingX: '{p.5}',
paddingY: '{p.3}',
borderWidth: '1px',
borderStyle: 'solid'
}
},
light: {
header: {
borderColor: '{surface.200}',
background: '{surface.50}',
color: '{surface.700}'
},
headerIcon: {
color: '{surface.600}',
borderColor: 'transparent',
background: 'transparent',
states: {
hover: {
color: '{surface.800}',
borderColor: 'transparent',
background: '{surface.100}'
}
}
},
content: {
borderColor: '{surface.200}',
background: '{surface.0}',
color: '{surface.700}'
},
footer: {
borderColor: '{surface.200}',
background: '{surface.0}',
color: '{surface.700}'
}
},
dark: {
header: {
borderColor: '{surface.200}',
background: '{surface.50}',
color: '{surface.700}'
},
headerIcon: {
color: '{surface.600}',
borderColor: 'transparent',
background: 'transparent',
states: {
hover: {
color: '{surface.800}',
borderColor: 'transparent',
background: '{surface.100}'
}
}
},
content: {
borderColor: '{surface.200}',
background: '{surface.0}',
color: '{surface.700}'
},
footer: {
borderColor: '{surface.200}',
background: '{surface.0}',
color: '{surface.700}'
}
}
},
css: `
.p-panel-header {
display: flex;
@ -98,7 +6,7 @@ export default {
align-items: center;
border: var(--p-panel-header-border-width) var(--p-panel-header-border-style) var(--p-panel-header-border-color);
padding: var(--p-panel-header-padding-y) var(--p-panel-header-padding-x);
background: var(--p-panel-header-background);
background: var(--p-surface-100, --p-dark-surface-900);
color: var(--p-panel-header-color);
border-top-right-radius: var(--p-border-radius);
border-top-left-radius: var(--p-border-radius);