clawisopen/creator.html at main · ProfTrader/clawisopen · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Creator — Claw Is Open</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet" />
  <link rel="stylesheet" href="css/styles.css" />
</head>
<body>

<nav>
  <div class="nav-wrap">
    <a href="index.html" class="nav-logo">
      <div class="logo-mark">🦞</div>
      Claw Is Open
    </a>
    <div class="nav-center">
      <a href="marketplace.html">Browse</a>
      <a href="marketplace.html#categories">Categories</a>
      <a href="creators.html">Creators</a>
      <a href="index.html#how">How it works</a>
      <a href="blog.html">Blog</a>
    </div>
    <div class="nav-right">
      <a href="signin.html" class="btn btn-ghost">Log in</a>
      <a href="signup.html" class="btn btn-dark">Sign up free</a>
    </div>
  </div>
</nav>

<section class="creator-profile">
  <div class="container">
    <div class="breadcrumb" style="margin-bottom: 24px;">
      <a href="index.html">Home</a> / <a href="creators.html">Creators</a> / <span id="creator-handle">@alexr_builds</span>
    </div>
    <div class="creator-header">
      <div class="cr-avatar" id="creator-avatar">🧑‍💻</div>
      <div>
        <h1 id="creator-name" style="font-size: 28px; margin-bottom: 6px;">Alex Rivera</h1>
        <p id="creator-handle-p" style="font-size: 16px; color: var(--ink-4); margin-bottom: 16px;">@alexr_builds</p>
        <p id="creator-bio" style="font-size: 15px; color: var(--ink-3); line-height: 1.6; max-width: 480px;">
          Full-stack developer turned AI builder. Specializes in business strategy and developer tooling personas.
        </p>
      </div>
    </div>
    <div class="cr-stats" style="max-width: 400px; margin-bottom: 48px;">
      <div class="cr-stat"><span class="v" id="stat-listings">48</span><span class="k">listings</span></div>
      <div class="cr-stat"><span class="v" id="stat-downloads">24k</span><span class="k">downloads</span></div>
      <div class="cr-stat"><span class="v" id="stat-rating">4.9★</span><span class="k">rating</span></div>
    </div>
    <div class="s-head">
      <div class="s-label">Listings</div>
      <h2 class="s-title">From this <em>creator</em></h2>
    </div>
    <div class="persona-grid" id="creator-listings"></div>
  </div>
</section>

<footer>
  <div class="container">
    <div class="footer-bottom">
      <p>© 2026 Claw Is Open. All rights reserved.</p>
      <p>Built for the AI-native web.</p>
    </div>
  </div>
</footer>

