¿Cómo se usa las variables JavaScript al escribir estilos CSS en línea en una plantilla de jade?
Pregunta
Estoy tratando de insertar dinámicamente fragmentos de CSS. Idealmente, esto funcionaría:
style(type='text/css')
#header a#logo { background:url(constants.logo) no-repeat; }
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
#header a#logo { background-image: url(constants.logo_2x); }
}
Desafortunadamente, Constants.logo está / literalmente / se coloca en el DOM. Lo que funciona es lo siguiente:
!= "<style type='text/css'>"
!= "#header a#logo { background:url('"+constants.logo+"') no-repeat; }"
!= "@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {"
!= " #header a#logo { background-image: url('"+constants.logo_2x+"'); }"
!= "}</style>"
¿Hay una mejor manera?
Solución
Usar #{variable}
para imprimir una variable dentro del texto de un elemento.
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow