help_center 0.0.5 → 0.0.6

data/app/views/help_center/support_threads/_form.html.erb

@@ -1,49 +1,49 @@
-<%= form_for @support_thread,
-   url: (@support_thread.persisted? ? help_center.support_thread_path(@support_thread) : help_center.support_threads_path),
-   html: { data: {behavior: "comment-form"} } do |f| %>
-  <% if @support_thread.errors.any? %>
-    <div id="error_explanation">
-      <h2><%= pluralize(@support_thread.errors.count, "error") %> prohibited this support_thread from being saved:</h2>
-      <ul>
-      <% @support_thread.errors.full_messages.each do |message| %>
-        <li><%= message %></li>
-      <% end %>
-      </ul>
-    </div>
-  <% end %>
-  <div class="mb-4">
-    <%= f.label :support_category_id, t('choose_a_category') %>
-    <%= f.collection_select :support_category_id, SupportCategory.sorted, :id, :name, {include_blank: t('pick_a_category')}, {autofocus: true, class: "form-control form-input"} %>
-  </div>
-  <div class="mb-4">
-    <%= f.label t('title') %>
-    <%= f.text_field :title, placeholder: t('how_do_i'), class: "form-control form-input" %>
-  </div>
-  <div class="mb-4">
-    <%= f.label t('position') %>
-    <%= f.text_field :position, class: "form-control form-input" %>
-  </div>
-  <div class="mb-4">
-    <%= f.label t('content')  %>
-    <%= f.rich_text_area :content %>
-  </div>
-  <% if local_assigns.fetch(:posts, true) %>
-  <% if !f.object.new_record? %>
-    <%= f.fields_for :support_posts do |p| %>
-      <div class="mb-4">
-        <%= p.label :body, t('what_help_needed') %>
-        <%= p.text_area :body, placeholder: t('add_a_comment'), rows: 10, class: "form-control simplemde", data: { behavior: "comment-body" } %>
-      </div>
-    <% end %>
-    <% end %>
-  <% end %>
-  <div class="flex justify-between mb-4 text-right">
-    <% if f.object.new_record? %>
-      <%= f.button t('add'), class: "btn btn-primary", data: {disable_with: "<i class='fa fa-spinner fa-spin'></i> #{t('saving')}"} %>
-    <% else %>
-      <%= f.button t('update'), class: "btn btn-primary", data: {disable_with: "<i class='fa fa-spinner fa-spin'></i> #{t('saving')}"} %>
-    <% end %>
-
-    <%= link_to "Cancel", :back, class: "btn btn-link" %>
-  </div>
-<% end %>
+<%= form_for @support_thread,
+   url: (@support_thread.persisted? ? help_center.support_thread_path(@support_thread) : help_center.support_threads_path),
+   html: { data: {behavior: "comment-form"} } do |f| %>
+  <% if @support_thread.errors.any? %>
+    <div id="error_explanation">
+      <h2><%= pluralize(@support_thread.errors.count, "error") %> prohibited this support_thread from being saved:</h2>
+      <ul>
+      <% @support_thread.errors.full_messages.each do |message| %>
+        <li><%= message %></li>
+      <% end %>
+      </ul>
+    </div>
+  <% end %>
+  <div class="mb-4">
+    <%= f.label :support_category_id, t('choose_a_category') %>
+    <%= f.collection_select :support_category_id, SupportCategory.sorted, :id, :name, {include_blank: t('pick_a_category')}, {autofocus: true, class: "form-control form-input"} %>
+  </div>
+  <div class="mb-4">
+    <%= f.label t('title') %>
+    <%= f.text_field :title, placeholder: t('how_do_i'), class: "form-control form-input" %>
+  </div>
+  <div class="mb-4">
+    <%= f.label t('position') %>
+    <%= f.text_field :position, type: "number", step: "1", min: "0", class: "form-control form-input" %>
+  </div>
+  <div class="mb-4">
+    <%= f.label t('content')  %>
+    <%= f.rich_text_area :content %>
+  </div>
+  <% if local_assigns.fetch(:posts, true) %>
+  <% if !f.object.new_record? %>
+    <%= f.fields_for :support_posts do |p| %>
+      <div class="mb-4">
+        <%= p.label :body, t('what_help_needed') %>
+        <%= p.text_area :body, placeholder: t('add_a_comment'), rows: 10, class: "form-control simplemde", data: { behavior: "comment-body" } %>
+      </div>
+    <% end %>
+    <% end %>
+  <% end %>
+  <div class="flex justify-between mb-4 text-right">
+    <% if f.object.new_record? %>
+      <%= f.button t('add'), class: "btn btn-primary", data: {disable_with: "<i class='fa fa-spinner fa-spin'></i> #{t('saving')}"} %>
+    <% else %>
+      <%= f.button t('update'), class: "btn btn-primary", data: {disable_with: "<i class='fa fa-spinner fa-spin'></i> #{t('saving')}"} %>
+    <% end %>
+
+    <%= link_to "Cancel", :back, class: "btn btn-link" %>
+  </div>
+<% end %>

