#twig #tailwind-css
Вопрос:
Я пытаюсь использовать TailwindCSS @apply в дочернем компоненте, однако он не применяет стиль.
{% extends 'base.html.twig' %}
{% block stylesheets %}
{{parent()}}
<style>
h2 {
@apply text-3xl;
}
</style>
{% endblock %}
{% block body %}
<div class="container mx-auto text-dark-shade">
{% block content %}{% endblock %}
</div>
{% endblock %}
Используя стандартный CSS, он работает, и стиль применяется.
{% extends 'base.html.twig' %}
{% block stylesheets %}
{{parent()}}
<style>
h2 {
font-size: 3rem;
}
</style>
{% endblock %}
{% block body %}
<div class="container mx-auto text-dark-shade">
{% block content %}{% endblock %}
</div>
{% endblock %}
Он h2 отображается в блоке содержимого, он предназначен для компонента, который используется несколько раз повторно.
Комментарии:
1. Есть ли какие-либо другие стили, которые вы хотите переопределить или просто добавить стиль?
2. в настоящее время просто нужно добавить этот стиль, чтобы он заработал, но я захочу добавить больше. Компонент в настоящее время повторяется 10 раз, поэтому просто хотел упростить, вместо того, чтобы менять его в 10 местах.