--- title: "Jennifer Lopes" format: html: css: ["estilo_geral.scss"] toc: false code-fold: false code-tools: true code-annotations: hover --- ```{=html} <style> .cafe-hero { position: relative; min-height: 70vh; display: flex; align-items: center; justify-content: center; overflow: hidden; background: radial-gradient(circle at 30% 20%, #FAF0DC 0%, #F5E6D3 55%, #EFDCC0 100%); border-radius: 20px; margin-bottom: 40px; } #cafe-network-canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .cafe-hero-content { position: relative; z-index: 2; text-align: center; padding: 60px 6%; } .cafe-hero-content img.cafe-logo { width: 170px; height: auto; margin-bottom: 8px; filter: drop-shadow(0 8px 20px rgba(107,79,79,0.25)); } .cafe-hero-content h1 { font-family: 'Poppins', sans-serif; font-size: 48px; font-weight: 700; color: #4B2E2B !important; line-height: 1; margin-bottom: 6px; } .cafe-hero-content .cafe-tagline { font-family: 'Open Sans', sans-serif; font-size: 15px; font-weight: 500; letter-spacing: 0.5px; color: #6B4F4F; margin-bottom: 30px; } .cafe-hero-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; } .cafe-btn-primary { background: #6B4F4F; color: #fff !important; padding: 12px 24px; border-radius: 24px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; text-decoration: none !important; box-shadow: 0 6px 18px rgba(107,79,79,0.3); transition: all 0.25s; } .cafe-btn-primary:hover { background: #4B2E2B; transform: translateY(-2px); } .cafe-btn-outline { background: transparent; color: #4B2E2B !important; padding: 12px 24px; border: 2px solid #6B4F4F; border-radius: 24px; font-family: 'Poppins', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: 0.5px; text-transform: uppercase; text-decoration: none !important; transition: all 0.25s; } .cafe-btn-outline:hover { background: #6B4F4F; color: #fff !important; } @media (max-width: 700px) { .cafe-hero-content h1 { font-size: 34px; } .cafe-hero-content img.cafe-logo { width: 120px; } } </style> <section class="cafe-hero"> <canvas id="cafe-network-canvas"></canvas> <div class="cafe-hero-content"> <img src="cafecomr/imagens/logo.png" alt="Café com R" class="cafe-logo" onerror="this.style.display='none';"> <h1>Café com R</h1> <div class="cafe-tagline">Dados, R e uma boa conversa</div> <div class="cafe-hero-btns"> <a href="https://jenniferlopes.github.io/meu_site/cafecomr/" class="cafe-btn-primary" target="_blank">Newsletter</a> <a href="https://jenniferlopes.github.io/meu_site/apresenta%C3%A7%C3%B5es/" class="cafe-btn-outline" target="_blank">Aulas do Café</a> <a href="https://jenniferlopes.github.io/meu_site/" class="cafe-btn-outline" target="_blank">Sobre o projeto</a> <a href="https://jenniferlopes.lovable.app/" class="cafe-btn-outline" target="_blank">Todas minhas redes</a> </div> </div> </section> <script> (function () { const canvas = document.getElementById('cafe-network-canvas'); if (!canvas) return; const ctx = canvas.getContext('2d'); const NUM_POINTS = 45; const MAX_DIST = 140; const SPEED = 0.5; const points = []; const SYMBOLS = ['μ', 'σ²', 'var(x)', 'P(A)', 'H₀·H₁', 'x̄', 'R', 'n']; const NUM_SYMBOLS = 12; const symbols = []; const mouse = { x: null, y: null, radius: 150 }; function resize() { canvas.width = canvas.offsetWidth * devicePixelRatio; canvas.height = canvas.offsetHeight * devicePixelRatio; ctx.setTransform(1, 0, 0, 1, 0, 0); ctx.scale(devicePixelRatio, devicePixelRatio); } function initPoints() { points.length = 0; const w = canvas.offsetWidth; const h = canvas.offsetHeight; for (let i = 0; i < NUM_POINTS; i++) { points.push({ x: Math.random() * w, y: Math.random() * h, vx: (Math.random() - 0.5) * SPEED, vy: (Math.random() - 0.5) * SPEED }); } } function initSymbols() { symbols.length = 0; const w = canvas.offsetWidth; const h = canvas.offsetHeight; for (let i = 0; i < NUM_SYMBOLS; i++) { symbols.push({ x: Math.random() * w, y: Math.random() * h, vx: (Math.random() - 0.5) * SPEED * 0.5, vy: (Math.random() - 0.5) * SPEED * 0.5, char: SYMBOLS[Math.floor(Math.random() * SYMBOLS.length)], size: 14 + Math.random() * 14, opacity: 0.14 + Math.random() * 0.16 }); } } canvas.addEventListener('mousemove', (e) => { const rect = canvas.getBoundingClientRect(); mouse.x = e.clientX - rect.left; mouse.y = e.clientY - rect.top; }); canvas.addEventListener('mouseleave', () => { mouse.x = null; mouse.y = null; }); function tick() { const w = canvas.offsetWidth; const h = canvas.offsetHeight; ctx.clearRect(0, 0, w, h); for (const p of points) { p.x += p.vx; p.y += p.vy; if (p.x < 0 || p.x > w) p.vx *= -1; if (p.y < 0 || p.y > h) p.vy *= -1; if (mouse.x !== null) { const dx = mouse.x - p.x; const dy = mouse.y - p.y; const dist = Math.sqrt(dx * dx + dy * dy); if (dist < mouse.radius) { p.x += dx * 0.0015; p.y += dy * 0.0015; } } } for (let i = 0; i < points.length; i++) { for (let j = i + 1; j < points.length; j++) { const a = points[i], b = points[j]; const dx = a.x - b.x; const dy = a.y - b.y; const dist = Math.sqrt(dx * dx + dy * dy); if (dist < MAX_DIST) { const t = dist / MAX_DIST; const opacity = (1 - t) * 0.28; ctx.strokeStyle = `rgba(107,79,79,${opacity})`; ctx.lineWidth = 0.8; ctx.beginPath(); ctx.moveTo(a.x, a.y); ctx.lineTo(b.x, b.y); ctx.stroke(); } } } for (const p of points) { ctx.beginPath(); ctx.arc(p.x, p.y, 2, 0, Math.PI * 2); ctx.fillStyle = 'rgba(107,79,79,0.5)'; ctx.fill(); } for (const s of symbols) { s.x += s.vx; s.y += s.vy; if (s.x < -30 || s.x > w + 30) s.vx *= -1; if (s.y < -30 || s.y > h + 30) s.vy *= -1; ctx.font = `600 ${s.size}px 'Poppins', sans-serif`; ctx.fillStyle = `rgba(75,46,43,${s.opacity})`; ctx.fillText(s.char, s.x, s.y); } requestAnimationFrame(tick); } window.addEventListener('resize', () => { resize(); initPoints(); initSymbols(); }); resize(); initPoints(); initSymbols(); tick(); })(); </script> ``` ### Bem-vinda(o) ao meu espaço de dados e ideias > **Quatro valores que guiam tudo o que faço: `clareza`, `aprendizado contínuo`, `colaboração` e `propósito`.** 🤎 1. Projetos de experimentação agrícola, análises estatísticas em R2. Dashboards e automações com Quarto, Shiny e APIs3. Reflexões sobre comunidade, aprendizado e dados abertos< br > ```{=html} <div style="display:flex; gap:16px; margin-top:20px; margin-bottom:30px; flex-wrap:wrap;"> <div style="flex:1; min-width:200px;"> <img src="imagens/luna.jpeg" alt="Luna" style="width:100%; height:260px; object-fit:cover; border-radius:14px; box-shadow:0 6px 18px rgba(107,79,79,0.2);"> </div> <div style="flex:1; min-width:200px;"> <img src="imagens/meguy.jpeg" alt="Meguy" style="width:100%; height:260px; object-fit:cover; border-radius:14px; box-shadow:0 6px 18px rgba(107,79,79,0.2);"> </div> <div style="flex:1; min-width:200px;"> <img src="imagens/asduas.jpeg" alt="Luna e Meguy juntas" style="width:100%; height:260px; object-fit:cover; border-radius:14px; box-shadow:0 6px 18px rgba(107,79,79,0.2);"> </div> </div> ``` < br > ### ☕ Café com R > Que cada **gole** desperte uma nova ideia. > > Que cada **script** abra uma nova conversa. > > Que o **Café com R**, se torne um ponto de encontro nosso! < br > ```{=html} <iframe src="https://cafecomr-conteudos.lovable.app/" width="80%" height="500" style="border:0; border-radius:16px;" title="Newsletter Café com R"> </iframe> ``` 
