first load
This commit is contained in:
331
templates/community_post_page.hbs
Normal file
331
templates/community_post_page.hbs
Normal file
@@ -0,0 +1,331 @@
|
||||
<div class="container-divider"></div>
|
||||
<div class="container">
|
||||
<div class="sub-nav">
|
||||
{{breadcrumbs}}
|
||||
<div class="search-container">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="search-icon" aria-hidden="true">
|
||||
<circle cx="4.5" cy="4.5" r="4" fill="none" stroke="currentColor"/>
|
||||
<path stroke="currentColor" stroke-linecap="round" d="M11 11L7.5 7.5"/>
|
||||
</svg>
|
||||
{{search scoped=settings.scoped_community_search submit=false}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="post-container">
|
||||
<div class="post">
|
||||
<article id="main-content">
|
||||
<div class="post-header">
|
||||
<div class="post-title">
|
||||
<h1 title="{{post.title}}">
|
||||
{{post.title}}
|
||||
{{#if post.internal}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16" class="icon-lock" title="{{t 'internal'}}">
|
||||
<rect width="12" height="9" x="2" y="7" fill="currentColor" rx="1" ry="1"/>
|
||||
<path fill="none" stroke="currentColor" d="M4.5 7.5V4a3.5 3.5 0 017 0v3.5"/>
|
||||
</svg>
|
||||
{{/if}}
|
||||
</h1>
|
||||
{{#if post.pinned}}
|
||||
<span class="status-label status-label-pinned">{{t 'pinned'}}</span>
|
||||
{{/if}}
|
||||
|
||||
{{#if post.featured}}
|
||||
<span class="status-label status-label-featured">{{t 'featured'}}</span>
|
||||
{{/if}}
|
||||
|
||||
{{#is post.status 'none'}}
|
||||
{{else}}
|
||||
<span class="status-label-{{post.status_dasherized}} status-label">{{post.status_name}}</span>
|
||||
{{/is}}
|
||||
</div>
|
||||
{{#if settings.show_follow_post}}
|
||||
<div class="community-follow">
|
||||
{{subscribe}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<section class="post-info-container">
|
||||
<div class="post-info">
|
||||
<div class="post-author">
|
||||
<div class="avatar post-avatar">
|
||||
{{#if post.author.agent}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" aria-hidden="true" viewBox="0 0 12 12" class="icon-agent" aria-label="{{t 'team_member' name=post.author.name}}">
|
||||
<path fill="currentColor" d="M6 0C2.7 0 0 2.7 0 6s2.7 6 6 6 6-2.7 6-6-2.7-6-6-6zm0 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm2.3 7H3.7c-.3 0-.4-.3-.3-.5C3.9 7.6 4.9 7 6 7s2.1.6 2.6 1.5c.1.2 0 .5-.3.5z"/>
|
||||
</svg>
|
||||
{{/if}}
|
||||
<img src="{{post.author.avatar_url}}" alt="" class="user-avatar"/>
|
||||
</div>
|
||||
<div class="post-meta">
|
||||
<span title="{{post.author.name}}">
|
||||
{{#link 'user_profile' id=post.author.id}}
|
||||
{{post.author.name}}
|
||||
{{/link}}
|
||||
</span>
|
||||
|
||||
<ul aria-label="{{t 'badges'}}" class="community-badge-titles">
|
||||
{{#each (filter post.author.badges on="category_slug" equals="titles")}}
|
||||
<li class="community-badge community-badge-title" title="{{description}}" aria-label="{{name}}">
|
||||
{{name}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
<div class="meta-group meta-group-opposite">
|
||||
{{#if post.editor}}
|
||||
<span class="meta-data">{{date post.edited_at timeago=true}}</span>
|
||||
<span class="meta-data">{{t 'edited'}}</span>
|
||||
{{else}}
|
||||
<span class="meta-data">{{date post.created_at timeago=true}}</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
<ul aria-label="{{t 'badges'}}" class="community-badge-achievements">
|
||||
{{#each (slice (filter post.author.badges on="category_slug" equals="achievements") 0 4)}}
|
||||
<li class="community-badge community-badge-achievement">
|
||||
<img src="{{icon_url}}" alt="{{name}}" title="{{name}} | {{description}}" />
|
||||
</li>
|
||||
{{/each}}
|
||||
|
||||
{{#if (compare (calc post.author.badges.length "-" 4) ">" 0)}}
|
||||
<li class="community-badge community-badge-achievement">
|
||||
<a href="{{page_path "user_profile" id=post.author.id filter_by="badges"}}" class="community-badge-achievements-rest" aria-label="{{t 'more_awards_to' count=(calc post.author.badges.length "-" 4) name=post.author.name}}">
|
||||
{{t 'plus_more' count=(calc post.author.badges.length "-" 4)}}
|
||||
</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{{#if post.pending}}
|
||||
<span class="status-label status-label-pending-moderation">{{t 'pending_approval'}}</span>
|
||||
{{/if}}
|
||||
|
||||
{{#with post.ticket}}
|
||||
<a href="{{url}}" target="_zendesk_lotus" class="status-label escalation-badge">
|
||||
{{t 'request'}}{{id}}
|
||||
</a>
|
||||
{{/with}}
|
||||
</div>
|
||||
|
||||
|
||||
<div class="post-content">
|
||||
<div class="post-body">{{post.details}}</div>
|
||||
</div>
|
||||
|
||||
{{#if (compare post.content_tags.length ">" 0)}}
|
||||
<section class="content-tags">
|
||||
<p>{{t 'content_tags_label'}}</p>
|
||||
<ul class="content-tag-list">
|
||||
{{#each post.content_tags}}
|
||||
<li class="content-tag-item" data-content-tag-id="{{id}}">
|
||||
{{#link "search_result" content_tag_id=id}}
|
||||
{{name}}
|
||||
{{/link}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</section>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="post-actions-wrapper">
|
||||
<div class="post-vote vote" role="group">
|
||||
{{#with post}}
|
||||
{{#vote 'up' role='radio' class='vote-up' selected_class='vote-voted'}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M4 6.5l3.6 3.6c.2.2.5.2.7 0L12 6.5"/>
|
||||
</svg>
|
||||
{{/vote}}
|
||||
{{vote 'sum' class='vote-sum'}}
|
||||
{{#vote 'down' role='radio' class='vote-down' selected_class='vote-voted'}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M4 6.5l3.6 3.6c.2.2.5.2.7 0L12 6.5"/>
|
||||
</svg>
|
||||
{{/vote}}
|
||||
{{/with}}
|
||||
</div>
|
||||
|
||||
<div class="post-actions actions">
|
||||
{{#post.actions}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" d="M13.17 3.07l-1.64.71c-.48-.4-1.03-.72-1.63-.94l-.22-1.79a.511.511 0 00-.4-.44C8.86.54 8.44.5 8 .5c-.44 0-.86.04-1.28.11-.22.04-.38.22-.4.44l-.21 1.79c-.6.22-1.15.54-1.63.94l-1.65-.71a.491.491 0 00-.58.13c-.55.65-.99 1.4-1.29 2.21-.08.21 0 .44.18.58l1.45 1.08a4.91 4.91 0 000 1.87l-1.45 1.08c-.18.13-.25.37-.18.58.3.81.74 1.55 1.28 2.2.14.17.38.22.58.13l1.65-.71c.48.4 1.03.72 1.63.94l.21 1.79c.03.22.19.4.4.44.43.07.85.11 1.29.11.44 0 .86-.04 1.28-.11.22-.04.38-.22.4-.44l.21-1.79c.6-.22 1.15-.54 1.63-.94l1.65.71c.2.09.44.04.58-.13.54-.65.98-1.39 1.28-2.2.08-.21 0-.44-.18-.57L13.4 8.95c.07-.32.1-.63.1-.95s-.03-.63-.09-.94l1.45-1.08c.18-.13.25-.37.18-.58-.3-.81-.74-1.55-1.28-2.2a.51.51 0 00-.59-.13z"/>
|
||||
<circle cx="8" cy="8" r="2.5" fill="none" stroke="currentColor"/>
|
||||
</svg>
|
||||
{{/post.actions}}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{{#if settings.show_post_sharing}}
|
||||
<footer class="post-footer">
|
||||
<div class="post-share">{{share}}</div>
|
||||
{{#if comments}}
|
||||
<a href="#comment-overview" class="post-comment-count">
|
||||
<svg role="img" aria-labelledby="post-comments-title post-comments-desc" xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="icon-comments">
|
||||
<title id="post-comments-title">{{t 'go_to_comments'}}</title>
|
||||
<desc id="post-comments-desc">{{t 'comments_count' count=post.comment_count}}</desc>
|
||||
<path fill="none" stroke="currentColor" d="M1 .5h10c.3 0 .5.2.5.5v7c0 .3-.2.5-.5.5H6l-2.6 2.6c-.3.3-.9.1-.9-.4V8.5H1C.7 8.5.5 8.3.5 8V1C.5.7.7.5 1 .5z"/>
|
||||
</svg>
|
||||
<span aria-hidden="true">{{post.comment_count}}</span>
|
||||
</a>
|
||||
{{/if}}
|
||||
</footer>
|
||||
{{/if}}
|
||||
</article>
|
||||
|
||||
<section class="comment-overview" id="comment-overview">
|
||||
<h2 class="comment-heading">
|
||||
{{t 'comments'}}
|
||||
</h2>
|
||||
<p class="comment-callout">{{t 'comments_count' count=post.comment_count}}</p>
|
||||
{{#if comments}}
|
||||
<div class="dropdown comment-sorter">
|
||||
<button class="dropdown-toggle" aria-haspopup="true" aria-expanded="false">
|
||||
{{t 'sort_by'}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12" class="dropdown-chevron-icon" aria-hidden="true">
|
||||
<path fill="none" stroke="currentColor" stroke-linecap="round" d="M3 4.5l2.6 2.6c.2.2.5.2.7 0L9 4.5"/>
|
||||
</svg>
|
||||
</button>
|
||||
<span class="dropdown-menu" role="menu">
|
||||
{{#each comment_sorters}}
|
||||
<a aria-checked="{{selected}}" href="{{url}}" role="menuitemradio">{{name}}</a>
|
||||
{{/each}}
|
||||
</span>
|
||||
</div>
|
||||
{{/if}}
|
||||
</section>
|
||||
|
||||
<ul id="comments" class="comment-list">
|
||||
{{#each comments}}
|
||||
<li id="{{anchor}}" class="comment">
|
||||
<div class="comment-wrapper {{#if official}} comment-official {{/if}}">
|
||||
<div class="comment-info">
|
||||
{{#if official}}
|
||||
<span class="comment-official status-label status-label-official">{{t 'official_comment'}}</span>
|
||||
{{/if}}
|
||||
|
||||
<div class="comment-author">
|
||||
<div class="avatar comment-avatar">
|
||||
{{#if author.agent}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" aria-hidden="true" viewBox="0 0 12 12" class="icon-agent" aria-label="{{t 'team_member' name=author.name}}">
|
||||
<path fill="currentColor" d="M6 0C2.7 0 0 2.7 0 6s2.7 6 6 6 6-2.7 6-6-2.7-6-6-6zm0 2c1.1 0 2 .9 2 2s-.9 2-2 2-2-.9-2-2 .9-2 2-2zm2.3 7H3.7c-.3 0-.4-.3-.3-.5C3.9 7.6 4.9 7 6 7s2.1.6 2.6 1.5c.1.2 0 .5-.3.5z"/>
|
||||
</svg>
|
||||
{{/if}}
|
||||
<img src="{{author.avatar_url}}" alt="" class="user-avatar"/>
|
||||
</div>
|
||||
<div class="comment-meta">
|
||||
<span title="{{author.name}}" id="{{anchor}}-author">
|
||||
{{#link 'user_profile' id=author.id}}
|
||||
{{author.name}}
|
||||
{{/link}}
|
||||
</span>
|
||||
|
||||
<ul aria-label="{{t 'badges'}}" class="community-badge-titles">
|
||||
{{#each (filter author.badges on="category_slug" equals="titles")}}
|
||||
<li class="community-badge community-badge-title" title="{{description}}" aria-label="{{name}}">
|
||||
{{name}}
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
<div class="meta-group meta-group-opposite">
|
||||
{{#if editor}}
|
||||
<span class="meta-data">{{date edited_at timeago=true}}</span>
|
||||
<span class="meta-data">{{t 'edited'}}</span>
|
||||
{{else}}
|
||||
<span class="meta-data">{{date created_at timeago=true}}</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<ul aria-label="{{t 'badges'}}" class="community-badge-achievements">
|
||||
{{#each (slice (filter author.badges on="category_slug" equals="achievements") 0 4)}}
|
||||
<li class="community-badge community-badge-achievement">
|
||||
<img src="{{icon_url}}" alt="{{name}}" title="{{name}} | {{description}}" />
|
||||
</li>
|
||||
{{/each}}
|
||||
|
||||
{{#if (compare (calc author.badges.length "-" 4) ">" 0)}}
|
||||
<li class="community-badge community-badge-achievement">
|
||||
<a href="{{page_path "user_profile" id=author.id filter_by="badges"}}" class="community-badge-achievements-rest" aria-label="{{t 'more_awards_to' count=(calc author.badges.length "-" 4) name=author.name}}">
|
||||
{{t 'plus_more' count=(calc author.badges.length "-" 4)}}
|
||||
</a>
|
||||
</li>
|
||||
{{/if}}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="comment-labels">
|
||||
{{#with ticket}}
|
||||
<a href="{{url}}" target="_zendesk_lotus" class="status-label escalation-badge">
|
||||
{{t 'request'}} {{id}}
|
||||
</a>
|
||||
{{/with}}
|
||||
{{#if pending}}
|
||||
<span class="comment-pending status-label status-label-pending-moderation">{{t 'pending_approval'}}</span>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="comment-body" id="{{anchor}}-body">{{body}}</section>
|
||||
</div>
|
||||
|
||||
<div class="comment-actions-container">
|
||||
{{#unless official}}
|
||||
<div class="comment-vote vote" role="group">
|
||||
{{#vote 'up' class='vote-up' selected_class='vote-voted' aria-describedby=(concat anchor "-author " anchor "-body")}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M4 6.5l3.6 3.6c.2.2.5.2.7 0L12 6.5"/>
|
||||
</svg>
|
||||
{{/vote}}
|
||||
{{vote 'sum' class='vote-sum'}}
|
||||
{{#vote 'down' class='vote-down' selected_class='vote-voted' aria-describedby=(concat anchor "-author " anchor "-body")}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" stroke-linecap="round" stroke-width="2" d="M4 6.5l3.6 3.6c.2.2.5.2.7 0L12 6.5"/>
|
||||
</svg>
|
||||
{{/vote}}
|
||||
</div>
|
||||
{{/unless}}
|
||||
<div class="comment-actions actions">
|
||||
{{#actions}}
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" focusable="false" viewBox="0 0 16 16">
|
||||
<path fill="none" stroke="currentColor" d="M13.17 3.07l-1.64.71c-.48-.4-1.03-.72-1.63-.94l-.22-1.79a.511.511 0 00-.4-.44C8.86.54 8.44.5 8 .5c-.44 0-.86.04-1.28.11-.22.04-.38.22-.4.44l-.21 1.79c-.6.22-1.15.54-1.63.94l-1.65-.71a.491.491 0 00-.58.13c-.55.65-.99 1.4-1.29 2.21-.08.21 0 .44.18.58l1.45 1.08a4.91 4.91 0 000 1.87l-1.45 1.08c-.18.13-.25.37-.18.58.3.81.74 1.55 1.28 2.2.14.17.38.22.58.13l1.65-.71c.48.4 1.03.72 1.63.94l.21 1.79c.03.22.19.4.4.44.43.07.85.11 1.29.11.44 0 .86-.04 1.28-.11.22-.04.38-.22.4-.44l.21-1.79c.6-.22 1.15-.54 1.63-.94l1.65.71c.2.09.44.04.58-.13.54-.65.98-1.39 1.28-2.2.08-.21 0-.44-.18-.57L13.4 8.95c.07-.32.1-.63.1-.95s-.03-.63-.09-.94l1.45-1.08c.18-.13.25-.37.18-.58-.3-.81-.74-1.55-1.28-2.2a.51.51 0 00-.59-.13z"/>
|
||||
<circle cx="8" cy="8" r="2.5" fill="none" stroke="currentColor"/>
|
||||
</svg>
|
||||
{{/actions}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
|
||||
{{pagination}}
|
||||
|
||||
<section class="post-comments">
|
||||
{{#form 'comment' class='comment-form hbs-form'}}
|
||||
<div class="avatar comment-avatar">
|
||||
{{user_avatar class='user-avatar'}}
|
||||
</div>
|
||||
<div class="comment-container">
|
||||
{{wysiwyg 'body'}}
|
||||
<div class="comment-form-controls">
|
||||
{{checkbox 'official'}}
|
||||
{{label 'official'}}
|
||||
{{input type='submit' class="button button-large"}}
|
||||
</div>
|
||||
</div>
|
||||
{{/form}}
|
||||
</section>
|
||||
|
||||
<p class="comment-callout">{{comment_callout}}</p>
|
||||
</div>
|
||||
|
||||
<section class="post-sidebar">
|
||||
<h2 class="post-sidebar-title">{{t 'suggest_new_post'}}</h2>
|
||||
<span class="post-to-community">
|
||||
{{link 'new_post' class='button button-large'}}
|
||||
</span>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user