title/artist translation in 2 lines on mobile. hide - on mobile

This commit is contained in:
j 2021-10-14 14:00:41 +01:00
parent 67f76dbd66
commit d314ceb7ae
3 changed files with 18 additions and 7 deletions

View file

@ -21,6 +21,14 @@
h2 { h2 {
margin-bottom: var(--spacing); margin-bottom: var(--spacing);
} }
@media screen and (max-width: 799px) {
h1, h2 {
span {
display: block;
line-height: 1.3;
}
}
}
} }
} }
} }

View file

@ -22,9 +22,9 @@
</div> </div>
</a> </a>
<nav> <nav>
<a href="{% url 'films'%}">films - 影片</a> <a href="{% url 'films'%}">films <span class="hide-mobile">-</span> 影片</a>
<a href="{% url 'texts' %}">assemblies - 组件</a> <a href="{% url 'texts' %}">assemblies <span class="hide-mobile">-</span> 组件</a>
<a href="{% url 'about' %}">about - 關於</a> <a href="{% url 'about' %}">about <span class="hide-mobile">-</span> 關於</a>
</nav> </nav>
</div> </div>
<main> <main>

View file

@ -4,11 +4,14 @@
{% for film in films %} {% for film in films %}
<div class="film"> <div class="film">
<h1><a href="{{ film.get_absolute_url }}"> <h1><a href="{{ film.get_absolute_url }}">
{{ film.data.title | safe }} <span>{{ film.data.title | safe }}</span>
<span>{{ film.data.title_zh | safe }}</span>
{{ film.data.title_zh | safe }}
</a></h1> </a></h1>
<h2>{{ film.data.director|join:" "|safe }}</h2> <h2>
{% for director in film.data.director %}
<span>{{ director|safe }}</span>
{% endfor %}
</h2>
</div> </div>
{% endfor %} {% endfor %}
</div> </div>