{% for random_story in random_stories %}
    <div class="story-item">
        <h3><a href="{{ url_for('story.view', pk=random_story.id) }}">{{ random_story.title }}</a></h3>
        <p class="meta">
                <span class="category-list">
                    {%- for category in random_story.categories|sort(attribute='id') -%}
                        <a class="gen" style="background-color: {{ category.color }}" href="{{ url_for('search.simple', search_type='category', search_id=category.id) }}">{{ category.name }}</a>
                    {%- endfor -%}
                </span>
        </p>
        <p>{{ random_story.summary_as_html|striptags|truncate(120) }}</p>
        <p class="meta">
                <span class="character-list">
                    {%- for character in random_story.characters|sort(attribute='id') -%}
                        <a href="{{ url_for('search.simple', search_type='character', search_id=character.id) }}"><img src="{{ character.thumb }}" alt="{{ character.name }}" title="{{ character.name }}"/></a>
                    {%- endfor -%}
                </span>
        </p>
    </div>
{% endfor %}
