forked from Rockachopa/Timmy-time-dashboard
- base.html: add missing {% block extra_styles %}, mobile hamburger menu with
slide-out nav, interactive-widget viewport meta, -webkit-text-size-adjust
- style.css: define 15+ missing CSS variables (--bg-secondary, --text-muted,
--accent, --success, --danger, etc.), add missing utility classes (.grid,
.stat, .agent-card, .agent-avatar, .form-group), glassmorphism card effects,
iPhone breakpoints (768px, 390px), 44pt min touch targets, smooth animations
- mobile.html: rewrite with proper theme variables, glass cards, touch-friendly
quick actions grid, chat with proper message bubbles
- swarm_live.html: replace undefined CSS vars, use mc-panel theme cards
- marketplace.html: responsive agent cards that stack on iPhone, themed pricing
- voice_button.html & voice_enhanced.html: proper theme integration, touch-sized
buttons, themed result containers
- create_task.html: mobile-friendly forms with 16px font (prevents iOS zoom)
- tools.html & creative.html: themed headers, responsive column stacking
- spark.html: replace all hardcoded blue (#00d4ff) colors with theme purple/orange
- briefing.html: replace hardcoded bootstrap colors with theme variables
Fixes: header nav overflow on iPhone (7 links in single row), missing
extra_styles block silently dropping child template styles, undefined CSS
variables breaking mobile/swarm/marketplace/voice pages, sub-44pt touch
targets, missing -webkit-text-size-adjust, inconsistent color themes.
97 UI tests pass (91 UI-specific + 6 creative route).
https://claude.ai/code/session_01JiyhGyee2zoMN4p8xWYqEe
76 lines
3.1 KiB
HTML
76 lines
3.1 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}{{ page_title }}{% endblock %}
|
|
|
|
{% block content %}
|
|
<div style="max-width: 600px; margin: 0 auto;" class="py-3">
|
|
|
|
<div class="card mc-panel">
|
|
<div class="card-header mc-panel-header">// CREATE NEW TASK</div>
|
|
<div class="card-body">
|
|
<p style="color: var(--text-dim); font-size: 0.85rem; margin-bottom: 16px;">Agents will bid to complete this task</p>
|
|
|
|
<form hx-post="/agents/swarm/task/create" hx-target="#task-result" hx-swap="innerHTML">
|
|
<div class="form-group">
|
|
<label class="form-label">Task Title *</label>
|
|
<input type="text" name="title" placeholder="e.g., Research latest Bitcoin developments" required>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">Description</label>
|
|
<textarea name="description" rows="3" placeholder="Detailed description of what needs to be done..."></textarea>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label class="form-label">Required Capabilities</label>
|
|
<input type="text" name="requirements" placeholder="web_search, research, writing">
|
|
<small>Agents with these capabilities will be eligible to bid</small>
|
|
</div>
|
|
|
|
<div class="grid grid-3">
|
|
<div class="form-group">
|
|
<label class="form-label">Min Bid (sats)</label>
|
|
<input type="number" name="min_bid" value="1" min="1">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label">Max Bid (sats)</label>
|
|
<input type="number" name="max_bid" value="1000" min="1">
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label">Priority</label>
|
|
<select name="priority">
|
|
<option value="1">1 - Low</option>
|
|
<option value="2">2</option>
|
|
<option value="3" selected>3 - Normal</option>
|
|
<option value="4">4</option>
|
|
<option value="5">5 - Urgent</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="display: flex; gap: 10px; margin-top: 16px;">
|
|
<a href="/" class="btn btn-secondary" style="flex: 1; display: flex; align-items: center; justify-content: center; min-height: 44px; text-decoration: none;">Cancel</a>
|
|
<button type="submit" class="btn btn-primary" style="flex: 2; min-height: 44px;">Create Task & Start Auction</button>
|
|
</div>
|
|
</form>
|
|
|
|
<div id="task-result" style="margin-top: 16px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card mc-panel">
|
|
<div class="card-header mc-panel-header">// HOW AUCTIONS WORK</div>
|
|
<div class="card-body">
|
|
<ol style="color: var(--text-dim); line-height: 2.2; padding-left: 18px; font-size: 0.85rem; margin: 0;">
|
|
<li>You create a task with requirements</li>
|
|
<li>A 15-second auction begins automatically</li>
|
|
<li>Eligible agents place bids in satoshis</li>
|
|
<li>The lowest bid wins the task</li>
|
|
<li>The winning agent completes the task and earns the sats</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
{% endblock %}
|