post.html

---
layout: default
---

<article class="post">
  <header class="post-header">
    <h1 class="post-title">{{ page.title }}</h1>
    <div class="post-meta">
      <time datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: "%B %d, %Y" }}</time>
      <span class="author">by {{ page.author | default: site.author }}</span>
      {% if page.tags.size > 0 %}
        <div class="post-tags">
          {% for tag in page.tags %}
            <a href="{{ '/tags#' | append: tag | relative_url }}" class="tag">{{ tag }}</a>
          {% endfor %}
        </div>
      {% endif %}
    </div>
  </header>

  <div class="post-content">
    {{ content }}
  </div>

  <footer class="post-footer">
    <!-- Enhanced Social Sharing -->
    {% include social-sharing.html %}

    <!-- Navigation -->
    <nav class="post-navigation">
      {% if page.previous.url %}
        <a class="prev-post" href="{{ page.previous.url | relative_url }}">
          <span class="nav-label">← Previous Post</span>
          <span class="nav-title">{{ page.previous.title }}</span>
        </a>
      {% endif %}
      
      {% if page.next.url %}
        <a class="next-post" href="{{ page.next.url | relative_url }}">
          <span class="nav-label">Next Post →</span>
          <span class="nav-title">{{ page.next.title }}</span>
        </a>
      {% endif %}
    </nav>
  </footer>
</article>

<!-- Related Posts -->
{% assign related_posts = site.related_posts | limit: 3 %}
{% if related_posts.size > 0 %}
  <section class="related-posts">
    <h2>Related Posts</h2>
    <div class="related-posts-grid">
      {% for post in related_posts %}
        <article class="related-post">
          <h3><a href="{{ post.url | relative_url }}">{{ post.title }}</a></h3>
          <p class="post-meta">{{ post.date | date: "%B %d, %Y" }}</p>
          <p class="post-excerpt">{{ post.excerpt | strip_html | truncatewords: 15 }}</p>
        </article>
      {% endfor %}
    </div>
  </section>
{% endif %}
<script>
function copyToClipboard(text) {
  navigator.clipboard.writeText(text).then(function() {
    // Show success message
    const btn = event.target.closest('.copy-link');
    const originalText = btn.innerHTML;
    btn.innerHTML = '<i class="fas fa-check"></i> Copied!';
    btn.classList.add('copied');
    
    setTimeout(() => {
      btn.innerHTML = originalText;
      btn.classList.remove('copied');
    }, 2000);
  });
}
</script>