TheLovinator/ttvdrops
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Debloat HTML

Browse source
This commit is contained in:
Joakim Hellsén 2025-07-24 01:27:31 +02:00
commit 547d4e6ab1
18 changed files with 874 additions and 1284 deletions
Download patch file Download diff file Expand all files Collapse all files

236
templates/twitch/dashboard.html
View file

@ -1,192 +1,50 @@
{% extends "base.html" %}
{% block title %}Dashboard - Twitch Drops Tracker{% endblock %}
{% load static %}
{% block title %}
Dashboard
{% endblock title %}
{% block content %}
<div class="row mb-2">
<div class="col">
<h2 class="mb-1"><i class="fas fa-tachometer-alt me-2 twitch-color"></i>Dashboard</h2>
<p class="small text-muted mb-2">Track your active Twitch drop campaigns and progress.</p>
</div>
</div>
<style>
.org-section {
border-left: 3px solid #9146FF;
padding-left: 10px;
margin-bottom: 15px;
}
.game-section {
border-left: 2px solid #6441A4;
padding-left: 8px;
margin-left: 5px;
margin-bottom: 10px;
}
.org-section h5 {
color: #9146FF;
font-size: 1.1rem;
margin-bottom: 8px;
}
.game-section h6 {
font-size: 0.95rem;
margin-bottom: 5px;
}
.game-section h6 a {
color: #6441A4;
}
.game-section h6 a:hover {
color: #9146FF;
}
.campaign-card {
padding: 8px !important;
margin-bottom: 0;
height: 100%;
}
.campaign-image img,
.campaign-image div {
width: 50px !important;
height: 50px !important;
}
.card-body {
padding: 0.75rem !important;
}
.title-wrapper {
min-height: 1.9rem !important;
}
.title-wrapper h6 {
font-size: 0.85rem !important;
line-height: 1.2;
}
.mb-3 {
margin-bottom: 0.75rem !important;
}
.mb-4 {
margin-bottom: 1rem !important;
}
.g-3 {
--bs-gutter-y: 0.5rem !important;
--bs-gutter-x: 0.5rem !important;
}
</style>
<div class="row mb-2">
<div class="col-12">
<div class="card border-0 shadow-sm">
<div class="card-header bg-twitch py-1">
<h5 class="mb-0"><i class="fas fa-fire me-1"></i>Active Campaigns</h5>
</div>
<div class="card-body py-3">
{% if campaigns_by_org_game %}
{% for org_id, org_data in campaigns_by_org_game.items %}
<div class="org-section mb-4">
<h5><i class="fas fa-building me-1"></i>{{ org_data.name }}</h5>
{% for game_id, game_data in org_data.games.items %}
<div class="game-section mb-3">
<h6>
<a href="{% url 'twitch:game_detail' game_id %}" class="text-decoration-none">
<i class="fas fa-gamepad me-1"></i>{{ game_data.name }}
</a>
</h6>
<div class="row g-3">
{% for campaign in game_data.campaigns %}
<div class="col-md-4 col-lg-3 col-xl-2">
<div class="campaign-card campaign-active border rounded">
<div class="d-flex">
<div class="campaign-image flex-shrink-0 me-2">
{% if campaign.image_url %}
<img src="{{ campaign.image_url }}" class="rounded"
alt="{{ campaign.name }}" style="object-fit: cover;">
{% else %}
<div class="bg-light rounded"
style="display: flex; align-items: center; justify-content: center;">
<i class="fas fa-image text-muted" style="font-size: 1.2rem;"></i>
</div>
{% endif %}
</div>
<div class="campaign-details min-w-0">
<div class="title-wrapper">
<h6 class="mb-0" title="{{ campaign.name }}"
style="display: -webkit-box; display: box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; box-orient: vertical; overflow: hidden;">
{{ campaign.clean_name }}</h6>
</div>
<div class="d-flex align-items-center">
<span class="badge bg-success" style="font-size: 0.7rem;">Active</span>
<small class="text-muted ms-1" style="font-size: 0.7rem;">Ends
{{ campaign.end_at|date:"M d" }}</small>
</div>
<a href="{% url 'twitch:campaign_detail' campaign.id %}"
class="stretched-link"></a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
</div>
{% if campaigns_by_org_game %}
{% for org_id, org_data in campaigns_by_org_game.items %}
<h2>{{ org_data.name }}</h2>
{% for game_id, game_data in org_data.games.items %}
<h3>
<a href="{% url 'twitch:game_detail' game_id %}">{{ game_data.name }}</a>
</h3>
<p>{{ game_data.campaigns.0.description|default:"No description available."|linebreaksbr }}</p>
<table style="width:100%">
<tr>
<th style="width:25%">Image</th>
<th>Campaign</th>
<th>Ends In</th>
</tr>
{% for campaign in game_data.campaigns %}
<tr>
<td>
{% if campaign.image_url %}
<img height="160"
width="160"
src="{{ campaign.image_url }}"
alt="{{ campaign.name }}">
{% else %}
<img height="160"
width="160"
src="{% static 'images/placeholder.png' %}"
alt="No Image Available">
{% endif %}
</td>
<td>
<a href="{% url 'twitch:campaign_detail' campaign.id %}">{{ campaign.clean_name }}</a>
</td>
<td>
<span title="{{ campaign.end_at|date:'M d, Y H:i' }}">Ends in {{ campaign.end_at|timeuntil }}</span>
</td>
</tr>
{% endfor %}
</div>
{% endfor %}
{% else %}
<div class="alert alert-info py-2">
<i class="fas fa-info-circle me-2"></i>No active campaigns at the moment.
</div>
{% endif %}
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card border-0 shadow-sm">
<div class="card-header bg-dark text-white py-1">
<h5 class="mb-0"><i class="fas fa-chart-bar me-1"></i>Quick Stats</h5>
</div>
<div class="card-body py-2">
<div class="row text-center g-2">
<div class="col-md-3 mb-1 mb-md-0">
<div class="p-1 border rounded">
<h4 class="twitch-color mb-0">{{ active_campaigns.count }}</h4>
<p class="mb-0 small text-muted" style="font-size: 0.75rem;">Active Campaigns</p>
</div>
</div>
<div class="col-md-3 mb-1 mb-md-0">
<div class="p-1 border rounded">
<h4 class="text-primary mb-0">{{ campaigns_by_org_game|length }}</h4>
<p class="mb-0 small text-muted" style="font-size: 0.75rem;">Organizations</p>
</div>
</div>
<div class="col-md-3 mb-1 mb-md-0">
<div class="p-1 border rounded">
<h4 class="text-primary mb-0">{{ now|date:"M j" }}</h4>
<p class="mb-0 small text-muted" style="font-size: 0.75rem;">Current Date</p>
</div>
</div>
<div class="col-md-3">
<div class="p-1 border rounded">
<a href="{% url 'twitch:campaign_list' %}" class="btn btn-primary btn-sm w-100">
<i class="fas fa-list me-1"></i>All Campaigns
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
</table>
{% endfor %}
{% endfor %}
{% else %}
No active campaigns at the moment.
{% endif %}
{% endblock content %}