<%= render partial: "projects/header", locals: { project: @post.project } %>

<div class="bg-[#3A5CE1] rounded-md border-2 border-[#96ABF9] p-8 mx-24 mt-24"> 


    <div class="flex flex-wrap">
        <div class="opacity-70 hover:opacity-100 transition duration-100 mr-2"><%= link_to "← back", @return_to %></div>
        <p class="mr-2 opacity-70">//</p>
        <%= link_to "Edit", edit_post_path(@post), class: "opacity-70 hover:opacity-100"%>
    </div>

    <p class="mb-2">
        posted by <span class="text-[#96ABF9]"><%= link_to "@#{@post.user.username}", @post.user %></span>
        <span class="opacity-50">// <%= time_ago_in_words(@post.created_at) %> ago // <%= pluralize(@post.hours, "hour") %> spent on </span>
        <span class="text-[#96ABF9]"><%= link_to "[#{@post.project.name}]", @post.project %></span>
    </p>

    <h1 class="text-3xl font-bold mb-4"><%= @post.name %></h1>

    <p><%= @post.description%></p>

    <div class="w-[50%] mt-4">
        <% if @post.featured_image.attached? %>
            <%= image_tag @post.featured_image, class: "rounded" %>
        <% end %>
    </div>


</div>