data/app/views/help_center/support_threads/_support_thread.html.erb

@@ -1,25 +1,25 @@
-<%= cache support_thread do %>
-  <div class="support-thread">
-    <div class="flex flex-wrap">
-      <div class="flex-grow mb-2">
-            <%= link_to help_center.support_thread_path(support_thread) do %>
-        <h4>
-           <%= support_thread.title %>
-        </h4>
-        <p class="text-gray-500 hover:text-gray-700"><%= truncate(support_thread.content.to_plain_text, length: 200) %></p>
-        <div class="thread-details mt-2">
-            <%= t('content_updated_at', update_time: time_ago_in_words(support_thread.created_at)) %>
-        </div>
-        <% end %>
-      </div>
-     <% if HelpCenter.enable_comments %>
-      <div class="sm:w-1/6 pr-4 pl-4 text-center">
-        <%= link_to help_center.support_thread_path(support_thread), class: "thread-posts-count" do %>
-          <span class="count"><%= support_thread.support_posts_count %></span>
-          <small><%= t("post", count: support_thread.support_posts_count) %></small>
-        <% end %>
-      </div>
-    <% end %>
-    </div>
-  </div>
-<% end %>
+<%= cache support_thread do %>
+  <div class="support-thread">
+    <div class="flex flex-wrap">
+      <div class="flex-grow mb-2">
+            <%= link_to help_center.support_thread_path(support_thread) do %>
+        <h4>
+           <%= support_thread.title %>
+        </h4>
+        <p class="text-gray-500 hover:text-gray-700"><%= truncate(support_thread.content.to_plain_text, length: 200) %></p>
+        <div class="thread-details mt-2">
+            <%= t('content_updated_at', update_time: time_ago_in_words(support_thread.created_at)) %>
+        </div>
+        <% end %>
+      </div>
+     <% if HelpCenter.enable_comments %>
+      <div class="sm:w-1/6 pr-4 pl-4 text-center">
+        <%= link_to help_center.support_thread_path(support_thread), class: "thread-posts-count" do %>
+          <span class="count"><%= support_thread.support_posts_count %></span>
+          <small><%= t("post", count: support_thread.support_posts_count) %></small>
+        <% end %>
+      </div>
+    <% end %>
+    </div>
+  </div>
+<% end %>

data/app/views/help_center/support_threads/edit.html.erb

@@ -1,7 +1,7 @@
-<%= content_for :title, "Edit Thread" %>
-
-<h1 class="mb-4 font-bold"><%= t('edit_thread') %></h1>
-
-<div class="support_post">
-  <%= render 'form', posts: false %>
-</div>
+<%= content_for :title, "Edit Thread" %>
+
+<h1 class="mb-4 font-bold"><%= t('edit_thread') %></h1>
+
+<div class="support_post">
+  <%= render 'form', posts: false %>
+</div>

