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

Migrated editor

pull/5507/head
Cagatay Civici 2024-02-21 14:42:43 +03:00
parent e7e9ad2c7f
commit b13791e8bd
6 changed files with 198 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

126
components/lib/themes/primeone/base/editor/index.js Normal file
View File

@ -0,0 +1,126 @@
export default {
css: `
.p-editor-container .p-editor-toolbar {
background: var(--p-editor-toolbar-background);
border-top-right-radius: var(--p-rounded-base);
border-top-left-radius: var(--p-rounded-base);
}
.p-editor-container .p-editor-toolbar.ql-snow {
border: 1px solid var(--p-editor-toolbar-border-color);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-stroke {
stroke: var(--p-editor-toolbar-item-text-color);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-fill {
fill: var(--p-editor-toolbar-item-text-color);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label {
border: 0 none;
color: var(--p-editor-toolbar-item-text-color);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover {
color: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-stroke {
stroke: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker .ql-picker-label:hover .ql-fill {
fill: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
color: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
stroke: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
fill: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
background: var(--p-editor-overlay-background);
border: 1px solid var(--p-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: var(--p-rounded-base);
padding: 0.25rem 0.25rem;
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item {
color: var(--p-editor-overlay-item-text-color);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover {
color: var(--p-editor-overlay-item-text-color-hover);
background: var(--p-editor-overlay-item-background-hover);
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded:not(.ql-icon-picker) .ql-picker-item {
padding: 0.5rem 0.75rem;
}
.p-editor-container .p-editor-content {
border-bottom-right-radius: var(--p-rounded-base);
border-bottom-left-radius: var(--p-rounded-base);
}
.p-editor-container .p-editor-content.ql-snow {
border: 1px solid var(--p-editor-content-border-color);
}
.p-editor-container .p-editor-content .ql-editor {
background: var(--p-editor-content-background);
color: var(--p-editor-content-text-color);
border-bottom-right-radius: var(--p-rounded-base);
border-bottom-left-radius: var(--p-rounded-base);
}
.p-editor-container .ql-snow.ql-toolbar button:hover,
.p-editor-container .ql-snow.ql-toolbar button:focus {
color: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .ql-snow.ql-toolbar button:hover .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar button:focus .ql-stroke {
stroke: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .ql-snow.ql-toolbar button:hover .ql-fill,
.p-editor-container .ql-snow.ql-toolbar button:focus .ql-fill {
fill: var(--p-editor-toolbar-item-text-color-hover);
}
.p-editor-container .ql-snow.ql-toolbar button.ql-active,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected {
color: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke {
stroke: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-fill,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill {
fill: var(--p-editor-toolbar-item-text-color-active);
}
.p-editor-container .ql-snow.ql-toolbar button.ql-active .ql-picker-label,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-picker-label,
.p-editor-container .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-picker-label {
color: var(--p-editor-toolbar-item-text-color-active);
}
`
};

6
components/lib/themes/primeone/base/editor/package.json Normal file
View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

2
components/lib/themes/primeone/base/index.js
View File

@ -22,6 +22,7 @@ import dialog from 'primevue/themes/primeone/base/dialog';
import divider from 'primevue/themes/primeone/base/divider';
import dock from 'primevue/themes/primeone/base/dock';
import dropdown from 'primevue/themes/primeone/base/dropdown';
import editor from 'primevue/themes/primeone/base/editor';
import fieldset from 'primevue/themes/primeone/base/fieldset';
import galleria from 'primevue/themes/primeone/base/galleria';
import global from 'primevue/themes/primeone/base/global';
@ -104,6 +105,7 @@ export default {
divider,
dropdown,
dock,
editor,
fieldset,
galleria,
iconfield,

56
components/lib/themes/primeone/presets/aura/editor/index.js Normal file
View File

@ -0,0 +1,56 @@
export default {
colorScheme: {
light: {
toolbar: {
background: '{surface.0}',
borderColor: '{surface.200}'
},
toolbarItem: {
textColor: '{surface.500}',
textColorHover: '{surface.700}',
textColorActive: '{primary.color}'
},
overlay: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
},
overlayItem: {
backgroundHover: '{surface.100}',
textColor: '{surface.700}',
textColorHover: '{surface.800}'
},
content: {
background: '{surface.0}',
borderColor: '{surface.200}',
textColor: '{surface.700}'
}
},
dark: {
toolbar: {
background: '{surface.900}',
borderColor: '{surface.700}'
},
toolbarItem: {
textColor: '{surface.400}',
textColorHover: '{surface.0}',
textColorActive: '{primary.color}'
},
overlay: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
},
overlayItem: {
backgroundHover: '{surface.800}',
textColor: '{surface.400}',
textColorHover: '{surface.0}'
},
content: {
background: '{surface.900}',
borderColor: '{surface.700}',
textColor: '{surface.0}'
}
}
}
};

6
components/lib/themes/primeone/presets/aura/editor/package.json Normal file
View File

@ -0,0 +1,6 @@
{
"main": "./index.cjs.js",
"module": "./index.esm.js",
"unpkg": "./index.min.js",
"types": "./index.d.ts"
}

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

@ -22,6 +22,7 @@ import dialog from 'primevue/themes/primeone/presets/aura/dialog';
import divider from 'primevue/themes/primeone/presets/aura/divider';
import dock from 'primevue/themes/primeone/presets/aura/dock';
import dropdown from 'primevue/themes/primeone/presets/aura/dropdown';
import editor from 'primevue/themes/primeone/presets/aura/editor';
import fieldset from 'primevue/themes/primeone/presets/aura/fieldset';
import galleria from 'primevue/themes/primeone/presets/aura/galleria';
import iconfield from 'primevue/themes/primeone/presets/aura/iconfield';
@ -245,6 +246,7 @@ export default {
divider,
dock,
dropdown,
editor,
fieldset,
galleria,
iconfield,