91 lines
3.9 KiB
SCSS
91 lines
3.9 KiB
SCSS
|
@import "./quill/snow.scss";
|
||
|
|
@import "quill-table-ui/src/index.scss";
|
||
|
|
|
||
|
|
.quill-editor-wrap{
|
||
|
|
position: relative;
|
||
|
|
min-height: 9rem;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quill-editor-wrap textarea{
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quill-editor{
|
||
|
|
flex-grow: 1;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quill-editor .ql-editor{
|
||
|
|
flex-grow: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.quill-loading{
|
||
|
|
position: absolute;
|
||
|
|
z-index: 10;
|
||
|
|
left: 0;
|
||
|
|
top: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
display: flex;
|
||
|
|
border-radius: var(--bs-border-radius);
|
||
|
|
border: var(--bs-border-width) solid var(--bs-border-color);
|
||
|
|
}
|
||
|
|
|
||
|
|
.quill-editor.ready + .quill-loading{
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
.ql-toolbar.ql-snow{
|
||
|
|
border: var(--bs-border-width) solid var(--bs-border-color);
|
||
|
|
border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.ql-container.ql-snow{
|
||
|
|
border: var(--bs-border-width) solid var(--bs-border-color);
|
||
|
|
border-top: 0;
|
||
|
|
border-radius: 0 0 var(--bs-border-radius) var(--bs-border-radius);
|
||
|
|
}
|
||
|
|
|
||
|
|
.ql-table-menu{
|
||
|
|
background: var(--bs-body-bg);
|
||
|
|
border: var(--bs-border-width) solid var(--bs-border-color);
|
||
|
|
}
|
||
|
|
.ql-table-menu__item-icon svg *{
|
||
|
|
fill: var(--bs-secondary);
|
||
|
|
}
|
||
|
|
.ql-table-menu__item:hover{
|
||
|
|
background: var(--bs-tertiary-bg);
|
||
|
|
}
|
||
|
|
|
||
|
|
// .ql-snow.ql-toolbar button:hover, .ql-snow .ql-toolbar button:hover, .ql-snow.ql-toolbar button:focus, .ql-snow .ql-toolbar button:focus, .ql-snow.ql-toolbar button.ql-active, .ql-snow .ql-toolbar button.ql-active, .ql-snow.ql-toolbar .ql-picker-label:hover, .ql-snow .ql-toolbar .ql-picker-label:hover, .ql-snow.ql-toolbar .ql-picker-label.ql-active, .ql-snow .ql-toolbar .ql-picker-label.ql-active, .ql-snow.ql-toolbar .ql-picker-item:hover, .ql-snow .ql-toolbar .ql-picker-item:hover, .ql-snow.ql-toolbar .ql-picker-item.ql-selected, .ql-snow .ql-toolbar .ql-picker-item.ql-selected{
|
||
|
|
// color: var(--bs-primary);
|
||
|
|
// }
|
||
|
|
// .ql-snow.ql-toolbar button:hover .ql-stroke, .ql-snow .ql-toolbar button:hover .ql-stroke, .ql-snow.ql-toolbar button:focus .ql-stroke, .ql-snow .ql-toolbar button:focus .ql-stroke, .ql-snow.ql-toolbar button.ql-active .ql-stroke, .ql-snow .ql-toolbar button.ql-active .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow.ql-toolbar button:hover .ql-stroke-miter, .ql-snow .ql-toolbar button:hover .ql-stroke-miter, .ql-snow.ql-toolbar button:focus .ql-stroke-miter, .ql-snow .ql-toolbar button:focus .ql-stroke-miter, .ql-snow.ql-toolbar button.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar button.ql-active .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter{
|
||
|
|
// stroke: var(--bs-primary);
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .ql-snow .ql-stroke{
|
||
|
|
// stroke: var(--bs-body-color);
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .ql-snow .ql-picker{
|
||
|
|
// color: var(--bs-body-color);
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .ql-snow .ql-picker-options{
|
||
|
|
// background-color: var(--bs-body-bg);
|
||
|
|
// color: var(--bs-body-color);
|
||
|
|
// }
|
||
|
|
|
||
|
|
// .ql-toolbar.ql-snow .ql-picker-options{
|
||
|
|
// border: var(--bs-dropdown-border-width) solid var(--bs-border-color-translucent);
|
||
|
|
// }
|