data/app/views/help_center/support_threads/index.html.erb

@@ -1,19 +1,19 @@
-<% if @support_threads.none? %>
-    <div><%= t('search_not_found') %>. <%= t('check_out') %> <%= link_to t('latest_questions'), help_center.support_threads_path %> <%= t('instead') %> </div>
-<% else %>
-<div class="container mx-auto">
-    <% if request.url.include?('category') %>
-      <%# If category, list all articles %>
-      <div class="w-1/62 text-left p-0">
-        <h3> <%= @support_threads.first.support_category.name %></h3>
-      </div>
-      <hr>
-      <%= render partial: "help_center/support_threads/support_thread", collection: @support_threads, spacer_template: "shared/spacer" %>
-      <div class="support-threads-nav text-center">
-      <%== pagy_nav(@pagy) %>
-     </div>
-    <% else %>
-     <%# Set default index here %>
-  <% end %>
-</div>
-<% end %>
+<% if @support_threads.none? %>
+    <div><%= t('search_not_found') %>. <%= t('check_out') %> <%= link_to t('latest_questions'), help_center.support_threads_path %> <%= t('instead') %> </div>
+<% else %>
+<div class="container mx-auto">
+    <% if request.url.include?('category') %>
+      <%# If category, list all articles %>
+      <div class="w-1/62 text-left p-0">
+        <h3> <%= @support_threads.first.support_category.name %></h3>
+      </div>
+      <hr>
+      <%= render partial: "help_center/support_threads/support_thread", collection: @support_threads, spacer_template: "shared/spacer" %>
+      <div class="support-threads-nav text-center">
+      <%== pagy_nav(@pagy) %>
+     </div>
+    <% else %>
+     <%# Set default index here %>
+  <% end %>
+</div>
+<% end %>

data/app/views/help_center/support_threads/new.html.erb

@@ -1,5 +1,5 @@
-<h1 class="mb-4 font-bold"><%= t('add_category') %></h1>
-
-<div class="support_post">
-  <%= render 'form' %>
-</div>
+<h1 class="mb-4 font-bold"><%= t('add_article') %></h1>
+
+<div class="support_post">
+  <%= render 'form' %>
+</div>

data/app/views/help_center/support_threads/show.html.erb

