Якщо ваша основна проблема полягає в тому, щоб змусити монохроматичне відображення, щоб смайли не сильно виділялися з тексту, фільтри CSS, як окремо, так і в поєднанні з селектором варіації Unicode, можуть бути тим, що вам потрібно.
p.gscale {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
a {
color: #999;
-webkit-filter: grayscale(100%) sepia(100%) saturate(400%) hue-rotate(170deg);
filter: grayscale(100%) sepia(100%) saturate(400%) hue-rotate(170deg);
}
<p class="gscale">You've now got emoji display on 🔒lockdown🔒.</p>
<p>External Link: <a href="https://knowyourmeme.com/memes/party-hard">celebrate 🎉</a></p>
На відміну від селектора варіації, не має значення, як відображаються смайли, тому що фільтри CSS застосовуються до всього. (Я використовую їх для розмальовування сірого піктограми формату PNG у форматі "тип посилання" на гіперпосиланнях, які були модифіковані для вказівки на машину зворотного зв'язку.)
Тільки пам’ятайте про застереження . Ви не можете змінити фільтр батьківського елемента у дочірній, тому цю техніку не можна використовувати для розмальовування сірого абзацу та повторного розфарбовування посилань у ньому. 😢
... все-таки це корисно для ситуацій, коли ви або збираєтесь робити всю справу гіперпосиланням, або забороняєте багату розмітку всередині неї. (наприклад, назви та описи)
Однак це не буде працювати, якщо CSS фактично не застосується, тому я дам другий варіант, який є надійнішим у <title>елементах, ніж селектор варіації Unicode (дивлюсь на вас, GitHub. Мені не подобаються підроблені значки в моїй вкладки браузера):
Якщо ви додаєте в <title>елемент рядок, що надається користувачем , відфільтруйте смайли разом із будь-яким жирним / курсивним / підкресленням тощо. розмітка. (Так, для тих, хто цього пропустив, стандарт <title>вимагає, щоб вміст був простим текстом, окрім амперсанда та біг, а браузери я перевіряв усі теги інтерпретації як буквальний текст.)
Я думаю про два способи:
- Безпосередньо використовуйте вручну підтримуваний регулярний вираз, який відповідає блокам, куди найновіша версія Unicode розміщує свої емоджи та їх модифікатори.
- Ітерайте через кластери графеми та відкиньте будь-які, які містять розпізнані кодові точки смайлів. (Кластер графеми - це базовий гліф плюс усі діакритики та інші модифікатори, які складають видимий символ. Приклад, з яким я посилаюсь, використовує регекс-механізм Python для токенізації, а потім
emojiпакет для бази даних, але Rust є хорошим прикладом мови де ітераційні кластери графеми - це швидко та легко за допомогою ящика unicode-segmentation.)
