Updated tokens of Editor

pull/5756/head
Cagatay Civici 2024-05-08 18:11:08 +03:00
parent a9d46ba470
commit c11fdca25d
3 changed files with 58 additions and 32 deletions

View File

@ -949,8 +949,8 @@ const theme = ({ dt }) => `
.p-editor .p-editor-toolbar {
background: ${dt('editor.toolbar.background')};
border-top-right-radius: ${dt('border.radius.md')};
border-top-left-radius: ${dt('border.radius.md')};
border-top-right-radius: ${dt('editor.toolbar.border.radius')};
border-top-left-radius: ${dt('editor.toolbar.border.radius')};
}
.p-editor .p-editor-toolbar.ql-snow {
@ -997,27 +997,28 @@ const theme = ({ dt }) => `
.p-editor .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
background: ${dt('editor.overlay.background')};
border: 1px solid ${dt('editor.overlay.border.color')};
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
border-radius: ${dt('border.radius.md')};
padding: 0.25rem 0.25rem;
box-shadow: ${dt('editor.overlay.shadow')};
border-radius: ${dt('editor.overlay.border.radius')};
padding: ${dt('editor.overlay.padding')};
}
.p-editor .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item {
color: ${dt('editor.overlay.item.color')};
color: ${dt('editor.overlay.option.color')};
border-radius: ${dt('editor.overlay.option.border.radius')};
}
.p-editor .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover {
background: ${dt('editor.overlay.item.hover.background')};
color: ${dt('editor.overlay.item.hover.color')};
background: ${dt('editor.overlay.option.focus.background')};
color: ${dt('editor.overlay.option.focus.color')};
}
.p-editor .p-editor-toolbar.ql-snow .ql-picker.ql-expanded:not(.ql-icon-picker) .ql-picker-item {
padding: 0.5rem 0.75rem;
padding: ${dt('editor.overlay.option.padding')};
}
.p-editor .p-editor-content {
border-bottom-right-radius: ${dt('border.radius.md')};
border-bottom-left-radius: ${dt('border.radius.md')};
border-bottom-right-radius: ${dt('editor.content.border.radius')};
border-bottom-left-radius: ${dt('editor.content.border.radius')};
}
.p-editor .p-editor-content.ql-snow {
@ -1027,8 +1028,8 @@ const theme = ({ dt }) => `
.p-editor .p-editor-content .ql-editor {
background: ${dt('editor.content.background')};
color: ${dt('editor.content.color')};
border-bottom-right-radius: ${dt('border.radius.md')};
border-bottom-left-radius: ${dt('border.radius.md')};
border-bottom-right-radius: ${dt('editor.content.border.radius')};
border-bottom-left-radius: ${dt('editor.content.border.radius')};
}
.p-editor .ql-snow.ql-toolbar button:hover,

View File

@ -1,7 +1,8 @@
export default {
toolbar: {
background: '{content.background}',
borderColor: '{content.border.color}'
borderColor: '{content.border.color}',
borderRadius: '{border.radius.md}'
},
toolbarItem: {
color: '{text.muted.color}',
@ -9,18 +10,24 @@ export default {
activeColor: '{primary.color}'
},
overlay: {
background: '{content.background}',
borderColor: '{content.border.color}',
color: '{content.color}'
background: '{overlay.select.background}',
borderColor: '{overlay.select.border.color}',
borderRadius: '{overlay.select.border.radius}',
color: '{overlay.select.color}',
shadow: '{overlay.select.shadow}',
padding: '{list.padding}'
},
overlayItem: {
hoverBackground: '{content.hover.background}',
color: '{content.color}',
hoverColor: '{content.hover.color}'
overlayOption: {
focusBackground: '{list.option.focus.background}',
color: '{list.option.color}',
focusColor: '{list.option.focus.color}',
padding: '{list.option.padding}',
borderRadius: '{list.option.border.radius}'
},
content: {
background: '{content.background}',
borderColor: '{content.border.color}',
color: '{content.color}'
color: '{content.color}',
borderRadius: '{border.radius.md}'
}
};

View File

@ -1,7 +1,7 @@
export default {
toolbar: {
background: '{content.background}',
borderColor: '{content.border.color}'
borderColor: '{content.border.color}',
borderRadius: '{border.radius.sm}'
},
toolbarItem: {
color: '{text.muted.color}',
@ -9,18 +9,36 @@ export default {
activeColor: '{primary.color}'
},
overlay: {
background: '{content.background}',
borderColor: '{content.border.color}',
color: '{content.color}'
background: '{overlay.select.background}',
borderColor: '{overlay.select.border.color}',
borderRadius: '{overlay.select.border.radius}',
color: '{overlay.select.color}',
shadow: '{overlay.select.shadow}',
padding: '{list.padding}'
},
overlayItem: {
hoverBackground: '{content.hover.background}',
color: '{content.color}',
hoverColor: '{content.hover.color}'
overlayOption: {
focusBackground: '{list.option.focus.background}',
color: '{list.option.color}',
focusColor: '{list.option.focus.color}',
padding: '{list.option.padding}',
borderRadius: '{list.option.border.radius}'
},
content: {
background: '{content.background}',
borderColor: '{content.border.color}',
color: '{content.color}'
color: '{content.color}',
borderRadius: '{border.radius.sm}'
},
colorScheme: {
light: {
toolbar: {
background: '{surface.100}'
}
},
dark: {
toolbar: {
background: '{surface.800}'
}
}
}
};