This repository has been archived on 2026-03-24. You can view files and clone it. You cannot open issues or pull requests or push a commit.
Files
Timmy-time-dashboard/src/dashboard/templates/create_task.html
Claude 65a278dbee fix: comprehensive iPhone UI overhaul — glassmorphism, responsive layouts, theme unification
- 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
2026-02-24 22:25:04 +00:00

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 &amp; 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 %}