richer / index.html
Mauro-wayne7's picture
Coloca TD em português, e vamos trabalhar somente com o Pocket, e esse bot deve ser inteligente, o nome deve ser bigricher com uma ave segurando um saco com moedas escritas 777, e esse site deve ter uma entrada bonita - Initial Deployment
841d412 verified
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BigRicher Pocket | Análise Inteligente de Mercado</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700&family=Roboto:wght@300;400;500&display=swap');
body {
font-family: 'Roboto', sans-serif;
background-color: #0a0a15;
color: #e0e0e0;
overflow-x: hidden;
}
.orbitron {
font-family: 'Orbitron', sans-serif;
}
.gradient-text {
background: linear-gradient(90deg, #3f5efb, #fc466b);
-webkit-background-clip: text;
background-clip: text;
color: transparent;
}
.glow-box {
box-shadow: 0 0 15px rgba(63, 94, 251, 0.5);
}
.pulse {
animation: pulse 2s infinite;
}
@keyframes pulse {
0% {
box-shadow: 0 0 0 0 rgba(63, 94, 251, 0.7);
}
70% {
box-shadow: 0 0 0 10px rgba(63, 94, 251, 0);
}
100% {
box-shadow: 0 0 0 0 rgba(63, 94, 251, 0);
}
}
.chart-container {
background: rgba(20, 20, 40, 0.7);
backdrop-filter: blur(10px);
border-radius: 12px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.dropzone {
border: 2px dashed rgba(63, 94, 251, 0.5);
transition: all 0.3s ease;
}
.dropzone.active {
border-color: #3f5efb;
background: rgba(63, 94, 251, 0.1);
}
.result-card {
background: linear-gradient(135deg, rgba(30, 30, 60, 0.8), rgba(10, 10, 30, 0.9));
backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.1);
}
</style>
</head>
<body>
<!-- Navigation -->
<nav class="bg-black bg-opacity-80 backdrop-filter backdrop-blur-lg border-b border-gray-800 fixed w-full z-50">Ju
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex items-center justify-between h-16">
<div class="flex items-center">
<div class="flex-shrink-0">
<span class="text-2xl font-bold gradient-text orbitron">BIGRICHER</span>
</div>
<div class="hidden md:block">
<div class="ml-10 flex items-baseline space-x-4">
<a href="#" class="text-white px-3 py-2 rounded-md text-sm font-medium">Dashboard</a>
<a href="#" class="text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">How It Works</a>
<a href="#" class="text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Pricing</a>
<a href="#" class="text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Community</a>
</div>
</div>
</div>
<div class="hidden md:block">
<div class="ml-4 flex items-center md:ml-6 space-x-4">
<div class="relative">
<select id="languageSelect" class="bg-gray-800 text-white px-3 py-1 rounded-md text-sm border border-gray-700 focus:outline-none focus:ring-1 focus:ring-blue-500">
<option value="en">English</option>
<option value="pt">Português</option>
</select>
</div>
<button class="bg-gradient-to-r from-blue-500 to-purple-600 px-4 py-2 rounded-md text-sm font-medium text-white hover:opacity-90 transition">
Connect Wallet
</button>
</div>
</div>
<div class="-mr-2 flex md:hidden">
<button type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none">
<span class="sr-only">Open main menu</span>
<i class="fas fa-bars"></i>
</button>
</div>
</div>
</div>
</nav>
<!-- Hero Section -->
<div class="relative pt-24 pb-32 px-4 sm:px-6 lg:px-8">
<div class="max-w-7xl mx-auto">
<div class="text-center">
<div class="flex justify-center mb-6">
<img src="https://i.imgur.com/JK7lF3D.png" alt="BigRicher Logo" class="h-24">
</div>
<h1 class="text-4xl md:text-6xl font-bold mb-6 orbitron">
<span class="gradient-text">BigRicher</span> <span>Pocket</span>
</h1>
<p class="text-xl md:text-2xl text-gray-300 max-w-3xl mx-auto">
Análise inteligente de mercado para operações no Pocket. Receba sinais precisos em tempo real.
</p>
<div class="mt-10">
<button class="relative overflow-hidden glow-box pulse bg-gradient-to-r from-blue-500 to-purple-600 px-8 py-4 rounded-lg text-lg font-bold text-white hover:opacity-90 transition">
<span class="relative z-10">Try It Now - Free</span>
</button>
</div>
</div>
</div>
<!-- Floating elements -->
<div class="absolute top-0 left-0 w-full h-full overflow-hidden pointer-events-none">
<div class="absolute top-20 left-10 w-16 h-16 rounded-full bg-blue-500 opacity-20 filter blur-xl"></div>
<div class="absolute top-1/3 right-20 w-24 h-24 rounded-full bg-purple-600 opacity-20 filter blur-xl"></div>
<div class="absolute bottom-20 left-1/4 w-20 h-20 rounded-full bg-blue-400 opacity-20 filter blur-xl"></div>
<div class="absolute bottom-1/3 right-10 w-32 h-32 rounded-full bg-purple-500 opacity-20 filter blur-xl"></div>
</div>
</div>
<!-- Main Content -->
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pb-20">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
<!-- Upload Section -->
<div class="chart-container p-6">
<h2 class="text-2xl font-bold mb-6 orbitron gradient-text">Analise Seu Pocket</h2>
<div id="dropzone" class="dropzone rounded-lg p-8 flex flex-col items-center justify-center cursor-pointer">
<div class="text-center">
<i class="fas fa-cloud-upload-alt text-5xl mb-4 text-blue-400"></i>
<p class="text-lg mb-2">Arraste e solte o print do seu Pocket aqui</p>
<p class="text-sm text-gray-400 mb-4">ou</p>
<button id="uploadBtn" class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-md text-sm font-medium transition">
Procurar Arquivos
</button>
<input type="file" id="fileInput" class="hidden" accept="image/*">
</div>
</div>
<div class="mt-6">
<h3 class="text-lg font-semibold mb-3">Recent Uploads</h3>
<div class="grid grid-cols-3 gap-2">
<div class="bg-gray-800 rounded-md h-20 flex items-center justify-center opacity-50">
<i class="fas fa-image text-gray-500"></i>
</div>
<div class="bg-gray-800 rounded-md h-20 flex items-center justify-center opacity-50">
<i class="fas fa-image text-gray-500"></i>
</div>
<div class="bg-gray-800 rounded-md h-20 flex items-center justify-center opacity-50">
<i class="fas fa-image text-gray-500"></i>
</div>
</div>
</div>
</div>
<!-- Analysis Section -->
<div class="chart-container p-6">
<h2 class="text-2xl font-bold mb-6 orbitron gradient-text">Análise do Pocket</h2>
<!-- Placeholder for analysis results -->
<div id="analysisPlaceholder" class="text-center py-12">
<i class="fas fa-chart-line text-5xl mb-4 text-blue-400 opacity-50"></i>
<p class="text-gray-400">Envie um print do Pocket para análise instantânea</p>
</div>
<!-- Analysis Result (hidden by default) -->
<div id="analysisResult" class="hidden">
<div class="result-card rounded-lg p-6 mb-6">
<div class="flex justify-between items-center mb-4">
<h3 class="text-xl font-bold orbitron">EUR/USD - 1H Timeframe</h3>
<span class="px-3 py-1 rounded-full bg-green-900 text-green-300 text-sm font-bold">STRONG BUY</span>
</div>
<div class="grid grid-cols-2 gap-4 mb-6">
<div>
<p class="text-sm text-gray-400">Confidence Level</p>
<p class="text-lg font-bold text-green-400">89%</p>
</div>
<div>
<p class="text-sm text-gray-400">Time Analyzed</p>
<p class="text-lg">47s</p>
</div>
</div>
<div class="mb-4">
<h4 class="font-semibold mb-2">Key Indicators</h4>
<ul class="list-disc pl-5 text-sm text-gray-300 space-y-1">
<li>RSI showing oversold conditions (28.6)</li>
<li>MACD histogram turning positive</li>
<li>Price bouncing off strong support level</li>
<li>Bullish divergence on 15m chart</li>
</ul>
</div>
<div class="mb-4">
<h4 class="font-semibold mb-2">Recommended Entry</h4>
<p class="text-sm text-gray-300">1.0825 - 1.0835 with stop loss at 1.0800</p>
</div>
<div>
<h4 class="font-semibold mb-2">Take Profit Targets</h4>
<div class="grid grid-cols-3 gap-2 text-sm">
<div class="bg-gray-800 p-2 rounded text-center">
<p class="text-gray-400">TP1</p>
<p class="font-bold">1.0850</p>
</div>
<div class="bg-gray-800 p-2 rounded text-center">
<p class="text-gray-400">TP2</p>
<p class="font-bold">1.0875</p>
</div>
<div class="bg-gray-800 p-2 rounded text-center">
<p class="text-gray-400">TP3</p>
<p class="font-bold">1.0900</p>
</div>
</div>
</div>
</div>
<div class="flex space-x-4">
<button class="flex-1 bg-green-600 hover:bg-green-700 px-4 py-3 rounded-md font-bold transition">
<i class="fas fa-check-circle mr-2"></i> Confirm Trade
</button>
<button class="flex-1 bg-gray-700 hover:bg-gray-600 px-4 py-3 rounded-md font-bold transition">
<i class="fas fa-redo mr-2"></i> Re-analyze
</button>
</div>
</div>
</div>
</div>
<!-- Features Section -->
<div class="mt-20">
<h2 class="text-3xl font-bold mb-12 text-center orbitron gradient-text">Por que o BigRicher Pocket é diferente</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="chart-container p-6">
<div class="text-blue-400 text-3xl mb-4">
<i class="fas fa-bolt"></i>
</div>
<h3 class="text-xl font-bold mb-3 orbitron">Lightning Fast Analysis</h3>
<p class="text-gray-300">Get comprehensive market analysis in under 60 seconds. Our AI processes charts faster than any human analyst.</p>
</div>
<div class="chart-container p-6">
<div class="text-purple-400 text-3xl mb-4">
<i class="fas fa-brain"></i>
</div>
<h3 class="text-xl font-bold mb-3 orbitron">Advanced AI Algorithms</h3>
<p class="text-gray-300">Combining technical indicators, price action patterns, and sentiment analysis for maximum accuracy.</p>
</div>
<div class="chart-container p-6">
<div class="text-green-400 text-3xl mb-4">
<i class="fas fa-chart-pie"></i>
</div>
<h3 class="text-xl font-bold mb-3 orbitron">Multi-Timeframe Analysis</h3>
<p class="text-gray-300">Our system automatically analyzes higher timeframes to confirm the strength of the identified trend.</p>
</div>
</div>
</div>
<!-- Testimonials -->
<div class="mt-20">
<h2 class="text-3xl font-bold mb-12 text-center orbitron gradient-text">O que nossos usuários dizem</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="chart-container p-6">
<div class="flex items-center mb-4">
<div class="w-12 h-12 rounded-full bg-blue-500 flex items-center justify-center text-xl font-bold mr-4">JD</div>
<div>
<h4 class="font-bold">John D.</h4>
<p class="text-sm text-gray-400">Forex Trader since 2015</p>
</div>
</div>
<p class="text-gray-300">"FX Quantum has increased my win rate from 65% to 82% in just 3 months. The detailed analysis helps me understand why a trade is likely to work."</p>
<div class="flex mt-4">
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
</div>
</div>
<div class="chart-container p-6">
<div class="flex items-center mb-4">
<div class="w-12 h-12 rounded-full bg-purple-500 flex items-center justify-center text-xl font-bold mr-4">MS</div>
<div>
<h4 class="font-bold">Maria S.</h4>
<p class="text-sm text-gray-400">Swing Trader</p>
</div>
</div>
<p class="text-gray-300">"As someone who struggles with technical analysis, this tool has been a game-changer. I just upload my charts and get clear, actionable signals with explanations."</p>
<div class="flex mt-4">
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star text-yellow-400"></i>
<i class="fas fa-star-half-alt text-yellow-400"></i>
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="bg-black bg-opacity-80 border-t border-gray-800 py-12">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<div>
<h3 class="text-xl font-bold mb-4 orbitron gradient-text">BIGRICHER POCKET</h3>
<p class="text-gray-400">Análise inteligente para operações no Pocket.</p>
</div>
<div>
<h4 class="font-bold mb-4">Resources</h4>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white transition">Documentation</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">API</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Blog</a></li>
</ul>
</div>
<div>
<h4 class="font-bold mb-4">Company</h4>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white transition">About Us</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Careers</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">Contact</a></li>
</ul>
</div>
<div>
<h4 class="font-bold mb-4">Connect</h4>
<div class="flex space-x-4">
<a href="#" class="text-gray-400 hover:text-white transition text-xl"><i class="fab fa-twitter"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition text-xl"><i class="fab fa-telegram"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition text-xl"><i class="fab fa-discord"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition text-xl"><i class="fab fa-youtube"></i></a>
</div>
</div>
</div>
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-500 text-sm">
<p>© 2023 BigRicher Pocket. Todos os direitos reservados.</p>
</div>
</div>
</footer>
<script>
// Language switching
const languageSelect = document.getElementById('languageSelect');
languageSelect.addEventListener('change', (e) => {
const lang = e.target.value;
document.querySelectorAll('[data-en], [data-pt]').forEach(el => {
if (el.dataset[lang]) {
if (el.tagName === 'INPUT' || el.tagName === 'SELECT' || el.tagName === 'TEXTAREA') {
el.placeholder = el.dataset[lang];
} else {
el.textContent = el.dataset[lang];
}
}
});
});
// Dropzone functionality
const dropzone = document.getElementById('dropzone');
const fileInput = document.getElementById('fileInput');
const uploadBtn = document.getElementById('uploadBtn');
const analysisPlaceholder = document.getElementById('analysisPlaceholder');
const analysisResult = document.getElementById('analysisResult');
// Highlight dropzone when dragging over
['dragenter', 'dragover'].forEach(eventName => {
dropzone.addEventListener(eventName, () => {
dropzone.classList.add('active');
});
});
// Remove highlight when dragging leaves
['dragleave', 'drop'].forEach(eventName => {
dropzone.addEventListener(eventName, () => {
dropzone.classList.remove('active');
});
});
// Handle file drop
dropzone.addEventListener('drop', (e) => {
e.preventDefault();
if (e.dataTransfer.files.length) {
handleFile(e.dataTransfer.files[0]);
}
});
// Handle file selection via button
uploadBtn.addEventListener('click', () => {
fileInput.click();
});
fileInput.addEventListener('change', () => {
if (fileInput.files.length) {
handleFile(fileInput.files[0]);
}
});
// Process the uploaded file
function handleFile(file) {
if (!file.type.match('image.*')) {
alert('Please upload an image file');
return;
}
// Show loading state
dropzone.innerHTML = `
<div class="text-center">
<i class="fas fa-spinner fa-spin text-3xl mb-4 text-blue-400"></i>
<p class="text-lg">Analyzing your chart...</p>
</div>
`;
// Simulate analysis (in a real app, this would be an API call)
setTimeout(() => {
// Show result
analysisPlaceholder.classList.add('hidden');
analysisResult.classList.remove('hidden');
// Reset dropzone
dropzone.innerHTML = `
<div class="text-center">
<i class="fas fa-check-circle text-5xl mb-4 text-green-400"></i>
<p class="text-lg mb-2">Analysis Complete!</p>
<p class="text-sm text-gray-400 mb-4">Upload another chart</p>
<button id="uploadBtn" class="bg-gray-800 hover:bg-gray-700 px-4 py-2 rounded-md text-sm font-medium transition">
Browse Files
</button>
</div>
`;
// Reattach event listener to new button
document.getElementById('uploadBtn').addEventListener('click', () => {
fileInput.click();
});
}, 3000);
}
</script>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Mauro-wayne7/richer" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>