@@ -1,42 +1,29 @@
-<div class="container mx-auto">
-<div class="flex flex-wrap mb-8">
-  <% if is_moderator_or_owner?(@support_thread) %>
-    <div class="mb-4 bg-purple-600 flex w-full px-4 py-2 text-sm justify-end items-center">
-      <span class="mr-4 text-gray-200"><i class="far fa-sort-amount-down"></i> <%= @support_thread.position %> </span>
-      <%= link_to icon("fas","pencil") + " Edit", help_center.edit_support_thread_path(@support_thread),
-        class: "text-gray-200",
-        data: { toggle: "tooltip", placement: "left" },
-        title: t('edit_this_thread') %>
-
-        <%= link_to icon("fas","trash") + " Delete", help_center.support_thread_path(@support_thread),
-          method: :delete,
-          class: "text-gray-200 ml-4",
-          data: { toggle: "tooltip", placement: "left", confirm: "Are you sure?" },
-          title: t('delete_category') %>
-    </div>
-  <% end %>
-  <div class="md:w-full pr-4 pl-41">
-    <small class="mb-2" style="color: <%= @support_thread.support_category.color %>"><%= link_to @support_thread.support_category.name, help_center.support_category_path(@support_thread.support_category) %> > <%= @support_thread.title %></small>
-    <h1 class="mb-4 font-bold"><%= icon "fas", "thumb-tack", class: "text-muted" if @support_thread.pinned? %> <%= @support_thread.title %></h1>
-  </div>
-
-</div>
-
-<%= @support_thread.content %>
-
-<p class="mt-6 italic text-gray-400">Last Updated: <%= @support_thread.updated_at.strftime("%B %e, %Y") %> <p>
-<!--
-<div class="thread-reaction">
-  <p>Did this answer your question?</p>
-  <p class="thread-reaction-links">
-    <a>😞<a>
-    <a>😃<a>
-  </p>
-<div>
--->
-<% if HelpCenter.enable_comments %>
- <hr>
- <%= render partial: "help_center/support_posts/support_post", collection: @support_thread.support_posts.includes(:user).sorted %>
- <%= render partial: "help_center/support_posts/form" if user_signed_in? %>
-<% end %>
-</div>
+<div class="container mx-auto">
+<div class="flex flex-wrap mb-8">
+  <%= render partial: "shared/thread_actions" if is_moderator_or_owner?(@support_thread)%>
+
+  <div class="md:w-full pr-4 pl-41">
+    <small class="mb-2 tracking-normal font-normal" style="color: <%= @support_thread.support_category.color %>"><%= link_to @support_thread.support_category.name, help_center.support_category_path(@support_thread.support_category) %> > <%= @support_thread.title %></small>
+    <h1 class="mb-4 font-bold tracking-normal"><%= icon "fas", "thumb-tack", class: "text-muted" if @support_thread.pinned? %> <%= @support_thread.title %></h1>
+  </div>
+
+</div>
+
+<%= @support_thread.content %>
+
+<p class="mt-6 italic text-gray-400">Last Updated: <%= @support_thread.updated_at.strftime("%B %e, %Y") %> <p>
+<!--
+<div class="thread-reaction">
+  <p>Did this answer your question?</p>
+  <p class="thread-reaction-links">
+    <a>😞<a>
+    <a>😃<a>
+  </p>
+<div>
+-->
+<% if HelpCenter.enable_comments %>
+ <hr>
+ <%= render partial: "help_center/support_posts/support_post", collection: @support_thread.support_posts.includes(:user).sorted %>
+ <%= render partial: "help_center/support_posts/form" if user_signed_in? %>
+<% end %>
+</div>

data/app/views/help_center/user_mailer/new_post.html.erb

@@ -1,9 +1,9 @@
-<div style="position: relative">
-  <%= gravatar_image_tag @support_post.user.email, style: "float: left" %>
-  <div style="margin-left:60px">
-    <p><strong><%= @support_post.user.name %></strong> <small>commented:</small></p>
-    <%= formatted_content @support_post.body %>
-  </div>
-</div>
-<br />
-<p><%= link_to "Reply to this comment", support_thread_url(@support_post.support_thread, anchor: "support_post_#{@support_post.id}"), style: "background:#be2126; color:#fff; text-decoration:none; padding: 10px 20px" %></p>
+<div style="position: relative">
+  <%= gravatar_image_tag @support_post.user.email, style: "float: left" %>
+  <div style="margin-left:60px">
+    <p><strong><%= @support_post.user.name %></strong> <small>commented:</small></p>
+    <%= formatted_content @support_post.body %>
+  </div>
+</div>
+<br />
+<p><%= link_to "Reply to this comment", support_thread_url(@support_post.support_thread, anchor: "support_post_#{@support_post.id}"), style: "background:#be2126; color:#fff; text-decoration:none; padding: 10px 20px" %></p>

data/app/views/help_center/user_mailer/new_thread.html.erb

