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

Message colors for Nora

pull/5756/head
Cagatay Civici 2024-05-15 01:14:43 +03:00
parent 1f395db001
commit 3d4ada0d03
5 changed files with 193 additions and 193 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/lib/themes/aura/inlinemessage/index.js
View File

@ -16,37 +16,37 @@ export default {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)', background: 'color-mix(in srgb, {blue.50}, transparent 5%)',
borderColor: '{blue.200}', borderColor: '{blue.200}',
color: '{blue.600}', color: '{blue.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
}, },
success: { success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)', background: 'color-mix(in srgb, {green.50}, transparent 5%)',
borderColor: '{green.200}', borderColor: '{green.200}',
color: '{green.600}', color: '{green.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
}, },
warn: { warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', background: 'color-mix(in srgb,{yellow.50}, transparent 5%)',
borderColor: '{yellow.200}', borderColor: '{yellow.200}',
color: '{yellow.600}', color: '{yellow.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
}, },
error: { error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)', background: 'color-mix(in srgb, {red.50}, transparent 5%)',
borderColor: '{red.200}', borderColor: '{red.200}',
color: '{red.600}', color: '{red.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
}, },
secondary: { secondary: {
background: '{surface.100}', background: '{surface.100}',
borderColor: '{surface.200}', borderColor: '{surface.200}',
color: '{surface.600}', color: '{surface.600}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
}, },
contrast: { contrast: {
background: '{surface.900}', background: '{surface.900}',
borderColor: '{surface.950}', borderColor: '{surface.950}',
color: '{surface.50}', color: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
} }
}, },
dark: { dark: {
@ -54,37 +54,37 @@ export default {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)', background: 'color-mix(in srgb, {blue.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)',
color: '{blue.500}', color: '{blue.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)'
}, },
success: { success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)', background: 'color-mix(in srgb, {green.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)',
color: '{green.500}', color: '{green.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)'
}, },
warn: { warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', background: 'color-mix(in srgb, {yellow.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)',
color: '{yellow.500}', color: '{yellow.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)'
}, },
error: { error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)', background: 'color-mix(in srgb, {red.500}, transparent 84%)',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)',
color: '{red.500}', color: '{red.500}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)'
}, },
secondary: { secondary: {
background: '{surface.800}', background: '{surface.800}',
borderColor: '{surface.700}', borderColor: '{surface.700}',
color: '{surface.300}', color: '{surface.300}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)'
}, },
contrast: { contrast: {
background: '{surface.0}', background: '{surface.0}',
borderColor: '{surface.100}', borderColor: '{surface.100}',
color: '{surface.950}', color: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
} }
} }
} }

86
components/lib/themes/nora/inlinemessage/index.js
View File

@ -5,7 +5,7 @@ export default {
gap: '0.5rem' gap: '0.5rem'
}, },
text: { text: {
fontWeight: '500' fontWeight: '600'
}, },
icon: { icon: {
size: '1rem' size: '1rem'
@ -13,78 +13,78 @@ export default {
colorScheme: { colorScheme: {
light: { light: {
info: { info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)', background: '{blue.800}',
borderColor: '{blue.200}', borderColor: '{blue.800}',
color: '{blue.600}', color: '{blue.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' shadow: 'none'
}, },
success: { success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)', background: '{green.800}',
borderColor: '{green.200}', borderColor: '{green.800}',
color: '{green.600}', color: '{green.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' shadow: 'none'
}, },
warn: { warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', background: '{yellow.600}',
borderColor: '{yellow.200}', borderColor: '{yellow.600}',
color: '{yellow.600}', color: '{yellow.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' shadow: 'none'
}, },
error: { error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)', background: '{red.800}',
borderColor: '{red.200}', borderColor: '{red.800}',
color: '{red.600}', color: '{red.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' shadow: 'none'
}, },
secondary: { secondary: {
background: '{surface.100}', background: '{surface.200}',
borderColor: '{surface.200}', borderColor: '{surface.200}',
color: '{surface.600}', color: '{surface.700}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' shadow: 'none'
}, },
contrast: { contrast: {
background: '{surface.900}', background: '{surface.900}',
borderColor: '{surface.950}', borderColor: '{surface.900}',
color: '{surface.50}', color: '{surface.50}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)'
} }
}, },
dark: { dark: {
info: { info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)', background: '{blue.200}',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', borderColor: '{blue.200}',
color: '{blue.500}', color: '{blue.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)' shadow: 'none'
}, },
success: { success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)', background: '{green.200}',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', borderColor: '{green.200}',
color: '{green.500}', color: '{green.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)' shadow: 'none'
}, },
warn: { warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', background: '{yellow.200}',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', borderColor: '{yellow.200}',
color: '{yellow.500}', color: '{yellow.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)' shadow: 'none'
}, },
error: { error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)', background: '{red.200}',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', borderColor: '{red.200}',
color: '{red.500}', color: '{red.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)' shadow: 'none'
}, },
secondary: { secondary: {
background: '{surface.800}', background: '{surface.700}',
borderColor: '{surface.700}', borderColor: '{surface.700}',
color: '{surface.300}', color: '{surface.200}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)' shadow: 'none'
}, },
contrast: { contrast: {
background: '{surface.0}', background: '{surface.0}',
borderColor: '{surface.100}', borderColor: '{surface.0}',
color: '{surface.950}', color: '{surface.950}',
boxShadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)' shadow: 'none'
} }
} }
} }

