From 6d31f381926bff43be53924c2eb3667b97677c42 Mon Sep 17 00:00:00 2001 From: ouwibo Date: Sun, 31 May 2026 10:05:01 +0000 Subject: [PATCH 1/2] Add crypto-staking-dashboard template --- templates/crypto-staking-dashboard.md | 25 +++++++++++++++++++++++++ 1 file changed, 25 insertions(+) create mode 100644 templates/crypto-staking-dashboard.md diff --git a/templates/crypto-staking-dashboard.md b/templates/crypto-staking-dashboard.md new file mode 100644 index 0000000..e7daabb --- /dev/null +++ b/templates/crypto-staking-dashboard.md @@ -0,0 +1,25 @@ +--- +title: Crypto Staking Dashboard +app_type: crypto-staking-dashboard +wallet: 0x1e660a9a1f1f08afef9c03c96d66260122464cf2 +--- + +You are an expert React developer. Generate a complete, production-ready React application for a crypto staking dashboard. + +Requirements: +- Header with logo, wallet address display (truncated), and a connect/disconnect button +- Portfolio overview section showing total staked value, total rewards earned, and APY percentage in stat cards +- Staking pools table with columns: Asset, APY, Total Staked, Your Stake, Rewards, and an Action button (Stake/Unstake) +- Active positions section listing current stakes with amount, duration, rewards accrued, and a Claim button +- Transaction history section with a simple table showing date, type, amount, and status badge +- Fully responsive layout using Tailwind CSS utility classes +- Use mock/placeholder data for all values — no real blockchain calls +- Clean, dark-themed professional UI with accent colors for positive/negative values + +Technical: +- React 18 with TypeScript +- Tailwind CSS for all styling +- Export a single default App component +- No external UI libraries or icon packs +- Use inline SVG for any icons +- All state managed with useState/useEffect hooks only From ab2ab8d08c9cf338ce8658585c124f9c9206ac0e Mon Sep 17 00:00:00 2001 From: ouwibo Date: Sun, 31 May 2026 10:07:18 +0000 Subject: [PATCH 2/2] Replace template: add crypto-airdrop-tracker (ouwibo.bond) --- templates/crypto-airdrop-tracker.md | 42 +++++++++++++++++++++++++++ templates/crypto-staking-dashboard.md | 25 ---------------- 2 files changed, 42 insertions(+), 25 deletions(-) create mode 100644 templates/crypto-airdrop-tracker.md delete mode 100644 templates/crypto-staking-dashboard.md diff --git a/templates/crypto-airdrop-tracker.md b/templates/crypto-airdrop-tracker.md new file mode 100644 index 0000000..5092935 --- /dev/null +++ b/templates/crypto-airdrop-tracker.md @@ -0,0 +1,42 @@ +--- +title: Crypto Airdrop Tracker & News +app_type: crypto-airdrop-tracker +wallet: 0x1e660a9a1f1f08afef9c03c96d66260122464cf2 +--- + +You are an expert React developer. Generate a complete, production-ready React application for a crypto airdrop tracker and news site. + +**App Overview:** +A dark-themed web app that lets users browse confirmed & potential crypto airdrops alongside daily crypto news. No login required. All data is mock/static. + +**Pages & Routes:** +- `/` — Home: hero section with tagline, featured airdrops row, and latest news preview +- `/airdrops` — Airdrop Tracker: filterable table of airdrops +- `/news` — News Feed: grid of news cards + +**Airdrop Tracker (`/airdrops`):** +- Search bar to filter by project name +- Filter tabs: All | Confirmed | Potential | Ended +- Table columns: Project (logo + name), Category (DeFi / L1 / L2 / NFT), Status badge (Confirmed = green, Potential = yellow, Ended = gray), Estimated Value, End Date, Action button ("Check Eligibility" opens a modal with placeholder wallet input) +- Include at least 8 mock airdrop entries covering: Berachain, Monad, Sui, ZKsync, LayerZero, Scroll, Linea, StarkNet + +**News Feed (`/news`):** +- Grid of news cards (3 columns desktop, 1 mobile) +- Each card: category tag (DeFi / Regulation / L2 / Bitcoin), headline, 2-line excerpt, source name, time ago +- Include at least 6 mock news articles + +**Shared Components:** +- Navbar: logo ("Ouwibo"), nav links (Home / Airdrops / News), dark background +- Footer: tagline, links, "No signup required" badge + +**Design System:** +- Dark theme: background `#0f172a`, card `#1e293b`, accent `#6366f1` (indigo) +- Font: Inter +- Status badges use colored pill shapes +- Fully responsive with Tailwind CSS utility classes + +**Technical Constraints:** +- Export a single default App component with client-side routing using react-router-dom +- No external UI libraries (no shadcn, no MUI) +- Use inline SVG or emoji for icons +- All data is hardcoded mock arrays defined at the top of the file diff --git a/templates/crypto-staking-dashboard.md b/templates/crypto-staking-dashboard.md deleted file mode 100644 index e7daabb..0000000 --- a/templates/crypto-staking-dashboard.md +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: Crypto Staking Dashboard -app_type: crypto-staking-dashboard -wallet: 0x1e660a9a1f1f08afef9c03c96d66260122464cf2 ---- - -You are an expert React developer. Generate a complete, production-ready React application for a crypto staking dashboard. - -Requirements: -- Header with logo, wallet address display (truncated), and a connect/disconnect button -- Portfolio overview section showing total staked value, total rewards earned, and APY percentage in stat cards -- Staking pools table with columns: Asset, APY, Total Staked, Your Stake, Rewards, and an Action button (Stake/Unstake) -- Active positions section listing current stakes with amount, duration, rewards accrued, and a Claim button -- Transaction history section with a simple table showing date, type, amount, and status badge -- Fully responsive layout using Tailwind CSS utility classes -- Use mock/placeholder data for all values — no real blockchain calls -- Clean, dark-themed professional UI with accent colors for positive/negative values - -Technical: -- React 18 with TypeScript -- Tailwind CSS for all styling -- Export a single default App component -- No external UI libraries or icon packs -- Use inline SVG for any icons -- All state managed with useState/useEffect hooks only