@@ -1,9 +1,9 @@
-<div style="position: relative">
-  <%= gravatar_image_tag @support_post.user.email, style: "float: left" %>
-  <div style="margin-left:60px">
-    <p><strong><%= @support_post.user.name %></strong> <small>commented:</small></p>
-    <%= formatted_content @support_post.body %>
-  </div>
-</div>
-<br />
-<p><%= link_to "Reply to this comment", support_thread_url(@support_post.support_thread, anchor: "support_post_#{@support_post.id}"), style: "background:#be2126; color:#fff; text-decoration:none; padding: 10px 20px" %></p>
+<div style="position: relative">
+  <%= gravatar_image_tag @support_post.user.email, style: "float: left" %>
+  <div style="margin-left:60px">
+    <p><strong><%= @support_post.user.name %></strong> <small>commented:</small></p>
+    <%= formatted_content @support_post.body %>
+  </div>
+</div>
+<br />
+<p><%= link_to "Reply to this comment", support_thread_url(@support_post.support_thread, anchor: "support_post_#{@support_post.id}"), style: "background:#be2126; color:#fff; text-decoration:none; padding: 10px 20px" %></p>

data/app/views/layouts/help_center.html.erb

@@ -1,128 +1,130 @@
-<% if  current_user && (current_user.admin? || current_user.moderator?) %>
-  <div class="fixed bottom-0 w-full z-50 bg-purple-600 text-purple-200 text-sm text-center font-brand-semibold px-4 py-3" role="alert">
-    You're logged in as <b>help center moderator user</b> (<%= current_user.email %>)</b>
-    <%= link_to t('add_an_article'), help_center.new_support_thread_path, class: "text-purple-100 hover:no-underline font-semibold underline mr-4 ml-6" %>
-    <%= link_to t('add_category'), help_center.new_support_category_path, class: "text-purple-100 hover:no-underline font-semibold underline" %>
-
-    <%= link_to "Logout", back_masquerade_path(current_user), class: "text-purple-100 hover:no-underline font-semibold underline ml-6" %>
-  </div>
-<% end %>
-
-<div class="container mx-auto mt-2">
-<div class="flex flex-wrap help_center">
- <div class="md:w-1/4 pr-4 pl-4 mb-3">
-   <div class="relative flex flex-col min-w-0 rounded break-words border bg-white border-1 border-grey-light flex-auto p-6">
-     <div class="support-thread-filters">
-       <% SupportCategory.sorted.each do |category| %>
-         <div class="pb-3">
-           <%= support_link_to help_center.support_category_path(category) do %>
-            <div class="mb-2 mt-3">
-              <span class="font-extrabold">
-             <%= category.name %>
-             </span>
-             </div>
-           <% end %>
-           <div class="ml-2 pl-1">
-            <% threads = SupportThread.where(support_category_id: category.id).order(:position) %>
-            <% threads.each do |thread| %>
-              <div class="mb-2">
-              <%= support_link_to help_center.support_thread_path(thread) do %>
-                <%= thread.title %>
-              <% end %>
-              </div>
-            <% end %>
-            </div>
-         </div>
-       <% end %>
-     </div>
-   <% if HelpCenter.enable_comments %>
-           <hr />
-     <div class="support-thread-filters">
-       <h5>
-         <strong>
-           <%= t('filters') %>
-         </strong>
-       </h5>
-       <div>
-         <%= support_link_to help_center.support_threads_path, exact: true do %>
-           <%= icon "fa-fw fas", "bars" %>
-           <%= t('.all_threads') %>
-         <% end %>
-       </div>
-       <% if user_signed_in? %>
-         <div>
-           <%= support_link_to help_center.mine_support_threads_path do %><%= icon "fa-fw far", "user-circle" %>
-             <%= t('.my_questions') %>
-           <% end %>
-         </div>
-         <div>
-           <%= support_link_to help_center.participating_support_threads_path do %>
-             <%= icon "fa-fw far", "comments" %>
-             <%= t('.participating') %>
-           <% end %>
-         </div>
-       <% end %>
-       <div>
-         <%= support_link_to help_center.answered_support_threads_path do %>
-           <%= icon "fa-fw fas", "check" %>
-           <%= t('.answered') %>
-         <% end %>
-       </div>
-       <div>
-         <%= support_link_to help_center.unanswered_support_threads_path do %>
-           <%= icon "fa-fw fas", "question" %>
-           <%= t('.unanswered') %>
-         <% end %>
-       </div>
-     </div>
-     <% if @support_thread.present? && @support_thread.persisted? %>
-       <hr />
-       <%# User has not posted in the thread or subscribed %>
-       <h5><%= t('.notifications') %></h5>
-       <%= link_to help_center.support_thread_notifications_path(@support_thread), method: :post, class: "btn-secondary btn-sm btn-block mb-2" do %>
-         <% if @support_thread.subscribed? current_user %>
-           <%= icon "fa-fw fas", "bell-slash" %> <%= t('.unsubscribe') %>
-         <% else %>
-           <%= icon "fa-fw fas", "bell" %>
-           <%= t('.suscribe') %>
-         <% end %>
-       <% end %>
-       <small><%= @support_thread.subscribed_reason(current_user) %></small>
-     <% end %>
-   <% end %>
-   </div>
- </div>
- <div class="md:w-3/4 pr-4 pl-4 mb-3">
-   <div class="relative flex flex-col min-w-0 rounded break-words bg-white flex-auto p-6">
-     <%# Show first article by default on home pag %>
-      <% if current_page?(help_center_path) %>
-        <% if SupportThread.all.count > 0 %>
-          <% @support_thread = SupportThread.all.first %>
-          <div class="container mx-auto">
-            <div class="flex flex-wrap mb-8">
-              <% if is_moderator_or_owner?(@support_thread) %>
-                <div class="flex w-full pr-4 pl-4 justify-end">
-                  <%= link_to icon("fas","pencil"), help_center.edit_support_thread_path(@support_thread),
-                    class: "text-muted",
-                    data: { toggle: "tooltip", placement: "left" },
-                    title: t('edit_this_thread') %>
-                </div>
-              <% end %>
-              <div class="md:w-full pr-4 pl-41">
-                <small class="mb-2"><%= support_category_link(@support_thread.support_category) %> > <%= @support_thread.title %></small>
-                <h1><%= icon "fas", "thumb-tack", class: "text-muted" if @support_thread.pinned? %> <%= @support_thread.title %></h1>
-              </div>
-
-            </div>
-            <%= @support_thread.content %>
-          </div>
-        <% end %>
-      <% end %>
-
-     <%= yield %>
-   </div>
- </div>
-</div>
-</div>
-
-<% parent_layout("application") %>
+ 
+ 
+<% if current_user && (current_user.admin? || current_user.moderator?) %>
+  <div class="container top-0 flex justify-between w-full z-50 bg-blue-600 text-purple-200 text-sm text-center font-brand-semibold px-4 py-3 rounded" role="alert">
+     <span class="text-base font-normal">Welcome moderator (<%= current_user.email %>)</span>
+    <div>
+    <%= link_to t('add_an_article'), help_center.new_support_thread_path, class: "text-gray-100 hover:text-gray-300 hover:no-underline font-semibold underline mr-4 ml-6" %>
+    <%= link_to t('add_category'), help_center.new_support_category_path, class: "text-gray-100 hover:text-gray-300  hover:no-underline font-semibold underline" %>
+    </div>
+  </div>
+<% end %>
+
+<div class="container mx-auto mt-2">
+<div class="flex flex-wrap help_center">
+ <div class="md:w-1/4 mb-4">
+   <div class="relative flex flex-col min-w-0 rounded break-words border bg-white border-1 border-grey-light flex-auto p-6">
+     <div class="support-thread-filters">
+       <% SupportCategory.sorted.each do |category| %>
+         <div class="pb-3">
+           <%= support_link_to help_center.support_category_path(category) do %>
+            <div class="mb-2 mt-3">
+              <span class="font-extrabold">
+             <%= category.name %>
+             </span>
+             </div>
+           <% end %>
+           <div class="ml-2 pl-1">
+            <% threads = SupportThread.where(support_category_id: category.id).order(:position) %>
+            <% threads.each do |thread| %>
+              <div class="mb-2">
+              <%= support_link_to help_center.support_thread_path(thread) do %>
+                <%= thread.title %>
+              <% end %>
+              </div>
+            <% end %>
+            </div>
+         </div>
+       <% end %>
+     </div>
+   <% if HelpCenter.enable_comments %>
+           <hr />
+     <div class="support-thread-filters">
+       <h5>
+         <strong>
+           <%= t('filters') %>
+         </strong>
+       </h5>
+       <div>
+         <%= support_link_to help_center.support_threads_path, exact: true do %>
+           <%= icon "fa-fw fas", "bars" %>
+           <%= t('.all_threads') %>
+         <% end %>
+       </div>
+       <% if user_signed_in? %>
+         <div>
+           <%= support_link_to help_center.mine_support_threads_path do %><%= icon "fa-fw far", "user-circle" %>
+             <%= t('.my_questions') %>
+           <% end %>
+         </div>
+         <div>
+           <%= support_link_to help_center.participating_support_threads_path do %>
+             <%= icon "fa-fw far", "comments" %>
+             <%= t('.participating') %>
+           <% end %>
+         </div>
+       <% end %>
+       <div>
+         <%= support_link_to help_center.answered_support_threads_path do %>
+           <%= icon "fa-fw fas", "check" %>
+           <%= t('.answered') %>
+         <% end %>
+       </div>
+       <div>
+         <%= support_link_to help_center.unanswered_support_threads_path do %>
+           <%= icon "fa-fw fas", "question" %>
+           <%= t('.unanswered') %>
+         <% end %>
+       </div>
+     </div>
+     <% if @support_thread.present? && @support_thread.persisted? %>
+       <hr />
+       <%# User has not posted in the thread or subscribed %>
+       <h5><%= t('.notifications') %></h5>
+       <%= link_to help_center.support_thread_notifications_path(@support_thread), method: :post, class: "btn-secondary btn-sm btn-block mb-2" do %>
+         <% if @support_thread.subscribed? current_user %>
+           <%= icon "fa-fw fas", "bell-slash" %> <%= t('.unsubscribe') %>
+         <% else %>
+           <%= icon "fa-fw fas", "bell" %>
+           <%= t('.suscribe') %>
+         <% end %>
+       <% end %>
+       <small><%= @support_thread.subscribed_reason(current_user) %></small>
+     <% end %>
+   <% end %>
+   </div>
+ </div>
+ <div class="md:w-3/4 pl-4 mb-3">
+   <div class="relative flex flex-col min-w-0 rounded break-words bg-white flex-auto p-6">
+     <%# Show first article by default on home pag %>
+      <% if current_page?(help_center_path) %>
+        <% if SupportCategory.all.count > 0 %>
+          <% @support_thread = SupportCategory.sorted.first.support_threads.sorted.first %>
+          <div class="container mx-auto">
+            <div class="flex flex-wrap mb-8">
+              <% if is_moderator_or_owner?(@support_thread) %>
+                <div class="flex w-full pr-4 pl-4 justify-end">
+                  <%= link_to icon("fas","pencil"), help_center.edit_support_thread_path(@support_thread),
+                    class: "text-muted",
+                    data: { toggle: "tooltip", placement: "left" },
+                    title: t('edit_this_thread') %>
+                </div>
+              <% end %>
+              <div class="md:w-full pr-4 pl-41">
+                <small class="mb-2"><%= support_category_link(@support_thread.support_category) %> > <%= @support_thread.title %></small>
+                <h1><%= icon "fas", "thumb-tack", class: "text-muted" if @support_thread.pinned? %> <%= @support_thread.title %></h1>
+              </div>
+
+            </div>
+            <%= @support_thread.content %>
+          </div>
+        <% end %>
+      <% end %>
+
+     <%= yield %>
+   </div>
+ </div>
+</div>
+</div>
+
+<% parent_layout("application") %>