diff --git a/assets/static/css/theme.css b/assets/static/css/theme.css index 7adfefb..bc659dc 100644 --- a/assets/static/css/theme.css +++ b/assets/static/css/theme.css @@ -592,10 +592,12 @@ body { .ql-toolbar.ql-snow { background: oklch(var(--b2)); } -.ql-snow .ql-stroke { +.ql-snow .ql-stroke, +.ql-snow .ql-stroke-miter { stroke: oklch(var(--bc)); } -.ql-snow .ql-fill { +.ql-snow .ql-fill, +.ql-snow .ql-stroke.ql-fill { fill: oklch(var(--bc)); } .ql-snow .ql-picker, @@ -606,6 +608,66 @@ body { background: oklch(var(--b1)); border-color: oklch(var(--b3)); } +.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label, +.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options { + border-color: oklch(var(--b3)); +} +/* active / hover toolbar state -> gruvbox accent */ +.ql-snow.ql-toolbar button:hover, +.ql-snow.ql-toolbar button:focus, +.ql-snow.ql-toolbar button.ql-active, +.ql-snow.ql-toolbar .ql-picker-label:hover, +.ql-snow.ql-toolbar .ql-picker-label.ql-active, +.ql-snow.ql-toolbar .ql-picker-item:hover, +.ql-snow.ql-toolbar .ql-picker-item.ql-selected, +.ql-snow .ql-picker.ql-expanded .ql-picker-label { + color: oklch(var(--p)); +} +.ql-snow.ql-toolbar button:hover .ql-stroke, +.ql-snow.ql-toolbar button:focus .ql-stroke, +.ql-snow.ql-toolbar button.ql-active .ql-stroke, +.ql-snow.ql-toolbar button:hover .ql-stroke-miter, +.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter, +.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-item:hover .ql-stroke, +.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke, +.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke { + stroke: oklch(var(--p)); +} +.ql-snow.ql-toolbar button:hover .ql-fill, +.ql-snow.ql-toolbar button:focus .ql-fill, +.ql-snow.ql-toolbar button.ql-active .ql-fill, +.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill, +.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill, +.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill, +.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill, +.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill, +.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill, +.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill { + fill: oklch(var(--p)); +} +/* link tooltip popup */ +.ql-snow .ql-tooltip { + background-color: oklch(var(--b1)); + border-color: oklch(var(--b3)); + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45); + color: oklch(var(--bc)); +} +.ql-snow .ql-tooltip input[type=text] { + background: oklch(var(--b2)); + border-color: oklch(var(--b3)); + color: oklch(var(--bc)); +} +.ql-snow .ql-tooltip a { + color: oklch(var(--p)); +} +.ql-snow .ql-tooltip a.ql-action::after { + border-color: oklch(var(--b3)); +} +.ql-snow .ql-editor a { + color: oklch(var(--p)); +} .blog-image-size-controls { display: flex; flex-wrap: wrap; @@ -633,7 +695,7 @@ body { gap: 0.4rem; } .blog-image-size-controls input { - width: 6rem; + width: 5rem; } .blog-editor img, .blog-content img { diff --git a/assets/static/js/blog-editor.js b/assets/static/js/blog-editor.js index 69428f1..e6e855e 100644 --- a/assets/static/js/blog-editor.js +++ b/assets/static/js/blog-editor.js @@ -1,10 +1,4 @@ (function () { - function firstFilenameFromEditor(editor) { - var image = editor.root.querySelector('img[src^="/images/"]'); - if (!image) return ''; - return image.getAttribute('src').replace('/images/', ''); - } - function setImageSize(image, size) { image.classList.remove('blog-image-small', 'blog-image-medium', 'blog-image-full'); image.style.removeProperty('width'); @@ -35,7 +29,6 @@ function initEditor(form) { var editorEl = form.querySelector('[data-rich-editor]'); var contentInput = form.querySelector('[data-rich-content]'); - var featuredInput = form.querySelector('[data-featured-image-id]'); var status = form.querySelector('[data-rich-status]'); var imageControls = form.querySelector('[data-image-size-controls]'); var imageWidthInput = form.querySelector('[data-image-width]'); @@ -64,7 +57,6 @@ function syncContent() { normalizeEditorImages(editor.root); contentInput.value = editor.root.innerHTML; - if (featuredInput && !featuredInput.value) featuredInput.value = firstFilenameFromEditor(editor); } function setStatus(message) { @@ -106,7 +98,6 @@ selectedImage = image; if (imageControls) imageControls.classList.remove('hidden'); } - if (featuredInput && !featuredInput.value) featuredInput.value = result.filename; syncContent(); }, 0); setStatus(status ? status.dataset.uploaded : ''); diff --git a/assets/views/admin/base.html b/assets/views/admin/base.html index de8b0e6..73b3855 100644 --- a/assets/views/admin/base.html +++ b/assets/views/admin/base.html @@ -37,8 +37,8 @@ }); - {% block head %}{% endblock head %} +