Создание заметок и обновление внешнего вида

Внёс очередные доработки в проект.
Первым делом добавил возможность создавать заметки прямо с главной страницы, через кнопочку "Создать". Она показывается только для юзеров с разрешением /put.
Чекбокс "активно" теперь отключен по умолчанию, а для для админов на главной видны неопубликованные заметки. Это сделано для возможности поглядеть, как будет выглядеть итоговый текст перед публикацией.
Затем решил, что разбивка на 2 колонки в форме заметки какая-то тесная, и перенёс настройки доступа вниз. Стало заметно удобнее.
Ну а потом решил доработать и внешний вид комментариев. Убрал обводку с тенью, стало совсем хорошо! Правда, насчёт линии над кнопками действий я всё еще не уверен.
Ну и, наконец, уменьшил базовый размер шрифта с 16 пикселей до 14. Учитывая, что я везде стараюсь указывать размеры в rem, это повляло не только на текст, но и на отступы.
На мой взгляд, так гораздо лучше - входит больше информации, читать удобнее.
Обновляемся из репозитория:
git pull
docker compose stop
docker compose up --build -d

13 comments

Александр Наумов
Василий, добрый день!
Подскажи, пожалуйста, как добавить в редактор плагин?
Решил добавить @editorjs/delimiter, установил его.
Затем импортировал в editor/js.client.vue  import Delimiter from '@editorjs/delimiter'
И добавил в блок blockTunes:
        blockTunes: {
          delete: {Delete: 'Удалить', 'Click to delete': 'Вы уверены?'},
          moveUp: {'Move up': 'Наверх'},
          moveDown: {'Move down': 'Вниз'},
          delimiter: Delimiter,
        },
Но ничего не выходит, пробовал разные варианты - но все тщетно.
Дай наводку, пожалуйста?
Василий Наумкин
Нужно добавлять в allBlocks, по образу и подобию других блоков, а потом активировать в настройках .env.
Ну или не добавлять, а использовать разделитель как 3 тире --- на новой строке, тогда будет полоса <hr/>.

Вот такая.
Александр Наумов
а потом активировать в настройках .env
Спасибо, не знал!
В целом у меня как-то не стабильно все выходит,  пока работает только вот такая конструкция:
{type: 'code', icon: 'ellipsis-h', class: Delimiter}, а если делаю: {type: 'delimiter', icon: 'ellipsis-h', class: Delimiter} то вообще кнопку не выводит хотя по логики должен, буду разбираться.
Василий Наумкин
После изменения .env контейнеры надо перезапускать, чтобы фронтенд был пересобран с новыми настройками.
Кнопки рисуются из enabledBlocks, которые генерируются из allBlocks плюс проверка настроек .env
Настройки EDITOR_TOPIC_BLOCKS и EDITOR_COMMENT_BLOCKS можно сделать пустыми на время экспериментов, тогда будут выводиться все доступные блоки из allBlocks
Александр Наумов
Василий, спасибо!
Настройки EDITOR_TOPIC_BLOCKS и EDITOR_COMMENT_BLOCKS можно сделать пустыми на время экспериментов, тогда будут выводиться все доступные блоки из allBlocks
Сделал пустые настройки,ни одна кнопка не вывелась, потому что: const editorBlocks = String(useRuntimeConfig().public.EDITOR_TOPIC_BLOCKS).split(',') || []
Василий, ты в свое время делал для MODX Автоматическая генерация оглавления страницы
вот я сейчас пытаюсь сделать навигацию по большим статьям, скажи, пожалуйста, свои мысли каким бы путем ты пошел бы, что бы реализовать подобное?
Александр Наумов
Вопрос закрыт, пришло понимание как нужно делать, буду пробовать.
Василий Наумкин
ни одна кнопка не вывелась, потому что
Да, ты прав, исправил.
каким бы путем ты пошел бы, что бы реализовать подобное?
Ниже уже ссылался на компонент editor/content.vue - вот его и надо мучать.
Там в переменной blocks идёт перебор блоков JSON для специальной обработки картинок, примерно так же можно отловить все заголовки и вывести по ним содержимое страницы.
Александр Наумов
Спасибо!!!
Александр Наумов
Василий, подскажи еще, пожалуйста:
 1. Почему после публикации я вижу:
Хотя в редакторе все было хорошо:
2. Могу ли я  id (с первой картинки) сделать красивым добавив код в файл js.client.vue или придется лезть в сам плагин node_modules/@editorjs/delimiter/?
Спасибо!
Александр Наумов
С первым вопросом разобрался, только вот не пойму  где, например  у TopicBlockHeader, правила находятся,  что бы из json сформировать заголовок?
Александр Наумов
Разобрался, все находится в файлах topic/block/
Василий Наумкин
Вижу что уже разобрался, но на будущее поясню, что при редактировании редактор сам рендерит блоки и сохраняет всё в JSON.
А на сайте этот JSON уже рендерится Vue, и там я делаю это по-своему, без редактора.
Компонент, который выводит содержимое заметок и комментов находится в componets/editor/content.vue - его и надо мучать при добавлении новых блоков.
У тебя, получается, срабатывает вот это условие и выводит блок как он есть - JSON:
<div v-else>{{ block }}</div>
Александр Наумов
Спасибо!!!
Orbita
The latest news about the project and unstable functionality. You can log in to the admin panel with login and password demo.
Online
Александр Наумов
7/9/2024, 24:06:38
Случайно забрел на Тинькофф Журнал https://journal.tinkoff.ru/friendship-ended-with-patreon/ и сразу...
Александр Наумов
6/25/2024, 10:22:06
Спасибо!!!
Александр Наумов
6/7/2024, 15:01:19
Василий, спасибо большое!
Александр Наумов
5/12/2024, 12:30:15
Спасибо!
Василий Наумкин
3/24/2024, 09:55:50
Спасибо, поправил, теперь всё работает! Можно делать git pull из репозитория и перезапускать контей...
Александр Наумов
2/16/2024, 13:52:10
Спасибо!
Камиль Галиев
12/1/2023, 11:56:40
Да, теперь работает нормально!
Subscriptions
Тестировщик
RUB 100 per month
Базовая подписка. Все платежи проводятся в тестовом режиме!
Подписчик
RUB 250 per month
Средний уровень подписки. Все платежи проводятся в тестовом режиме!
Советник
RUB 500 per month
Максимальный уровень подписки. Все платежи проводятся в тестовом режиме!