I am making a theme based on another Zola theme and it is going great so far. The only problem I have run into is the following:
I am using Tailwind. It works well, but because Tailwind classes can add up, the Tailwind team reccomends using components. I know how to do this in Vue using Slots, but I have no idea how to do this with Tera/Zola or if this is even possible at all. Does anyone have an idea how to solve this problem elegantly in Zola/Tera
我正在根据左拉的另一个主题制作一个主题,到目前为止进展顺利。我遇到的唯一问题是:我正在使用Tailwind。它工作得很好,但由于Tailwind类可以相加,所以Tailwind团队建议使用组件。我知道如何在Vue中使用Slots来做到这一点,但我不知道如何使用Tera/Zola来做到,也不知道这是否可能。有人知道如何在左拉/特拉身上优雅地解决这个问题吗
I am now using the following hack. It works, but it is quite ugly and requires 2 files per "component".
我现在正在使用以下破解。它可以工作,但它非常难看,每个“组件”需要2个文件。
~It enables me to use consistent classes for links:
~它使我能够为链接使用一致的类:
_startlink.html
_startlink.html
<div class="tailwind classes here">
_endlink.html
_endlink.html
</div>
When using the "component"
使用“组件”时
{% include "_startlink.html" %}
<a href="/blog">blog</a>
{% include "_endlink.html" %}
My intuition says to do something like the following:
_link.html
_链接.html
<a class="Tailwind classes here" href=link> {%block link%} {% endblock link %} </a>
Using the component:
使用组件:
{% block link link="example.com" %} Link to example.com {% endblock link %}
Edit: I found a new way. I prefer it over the other one, but I still don't like it:
编辑:我找到了一条新路。我更喜欢它而不是另一个,但我仍然不喜欢它:
{% set tl_link = "tailwind classes here" %}
<a class="{{ tl_link }}"> text here </a>
更多回答
优秀答案推荐
我是一名优秀的程序员,十分优秀!