Estoy intentando obtener una palabra única en una fuente particular en un componente de un tema que usamos, esto es para fines de identidad de marca.
El tema en cuestión (Sublime Theme) tiene un componente discourse-search-banner.
A este tema le he añadido el componente Blippo-font donde subí el archivo de fuente blippo-black.woff2. No hice ningún cambio en el css/html aquí.
El panel aquí muestra $blippo-black: blippo-black.woff2
En el componente discourse-search-banner de Sublime Theme, edité el css común para definir la clase blippo-black:
.ifutures {
font-family: 'blippo-black';
}
Luego edité el texto para search_banner.headline dentro del componente discourse-search-banner:
<span style="font-family:Poppins, Arial">Welcome to</span> <span class="ifutures">ifutures<span>!</b>
Al cargar la página en un navegador, la nueva fuente (blippo-black) no se aplica al texto dentro de la segunda etiqueta span, a pesar de que el panel de inspección en la ventana del navegador muestra que el texto tiene la etiqueta span a su alrededor:
<span class="ifutures">ifutures<span>
y que el css está siendo captado:
.ifutures {
font-family: "blippo-black";
}
¿Qué estoy haciendo mal?
¡Gracias!