<script>
(function() {
  var params = new URLSearchParams(location.search);
  var handle = params.get('handle') || 'alexr_builds';
  var creators = {
    'alexr_builds': { name: 'Alex Rivera', avatar: '🧑‍💻', bio: 'Full-stack developer turned AI builder. Specializes in business strategy and developer tooling personas.', listings: '48', downloads: '24k', rating: '4.9★' },
    'priya_ai': { name: 'Priya Nair', avatar: '👩‍🔬', bio: 'AI researcher with a background in NLP. Creates research, education, and data analysis assistants.', listings: '31', downloads: '18k', rating: '5.0★' },
    'mcole_craft': { name: 'Marcus Cole', avatar: '🧙', bio: 'Brand strategist and creative director. Known for content, copywriting, and marketing AI personas.', listings: '22', downloads: '11k', rating: '4.8★' },
    'sam_dev': { name: 'Sam Chen', avatar: '👨‍💼', bio: 'Product manager and automation expert. Builds personas for sales, support, and workflow automation.', listings: '19', downloads: '9k', rating: '4.7★' },
    'jay_ai': { name: 'Jay Patel', avatar: '🎯', bio: 'Data scientist focused on analytics and reporting assistants. Specializes in SQL, Python, and visualization skills.', listings: '27', downloads: '14k', rating: '4.9★' },
    'river_creates': { name: 'River Kim', avatar: '✨', bio: 'Writer and editor. Creates personas for copywriting, storytelling, and content strategy.', listings: '15', downloads: '6k', rating: '5.0★' }
  };
  var creatorProductIds = {
    'alexr_builds': ['startup-strategist', 'senior-dev-buddy', 'contract-reviewer', 'agentic-coding-loop'],
    'priya_ai': ['youtube-researcher', 'data-visualizer'],
    'mcole_craft': ['content-machine-pro', 'growth-hacker-ai', 'seo-automator', 'email-automator'],
    'sam_dev': ['web-scraper-pro'],
    'jay_ai': [],
    'river_creates': ['creative-director']
  };
  var products = {
    'startup-strategist': { name: 'Startup Strategist', category: 'Business', price: 'Free', priceClass: 'free', icon: '🚀', iconClass: 'p-icon-green', rating: '4.9', downloads: '8,412', desc: 'Your on-demand co-founder. Business plans, investor pitches, market analysis.' },
    'content-machine-pro': { name: 'Content Machine Pro', category: 'Content', price: '$29', priceClass: '', icon: '✍️', iconClass: 'p-icon-warm', rating: '4.8', downloads: '6,103', desc: 'Viral blog posts, engaging social copy, and SEO-optimized articles at scale.' },
    'senior-dev-buddy': { name: 'Senior Dev Buddy', category: 'Coding', price: '$49', priceClass: '', icon: '💻', iconClass: 'p-icon-gray', rating: '5.0', downloads: '12,304', desc: 'Full-stack engineer with 10 years of knowledge. Reviews code, writes tests.' },
    'growth-hacker-ai': { name: 'Growth Hacker AI', category: 'Marketing', price: '$39', priceClass: '', icon: '📈', iconClass: 'p-icon-green', rating: '4.7', downloads: '5,801', desc: 'Data-driven marketing expert. A/B tests, funnel optimization, conversion copy.' },
    'creative-director': { name: 'Creative Director', category: 'Design', price: 'Free', priceClass: 'free', icon: '🎨', iconClass: 'p-icon-warm', rating: '4.8', downloads: '7,219', desc: 'Art direction, brand identity, UI/UX critique, design briefs.' },
    'contract-reviewer': { name: 'Contract Reviewer', category: 'Legal', price: '$99', priceClass: '', icon: '⚖️', iconClass: 'p-icon-gray', rating: '4.6', downloads: '3,527', desc: 'Flags risks in contracts, explains legal jargon, drafts NDAs.' },
    'agentic-coding-loop': { name: 'Agentic Coding Loop', category: 'Coding', price: 'Free', priceClass: 'free', icon: '🔁', iconClass: 'p-icon-green', rating: '4.9', downloads: '9,100', desc: 'Autonomous code → test → fix cycles with no intervention.' },
    'youtube-researcher': { name: 'YouTube Researcher', category: 'Research', price: '$12', priceClass: '', icon: '📺', iconClass: 'p-icon-warm', rating: '4.7', downloads: '4,200', desc: 'Search, summarize and extract key insights from videos.' },
    'seo-automator': { name: 'SEO Automator', category: 'Marketing', price: '$19', priceClass: '', icon: '🔍', iconClass: 'p-icon-gray', rating: '4.8', downloads: '5,500', desc: 'Keyword research, competitor analysis, on-page optimization.' },
    'data-visualizer': { name: 'Data Visualizer', category: 'Analytics', price: 'Free', priceClass: 'free', icon: '📊', iconClass: 'p-icon-green', rating: '5.0', downloads: '6,800', desc: 'Turn raw CSV or JSON data into clear charts and narratives.' },
    'email-automator': { name: 'Email Automator', category: 'Marketing', price: '$15', priceClass: '', icon: '✉️', iconClass: 'p-icon-warm', rating: '4.6', downloads: '3,900', desc: 'Cold outreach, smart follow-ups, and full drip sequences.' },
    'web-scraper-pro': { name: 'Web Scraper Pro', category: 'Research', price: '$24', priceClass: '', icon: '🌐', iconClass: 'p-icon-warm', rating: '4.8', downloads: '4,100', desc: 'Extract and structure data from any public webpage.' }
  };
  function escapeHtml(s) { var d = document.createElement('div'); d.textContent = s; return d.innerHTML; }
  var c = creators[handle] || creators['alexr_builds'];
  var handleStr = '@' + handle;
  document.getElementById('creator-handle').textContent = handleStr;
  document.getElementById('creator-name').textContent = c.name;
  document.getElementById('creator-handle-p').textContent = handleStr;
  document.getElementById('creator-avatar').textContent = c.avatar;
  document.getElementById('creator-bio').textContent = c.bio;
  document.getElementById('stat-listings').textContent = c.listings;
  document.getElementById('stat-downloads').textContent = c.downloads;
  document.getElementById('stat-rating').textContent = c.rating;
  document.title = c.name + ' — Claw Is Open';
  var ids = creatorProductIds[handle] || [];
  var listingEl = document.getElementById('creator-listings');
  if (ids.length === 0) {
    listingEl.innerHTML = '<p style="grid-column: 1 / -1; color: var(--ink-3);">No listings yet from this creator.</p>';
  } else {
    listingEl.innerHTML = ids.map(function(id) {
      var p = products[id];
      if (!p) return '';
      return '<a href="product.html?id=' + encodeURIComponent(id) + '" class="p-card">' +
        '<div class="p-card-top"><div class="p-icon ' + p.iconClass + '">' + p.icon + '</div><span class="p-price ' + p.priceClass + '">' + escapeHtml(p.price) + '</span></div>' +
        '<span class="badge badge-neutral" style="margin-bottom:10px;">' + escapeHtml(p.category) + '</span>' +
        '<h3>' + escapeHtml(p.name) + '</h3><p>' + escapeHtml(p.desc) + '</p>' +
        '<div class="p-card-foot"><div class="p-stars"><span class="star">★</span><span class="val">' + escapeHtml(p.rating) + '</span></div><span class="p-dl">' + escapeHtml(p.downloads) + ' downloads</span></div></a>';
    }).join('');
  }
})();
</script>
</body>
</html>