Si su principal preocupación es forzar la visualización monocromática para que los emoji no se destaquen demasiado del texto, los filtros CSS, ya sea solos o en combinación con el selector de variación Unicode, pueden ser algo que desee.
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>
A diferencia del selector de variaciones, no debería importar cómo se representen los emoji, porque los filtros CSS se aplican a todo. (Los uso para escalar iconos de tipo de enlace en formato PNG en escala de grises en hipervínculos que se han modificado para apuntar a Wayback Machine).
Solo ten en cuenta la advertencia . No puede anular el filtro de un elemento principal en un elemento secundario, por lo que esta técnica no se puede usar para escalar un párrafo en escala de grises y luego volver a colorear los enlaces dentro de él. 😢
... aún así, es útil para situaciones en las que convertirá todo en un hipervínculo o rechazará el marcado enriquecido dentro de él. (por ejemplo, títulos y descripciones)
Sin embargo, esto no funcionará a menos que se aplique CSS, así que daré una segunda opción que es más confiable en <title>elementos que el selector de variación Unicode (te estoy mirando GitHub. No me gustan los íconos falsos en mi pestañas del navegador):
Si está colocando una cadena proporcionada por el usuario en un <title>elemento, filtre el emoji junto con cualquier negrita / cursiva / subrayado / etc. margen. (Sí, para aquellos que se lo perdieron, el estándar exige que el contenido de <title>sea texto sin formato además de los caracteres de escape y los navegadores que probé interpretan todas las etiquetas como texto literal).
Las dos formas en las que puedo pensar son:
- Utilice directamente una expresión regular mantenida manualmente que coincida con los bloques donde la versión más reciente de Unicode coloca sus emoji y sus modificadores.
- Itere los grupos de grafemas y descarte los que contengan puntos de código emoji reconocidos. (Un grupo de grafemas es un glifo base más todos los diacríticos y otros modificadores que componen el carácter visible. El ejemplo al que me vinculo usa el motor de expresiones regulares de Python para tokenizar y luego el
emojipaquete para la base de datos, pero Rust es un buen ejemplo de un lenguaje donde la iteración de grupos de grafemas es rápida y fácil a través de una caja como unicode-segmentation).