128
components/lib/themes/nora/message/index.js
View File

@ -10,7 +10,7 @@ export default {
}, },
text: { text: {
fontSize: '1rem', fontSize: '1rem',
fontWeight: '500' fontWeight: '700'
}, },
icon: { icon: {
size: '1.125rem' size: '1.125rem'
@ -31,77 +31,77 @@ export default {
colorScheme: { colorScheme: {
light: { light: {
info: { info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)', background: '{blue.800}',
borderColor: '{blue.200}', borderColor: '{blue.800}',
color: '{blue.600}', color: '{blue.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{blue.100}', hoverBackground: '{blue.600}',
focusRing: { focusRing: {
color: '{blue.600}', color: '{blue.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
success: { success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)', background: '{green.800}',
borderColor: '{green.200}', borderColor: '{green.800}',
color: '{green.600}', color: '{green.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{green.100}', hoverBackground: '{green.600}',
focusRing: { focusRing: {
color: '{green.600}', color: '{green.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
warn: { warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', background: '{yellow.600}',
borderColor: '{yellow.200}', borderColor: '{yellow.600}',
color: '{yellow.600}', color: '{yellow.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{yellow.100}', hoverBackground: '{yellow.400}',
focusRing: { focusRing: {
color: '{yellow.600}', color: '{yellow.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
error: { error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)', background: '{red.800}',
borderColor: '{red.200}', borderColor: '{red.800}',
color: '{red.600}', color: '{red.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{red.100}', hoverBackground: '{red.600}',
focusRing: { focusRing: {
color: '{red.600}', color: '{red.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
secondary: { secondary: {
background: '{surface.100}', background: '{surface.200}',
borderColor: '{surface.200}', borderColor: '{surface.200}',
color: '{surface.600}', color: '{surface.700}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{surface.200}', hoverBackground: '{surface.50}',
focusRing: { focusRing: {
color: '{surface.600}', color: '{surface.700}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
contrast: { contrast: {
background: '{surface.900}', background: '{surface.900}',
borderColor: '{surface.950}', borderColor: '{surface.900}',
color: '{surface.50}', color: '{surface.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeButton: { closeButton: {
hoverBackground: '{surface.800}', hoverBackground: '{surface.700}',
focusRing: { focusRing: {
color: '{surface.50}', color: '{surface.50}',
shadow: 'none' shadow: 'none'
@ -111,77 +111,77 @@ export default {
}, },
dark: { dark: {
info: { info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)', background: '{blue.200}',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', borderColor: '{blue.200}',
color: '{blue.500}', color: '{blue.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{blue.50}',
focusRing: { focusRing: {
color: '{blue.500}', color: '{blue.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
success: { success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)', background: '{green.200}',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', borderColor: '{green.200}',
color: '{green.500}', color: '{green.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{green.50}',
focusRing: { focusRing: {
color: '{green.500}', color: '{green.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
warn: { warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', background: '{yellow.200}',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', borderColor: '{yellow.200}',
color: '{yellow.500}', color: '{yellow.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{yellow.50}',
focusRing: { focusRing: {
color: '{yellow.500}', color: '{yellow.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
error: { error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)', background: '{red.200}',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', borderColor: '{red.200}',
color: '{red.500}', color: '{red.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{red.50}',
focusRing: { focusRing: {
color: '{red.500}', color: '{red.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
secondary: { secondary: {
background: '{surface.800}', background: '{surface.700}',
borderColor: '{surface.700}', borderColor: '{surface.700}',
color: '{surface.300}', color: '{surface.200}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{surface.700}', hoverBackground: '{surface.500}',
focusRing: { focusRing: {
color: '{surface.300}', color: '{surface.200}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
contrast: { contrast: {
background: '{surface.0}', background: '{surface.0}',
borderColor: '{surface.100}', borderColor: '{surface.0}',
color: '{surface.950}', color: '{surface.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', shadow: 'none',
closeButton: { closeButton: {
hoverBackground: '{surface.100}', hoverBackground: '{surface.200}',
focusRing: { focusRing: {
color: '{surface.950}', color: '{surface.950}',
shadow: 'none' shadow: 'none'

146
components/lib/themes/nora/toast/index.js
View File

@ -15,7 +15,7 @@ export default {
gap: '0.5rem' gap: '0.5rem'
}, },
summary: { summary: {
fontWeight: '500', fontWeight: '700',
fontSize: '1rem' fontSize: '1rem'
}, },
detail: { detail: {
@ -39,83 +39,83 @@ export default {
light: { light: {
blur: '1.5px', blur: '1.5px',
info: { info: {
background: 'color-mix(in srgb, {blue.50}, transparent 5%)', background: '{blue.800}',
borderColor: '{blue.200}', borderColor: '{blue.800}',
color: '{blue.600}', color: '{blue.50}',
detailColor: '{surface.700}', detailColor: '{blue.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{blue.100}', hoverBackground: '{blue.600}',
focusRing: { focusRing: {
color: '{blue.600}', color: '{blue.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
success: { success: {
background: 'color-mix(in srgb, {green.50}, transparent 5%)', background: '{green.800}',
borderColor: '{green.200}', borderColor: '{green.800}',
color: '{green.600}', color: '{green.50}',
detailColor: '{surface.700}', detailColor: '{green.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{green.100}', hoverBackground: '{green.600}',
focusRing: { focusRing: {
color: '{green.600}', color: '{green.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
warn: { warn: {
background: 'color-mix(in srgb,{yellow.50}, transparent 5%)', background: '{yellow.600}',
borderColor: '{yellow.200}', borderColor: '{yellow.600}',
color: '{yellow.600}', color: '{yellow.50}',
detailColor: '{surface.700}', detailColor: '{yellow.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{yellow.100}', hoverBackground: '{yellow.400}',
focusRing: { focusRing: {
color: '{yellow.600}', color: '{yellow.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
error: { error: {
background: 'color-mix(in srgb, {red.50}, transparent 5%)', background: '{red.800}',
borderColor: '{red.200}', borderColor: '{red.800}',
color: '{red.600}', color: '{red.50}',
detailColor: '{surface.700}', detailColor: '{red.50}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{red.100}', hoverBackground: '{red.600}',
focusRing: { focusRing: {
color: '{red.600}', color: '{red.50}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
secondary: { secondary: {
background: '{surface.100}', background: '{surface.200}',
borderColor: '{surface.200}', borderColor: '{surface.200}',
color: '{surface.600}', color: '{surface.700}',
detailColor: '{surface.700}', detailColor: '{surface.700}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{surface.200}', hoverBackground: '{surface.50}',
focusRing: { focusRing: {
color: '{surface.600}', color: '{surface.700}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
contrast: { contrast: {
background: '{surface.900}', background: '{surface.900}',
borderColor: '{surface.950}', borderColor: '{surface.900}',
color: '{surface.50}', color: '{surface.50}',
detailColor: '{surface.0}', detailColor: '{surface.0}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)',
closeButton: { closeButton: {
hoverBackground: '{surface.800}', hoverBackground: '{surface.700}',
focusRing: { focusRing: {
color: '{surface.50}', color: '{surface.50}',
shadow: 'none' shadow: 'none'
@ -126,83 +126,83 @@ export default {
dark: { dark: {
blur: '10px', blur: '10px',
info: { info: {
background: 'color-mix(in srgb, {blue.500}, transparent 84%)', background: '{blue.200}',
borderColor: 'color-mix(in srgb, {blue.700}, transparent 64%)', borderColor: '{blue.200}',
color: '{blue.500}', color: '{blue.950}',
detailColor: '{surface.0}', detailColor: '{blue.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {blue.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{blue.50}',
focusRing: { focusRing: {
color: '{blue.500}', color: '{blue.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
success: { success: {
background: 'color-mix(in srgb, {green.500}, transparent 84%)', background: '{green.200}',
borderColor: 'color-mix(in srgb, {green.700}, transparent 64%)', borderColor: '{green.200}',
color: '{green.500}', color: '{green.950}',
detailColor: '{surface.0}', detailColor: '{green.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {green.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{green.50}',
focusRing: { focusRing: {
color: '{green.500}', color: '{green.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
warn: { warn: {
background: 'color-mix(in srgb, {yellow.500}, transparent 84%)', background: '{yellow.200}',
borderColor: 'color-mix(in srgb, {yellow.700}, transparent 64%)', borderColor: '{yellow.200}',
color: '{yellow.500}', color: '{yellow.950}',
detailColor: '{surface.0}', detailColor: '{yellow.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {yellow.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{yellow.50}',
focusRing: { focusRing: {
color: '{yellow.500}', color: '{yellow.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
error: { error: {
background: 'color-mix(in srgb, {red.500}, transparent 84%)', background: '{red.200}',
borderColor: 'color-mix(in srgb, {red.700}, transparent 64%)', borderColor: '{red.200}',
color: '{red.500}', color: '{red.950}',
detailColor: '{surface.0}', detailColor: '{red.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {red.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: 'rgba(255, 255, 255, 0.05)', hoverBackground: '{red.50}',
focusRing: { focusRing: {
color: '{red.500}', color: '{red.950}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
secondary: { secondary: {
background: '{surface.800}', background: '{surface.700}',
borderColor: '{surface.700}', borderColor: '{surface.700}',
color: '{surface.300}', color: '{surface.200}',
detailColor: '{surface.0}', detailColor: '{surface.200}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.500}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{surface.700}', hoverBackground: '{surface.500}',
focusRing: { focusRing: {
color: '{surface.300}', color: '{surface.200}',
shadow: 'none' shadow: 'none'
} }
} }
}, },
contrast: { contrast: {
background: '{surface.0}', background: '{surface.0}',
borderColor: '{surface.100}', borderColor: '{surface.0}',
color: '{surface.950}', color: '{surface.950}',
detailColor: '{surface.950}', detailColor: '{surface.950}',
shadow: '0px 4px 8px 0px color-mix(in srgb, {surface.950}, transparent 96%)', shadow: '{overlay.popover.shadow}',
closeButton: { closeButton: {
hoverBackground: '{surface.100}', hoverBackground: '{surface.200}',
focusRing: { focusRing: {
color: '{surface.950}', color: '{surface.950}',
shadow: 'none' shadow: 'none'

2
components/lib/toast/style/ToastStyle.js
View File

@ -36,7 +36,7 @@ const theme = ({ dt }) => `
gap: ${dt('toast.text.gap')}; gap: ${dt('toast.text.gap')};
} }
.p-toast-summary .p-toast-summary {
font-weight: ${dt('toast.summary.font.weight')}; font-weight: ${dt('toast.summary.font.weight')};
font-size: ${dt('toast.summary.font.size')}; font-size: ${dt('toast.summary.font.size')};
} }