Baklap4 Baklap4 - 6 months ago 20
CSS Question

Symfony Twig Stylesheets

Within my project setup i'm having this directory structure for css files:
css folder structure

Within my

base.html.twig
file i'm loading those files like this:

{% block stylesheets %}
{% stylesheets 'bundles/app/css/*' filter='cssrewrite' %}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}
{% endblock %}


But somehow the
css
files within my two folders aren't found. How would one get those
css
be included too?

Answer

The way you're doing this right now doesn't look recursive. So the folders FontAwesome and SimpleLintFont won't be included. To fix this i'm copying the stylesheets block for every subfolder like this:

{% block stylesheets %}
    {% stylesheets 'bundles/app/css/*' filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}
{% block stylesheets %}
    {% stylesheets 'bundles/app/css/FontAwesome/*' filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}
{% block stylesheets %}
    {% stylesheets 'bundles/app/css/SimpleLineFont/*' filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

As this is ugly and duplicate code one could combine the paths like this cleaner solution:

{% block stylesheets %}
    {% stylesheets 'bundles/app/css/*' 'bundles/app/css/SimpleLineFont/*' 'bundles/app/css/FontAwesome/*' filter='cssrewrite' %}
        <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}
Comments