Створити

UJ 4.0: Додав стилі для мобільної версії і робота над редактором тексту

Додав початкові стилі для мобільної версії для стрічки дискуссій. І зробив першу версію редактора тексту.


Скріни мобільної версії:

Редактор тексту:

Редактор зробив на основі популярного редактора Tiptap, котрий оснований на ще більш популярному редакторі-фреймворку ProseMirror.

Наразі це технічна демка в окремому репозиторії, котра допілиться в окремий npm пакет, котрий можна буде вже підключити як залежність в основний проєкт:

Основні особливості:

  • Сфокусований на Markdown розмітці. На вхід очікує Markdown, на виході теж Markdown
  • Підтримує вставки. Достатньо додати пусту строку і вствити URL, котрий перетвориться на блок-вставку. Протестувати можна на вставці з Ютуб, але інші вставки, як і URL на невідомі сайти будуть вставляти фрейм, котрий очікує обробку URL нашим бекендом, котрої поки немає. Згодом додасться
  • Очищає текст від UTF-8 символів, котрі важко зустріти в адекватних текстах. Привіт, JS
  • Підтримує вставку Markdown. Текст скопійований з редактора автоматично перетворюється на Markdown теж
  • Підтримує ввод Markdown форматування. Наприклад, якщо додати *текст*, текст перетвориться на жирний. Привіт, Telegram

6 коментарів

Увійдіть, щоб коментувати.
2 бали
Поскаржитись

@javascript Редактор WYSIWYG, але продукує Markdown, це для сумісності з контентом, котрий у нас зараз на сайті і з двіжком Flarum, там теж все в Markdown.

1 бал
Поскаржитись

@javascript Демка редактора тут https://ujournal.github.io/commently-editor/ Фронт пофіксив, але він нічого спільного з новою версією немає. Залью новий десь на вихідних.

2 бали
Поскаржитись

мало що зрозумів але я в тебе вірю!

1 бал
Поскаржитись

@javascript Протестуй, плз, редактор на вставку різного хламу, спецсимволів... Потрібна твоя допомога тут. Помʼятаєш, як цей сайт мучав?