|
{% extends "base.html" %}
|
|
{% from "_macros.html" import modal %}
|
|
{% block extra_head %}
|
|
<link rel="stylesheet" href="/static/css/feed.css">
|
|
<link rel="stylesheet" href="/static/css/sidebar.css">
|
|
<link rel="stylesheet" href="/static/css/post.css">
|
|
{% endblock %}
|
|
{% block content %}
|
|
<h1 class="sr-only">Feed</h1>
|
|
<div class="feed-layout">
|
|
<aside class="sidebar-card">
|
|
<div class="sidebar-heading">Topics</div>
|
|
<div class="sidebar-nav">
|
|
<a href="/feed" class="sidebar-link {% if not current_topic %}active{% endif %}">
|
|
<span class="icon">📋</span>
|
|
All
|
|
</a>
|
|
<a href="/feed?topic=devlog" class="sidebar-link {% if current_topic == 'devlog' %}active{% endif %}" data-topic="devlog">
|
|
<span class="icon">📝</span>
|
|
Devlog
|
|
</a>
|
|
<a href="/feed?topic=showcase" class="sidebar-link {% if current_topic == 'showcase' %}active{% endif %}" data-topic="showcase">
|
|
<span class="icon">✨</span>
|
|
Showcase
|
|
</a>
|
|
<a href="/feed?topic=question" class="sidebar-link {% if current_topic == 'question' %}active{% endif %}" data-topic="question">
|
|
<span class="icon">❓</span>
|
|
Question
|
|
</a>
|
|
<a href="/feed?topic=rant" class="sidebar-link {% if current_topic == 'rant' %}active{% endif %}" data-topic="rant">
|
|
<span class="icon">💢</span>
|
|
Rant
|
|
</a>
|
|
<a href="/feed?topic=fun" class="sidebar-link {% if current_topic == 'fun' %}active{% endif %}" data-topic="fun">
|
|
<span class="icon">🎮</span>
|
|
Fun
|
|
</a>
|
|
<a href="/feed?topic=signals" class="sidebar-link {% if current_topic == 'signals' %}active{% endif %}" data-topic="signals">
|
|
<span class="icon">📡</span>
|
|
Signals
|
|
</a>
|
|
</div>
|
|
</aside>
|
|
|
|
<div class="feed-main">
|
|
<div class="feed-nav">
|
|
<a href="/feed?tab=all" class="feed-nav-btn {% if current_tab == 'all' or not current_tab %}active{% endif %}"><span class="icon">📋</span> All</a>
|
|
<a href="/feed?tab=trending" class="feed-nav-btn {% if current_tab == 'trending' %}active{% endif %}"><span class="icon">🔥</span> Trending</a>
|
|
<a href="/feed?tab=recent" class="feed-nav-btn {% if current_tab == 'recent' %}active{% endif %}"><span class="icon">🕐</span> Recent</a>
|
|
<a href="/feed?tab=following" class="feed-nav-btn {% if current_tab == 'following' %}active{% endif %}"><span class="icon">👥</span> Following</a>
|
|
<div class="feed-nav-actions">
|
|
<button class="btn-ghost btn-icon" title="Refresh" onclick="window.location.reload()">↻</button>
|
|
<button class="btn-ghost btn-icon" title="Notifications" onclick="window.location.href='/notifications'">🔔</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="feed-posts">
|
|
{% for item in posts %}
|
|
{% set _author = item.author %}{% set _time = item.time_ago %}{% set _show_share = true %}{% set _show_comment_form = true %}{% include "_post_card.html" %}
|
|
{% else %}
|
|
<div class="empty-state">No posts yet. Be the first!</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% include "_load_more.html" %}
|
|
</div>
|
|
|
|
<aside class="feed-right">
|
|
<div class="daily-topic-card">
|
|
<div class="daily-topic-label">Daily Topic</div>
|
|
<h4>{{ daily_topic.get('title', '') }}</h4>
|
|
<p>{{ daily_topic.get('summary', '') }}</p>
|
|
<div class="topic-links">
|
|
<a href="/news/{{ daily_topic.get('slug', '') }}">Read More</a>
|
|
{% if daily_topic.get('url', '') %}
|
|
<a href="{{ daily_topic['url'] }}" target="_blank" rel="noopener">Source</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="community-stats">
|
|
<h3>Community</h3>
|
|
<div class="stat-row">
|
|
<span class="label">Total Members</span>
|
|
<span class="value">{{ total_members }}</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="label">Posts Today</span>
|
|
<span class="value">{{ posts_today }}</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="label">Total Projects</span>
|
|
<span class="value">{{ total_projects }}</span>
|
|
</div>
|
|
<div class="stat-row">
|
|
<span class="label">Total Gists</span>
|
|
<span class="value">{{ total_gists }}</span>
|
|
</div>
|
|
<div class="top-authors-section">
|
|
<h3 class="top-authors-title">Top Authors</h3>
|
|
{% for author in top_authors %}
|
|
<div class="stat-row">
|
|
<span class="label">
|
|
{% set _user = author %}{% set _size = 20 %}{% set _size_class = "xs" %}{% include "_avatar_link.html" %}
|
|
{% set _user = author %}{% set _class = "top-author-name" %}{% include "_user_link.html" %}
|
|
</span>
|
|
<span class="value">{{ author.get('stars', 0) }}</span>
|
|
</div>
|
|
{% else %}
|
|
<div class="no-authors-msg">No top authors yet</div>
|
|
{% endfor %}
|
|
<a href="/leaderboard" class="top-authors-link">View full leaderboard</a>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
|
|
{% if user %}
|
|
<a href="#" class="feed-fab" data-modal="create-post-modal" title="Create New Post">+</a>
|
|
|
|
{% call modal('create-post-modal', 'Create New Post') %}
|
|
<form id="create-post-form" method="POST" action="/posts/create" enctype="multipart/form-data">
|
|
{% set _topics = TOPICS %}{% set _selected = 'random' %}{% include "_topic_selector.html" %}
|
|
|
|
<div class="auth-field auth-field-gap">
|
|
<label for="post-content">What are you sharing?</label>
|
|
<textarea id="post-content" name="content" required maxlength="2000" placeholder="What's on your mind?" class="min-h-120" data-mention></textarea>
|
|
<small class="hint-text"><span id="post-content-count">0/2000</span></small>
|
|
</div>
|
|
|
|
<div class="auth-field auth-field-gap">
|
|
<label for="post-title">Title (optional)</label>
|
|
<input type="text" id="post-title" name="title" maxlength="500" placeholder="Post title">
|
|
<small class="hint-text"><span id="post-title-count">0/500</span></small>
|
|
</div>
|
|
|
|
<div class="auth-field auth-field-gap">
|
|
<label for="project_uid">Link to Project (Optional)</label>
|
|
<select id="project_uid" name="project_uid">
|
|
<option value="">No project</option>
|
|
{% for p in get_user_projects(user['uid']) %}
|
|
<option value="{{ p['uid'] }}">{{ p['title'] }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
|
|
<div class="auth-field auth-field-gap">
|
|
<label for="post-image">Add an image (optional)</label>
|
|
<input type="file" id="post-image" name="image" accept="image/*">
|
|
</div>
|
|
|
|
<div class="modal-footer">
|
|
<button type="button" class="modal-close btn btn-secondary">Cancel</button>
|
|
<button type="submit" class="btn btn-primary">Post</button>
|
|
</div>
|
|
</form>
|
|
{% endcall %}
|
|
{% endif %}
|
|
|
|
{% endblock %}
|