<div class="row position-relative"> {% if post.type == POST_TYPE_IMAGE %} <div class="col post_type_image"> <nav aria-label="breadcrumb" id="breadcrumb_nav" title="Navigation"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="/">{{ _('Home') }}</a></li> <li class="breadcrumb-item"><a href="/communities">{{ _('Communities') }}</a></li> <li class="breadcrumb-item"><a href="/c/{{ post.community.link() }}">{{ post.community.title }}</a></li> <li class="breadcrumb-item active">{{ post.title|shorten(15) }}</li> </ol> </nav> <div class="voting_buttons"> {% include "post/_post_voting_buttons.html" %} </div> <h1 class="mt-2">{{ post.title }}</h1> {% if post.url %} <p><small><a href="{{ post.url }}" rel="nofollow ugc">{{ post.url|shorten_url }} <img src="/static/images/external_link_black.svg" class="external_link_icon" alt="External link" /> </a></small></p> {% endif %} <p><small>submitted {{ moment(post.posted_at).fromNow() }} by {{ render_username(post.author) }} {% if post.edited_at %} edited {{ moment(post.edited_at).fromNow() }}{% endif %} </small></p> <div class="post_image"> <a href="{{ post.image.view_url() }}"><img src="{{ post.image.view_url() }}" alt="{{ post.image.alt_text }}" width="{{ post.image.width }}" height="{{ post.image.height }}" /></a> </div> </div> {% else %} <div class="col"> <nav aria-label="breadcrumb" id="breadcrumb_nav" title="Navigation"> <ol class="breadcrumb"> <li class="breadcrumb-item"><a href="/">{{ _('Home') }}</a></li> <li class="breadcrumb-item"><a href="/communities">{{ _('Communities') }}</a></li> <li class="breadcrumb-item"><a href="/c/{{ post.community.link() }}">{{ post.community.title }}</a></li> <li class="breadcrumb-item active">{{ post.title|shorten(15) }}</li> </ol> </nav> <div class="voting_buttons"> {% include "post/_post_voting_buttons.html" %} </div> <h1 class="mt-2">{{ post.title }}</h1> {% if post.type == POST_TYPE_LINK and post.image_id and not (post.url and 'youtube.com' in post.url) %} <div class="url_thumbnail"> <a href="{{ post.url }}"><img src="{{ post.image.thumbnail_url() }}" alt="{{ post.image.alt_text }}" width="{{ post.image.thumbnail_width }}" height="{{ post.image.thumbnail_height }}" /></a> </div> {% endif %} <p class="small">submitted {{ moment(post.posted_at).fromNow() }} by {{ render_username(post.author) }} {% if post.edited_at %} edited {{ moment(post.edited_at).fromNow() }}{% endif %} </p> {% if post.type == POST_TYPE_LINK %} <p><small><a href="{{ post.url }}" rel="nofollow ugc">{{ post.url|shorten_url }} <img src="/static/images/external_link_black.svg" class="external_link_icon" alt="External link" /></a> </small></p> {% if 'youtube.com' in post.url %} <div style="padding-bottom: 56.25%; position: relative;"><iframe style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%;" src="https://www.youtube.com/embed/{{ post.youtube_embed() }}?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture; fullscreen" width="100%" height="100%" frameborder="0"></iframe></div> {% endif %} {% elif post.type == POST_TYPE_IMAGE %} <div class="post_image"> <a href="{{ post.image.view_url() }}"><img src="{{ post.image.view_url() }}" alt="{{ post.image.alt_text }}" width="{{ post.image.width }}" height="{{ post.image.height }}" /></a> </div> {% else %} {% if post.image_id and not (post.url and 'youtube.com' in post.url) %} <a href="{{ post.image.view_url() }}"><img src="{{ post.image.thumbnail_url() }}" alt="{{ post.image.alt_text }}" width="{{ post.image.thumbnail_width }}" height="{{ post.image.thumbnail_height }}" /></a> {% endif %} {% endif %} {{ post.body_html|safe if post.body_html else '' }} </div> {% endif %} <a href="{{ url_for('post.post_options', post_id=post.id) }}" class="post_options_link" rel="nofollow"><span class="fe fe-options" title="Options"> </span></a> </div>