Revert "Add live email"

This reverts commit 8454ac0c18.
This commit is contained in:
Roshan Yadav committed 2026-08-30 17:51:34 +05:30
1 parent 8454ac0c18
commit 78b16facc9
1 file changed
-543
-543
View File
@@ -1,543 +0,0 @@
<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Roshan Yadav | Software Engineering & AI Technology</title>
<meta name="description" content="High-performance enterprise applications, web platforms, machine learning pipelines, and payment system engineering.">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600&family=Inter:wght@300;400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<!-- Navigation Header -->
<header class="navbar" id="navbar">
<div class="nav-container">
<a href="#" class="brand">
<span class="brand-prefix">&lt;&#47;&gt;</span>
<span class="brand-name">ROSHAN YADAV</span>
<span class="brand-badge">ENGINEERING</span>
</a>
<nav class="nav-menu" id="nav-menu">
<a href="#work" class="nav-item"><span class="item-num">01.</span> WORK</a>
<a href="#capabilities" class="nav-item"><span class="item-num">02.</span> CAPABILITIES</a>
<a href="#tech" class="nav-item"><span class="item-num">03.</span> TECH STACK</a>
<a href="#contact" class="nav-item"><span class="item-num">04.</span> CONTACT</a>
<a href="https://github.com/Roshan-py" target="_blank" rel="noopener" class="nav-item nav-github">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"/></svg>
<span>GITHUB</span>
</a>
</nav>
<div class="nav-actions">
<!-- Theme Switcher Button -->
<button class="theme-toggle-btn" id="theme-toggle" aria-label="Switch between Day and Night mode" title="Toggle Day/Night Mode">
<span class="theme-icon sun-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>
</span>
<span class="theme-icon moon-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
</span>
<span class="theme-label" id="theme-label">NIGHT</span>
</button>
<!-- Mobile Menu Button -->
<button class="mobile-toggle" id="mobile-toggle" aria-label="Toggle Navigation Menu">
<span class="toggle-bar"></span>
<span class="toggle-bar"></span>
<span class="toggle-bar"></span>
</button>
</div>
</div>
</header>
<main id="main-content">
<!-- Hero Section -->
<section class="hero">
<div class="hero-container">
<!-- Left Messaging Column -->
<div class="hero-left">
<div class="status-tag">
<span class="tag-pulse"></span>
<span class="tag-text">SYSTEMS ONLINE // FULLSTACK &amp; AI ENGINEERING</span>
</div>
<h1 class="hero-headline">
Architecting High-Throughput <span class="accent-text">Web Applications</span> &amp; <span class="gradient-accent">Machine Learning</span> Pipelines.
</h1>
<p class="hero-subhead">
We build robust enterprise backends, dynamic web applications, payment integrations, and automated AI data pipelines using
<strong>Python, FastAPI, Django, HTML5, CSS3, and JavaScript</strong>.
</p>
<div class="hero-cta">
<a href="#work" class="btn btn-primary">
<span>EXPLORE WHAT WE'RE BUILDING</span>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></svg>
</a>
<a href="https://github.com/Roshan-py" target="_blank" rel="noopener" class="btn btn-outline">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"/></svg>
<span>GITHUB PROFILE</span>
</a>
<a href="#contact" class="btn btn-secondary">
<span>CONTACT</span>
</a>
</div>
<!-- System Telemetry Metrics -->
<div class="hero-specs">
<div class="spec-box">
<span class="spec-val">4+</span>
<span class="spec-lbl">Production Platforms</span>
</div>
<div class="spec-sep"></div>
<div class="spec-box">
<span class="spec-val">Python / JS</span>
<span class="spec-lbl">Core Tech Stack</span>
</div>
<div class="spec-sep"></div>
<div class="spec-box">
<span class="spec-val">100%</span>
<span class="spec-lbl">API Security Compliance</span>
</div>
</div>
</div>
<!-- Right Engineered Architecture Console -->
<div class="hero-right">
<div class="console-card">
<div class="console-header">
<div class="console-dots">
<span class="dot red"></span>
<span class="dot yellow"></span>
<span class="dot green"></span>
</div>
<div class="console-title">ENGINEERING CONSOLE v2.4</div>
<div class="console-tabs">
<button class="tab-btn active" data-tab="pipeline">PIPELINE</button>
<button class="tab-btn" data-tab="inference">ML INFER</button>
<button class="tab-btn" data-tab="stack">STACK</button>
</div>
</div>
<div class="console-body">
<!-- Tab 1: Pipeline -->
<div class="tab-content active" id="tab-pipeline">
<div class="code-line"><span class="c-keyword">import</span> <span class="c-val">fastapi</span>, <span class="c-val">asyncio</span>, <span class="c-val">torch</span></div>
<div class="code-line"><span class="c-comment"># Initializing ASGI Backend Architecture</span></div>
<div class="code-line"><span class="c-func">app</span> = fastapi.<span class="c-func">FastAPI</span>(title=<span class="c-str">"Roshan.Engineering.API"</span>)</div>
<div class="code-line"></div>
<div class="code-line"><span class="c-decorator">@app.post</span>(<span class="c-str">"/v1/predict"</span>)</div>
<div class="code-line"><span class="c-keyword">async def</span> <span class="c-func">run_telemetry_pipeline</span>(payload: dict):</div>
<div class="code-line"> result = <span class="c-keyword">await</span> inference_engine.<span class="c-func">evaluate</span>(payload)</div>
<div class="code-line"> <span class="c-keyword">return</span> {<span class="c-str">"status"</span>: <span class="c-str">"success"</span>, <span class="c-str">"latency"</span>: <span class="c-str">"14ms"</span>, <span class="c-str">"data"</span>: result}</div>
<div class="console-status-box">
<div class="status-row">
<span>BACKEND:</span> <span class="text-green">Python 3.11 / FastAPI ASGI</span>
</div>
<div class="status-row">
<span>PAYMENTS:</span> <span class="text-blue">Stripe Webhook Handshake [PCI Ready]</span>
</div>
<div class="status-row">
<span>DEPLOYMENT:</span> <span class="text-purple">Docker Container / Cloud Engine</span>
</div>
</div>
</div>
<!-- Tab 2: Inference Simulator -->
<div class="tab-content" id="tab-inference">
<div class="infer-control">
<label for="infer-text">Test Live Inference Payload:</label>
<div class="infer-input-wrap">
<input type="text" id="infer-text" value="Python FastAPI backend with payment gateway and machine learning models." placeholder="Type payload text...">
<button id="btn-exec-infer" class="btn-console-exec">RUN</button>
</div>
</div>
<div class="console-output">
<span class="output-label">JSON RESPONSE:</span>
<pre id="console-json">{
"engine": "PyTorch Neural Predictor",
"classification": "Enterprise Software & ML",
"confidence": "98.8%",
"latency": "11.4ms"
}</pre>
</div>
</div>
<!-- Tab 3: Tech Stack -->
<div class="tab-content" id="tab-stack">
<div class="stack-list">
<div class="stack-item">
<span class="st-name">Python / FastAPI / Django</span>
<span class="st-badge">Core Backend</span>
</div>
<div class="stack-item">
<span class="st-name">HTML5 / CSS3 / ES6+ JavaScript</span>
<span class="st-badge">Web Engineering</span>
</div>
<div class="stack-item">
<span class="st-name">PyTorch / Scikit-Learn</span>
<span class="st-badge">Machine Learning</span>
</div>
<div class="stack-item">
<span class="st-name">Stripe &amp; FinTech APIs</span>
<span class="st-badge">Payment Gateway</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Section: What We're Building (Production Work) -->
<section id="work" class="section">
<div class="section-container">
<div class="section-header">
<div class="section-tag">// PRODUCTION &amp; CLIENT WORK</div>
<h2 class="section-title">What We Are Building</h2>
<p class="section-sub">Production platforms, technical portals, and specialized engineering applications built for performance.</p>
</div>
<div class="work-grid">
<!-- Project Card 1: 3S Hospitality -->
<article class="work-card">
<div class="card-header-tag">
<span class="badge-cat">ENTERPRISE HOSPITALITY</span>
<span class="badge-status live">● LIVE SITE</span>
</div>
<h3 class="card-title">3S Hospitality Management</h3>
<p class="card-purpose">
<strong>Problem Solved:</strong> Streamlines resort operations, multi-property management, and automated booking reservation workflows into a unified platform.
</p>
<div class="card-outcomes">
<div class="outcome-tag">Multi-Tenant Management</div>
<div class="outcome-tag">Automated Bookings</div>
<div class="outcome-tag">Enterprise Portal</div>
</div>
<div class="card-tech-stack">
<span>Web Platform</span><span>Python/Django</span><span>REST APIs</span><span>UX Architecture</span>
</div>
<div class="card-footer">
<a href="https://3shospitalitymanagement.com/" target="_blank" rel="noopener" class="card-link">
<span>VISIT 3SHOPITALITYMANAGEMENT.COM</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="7" y1="17" x2="17" y2="7"/><polyline points="7 7 17 7 17 17"/></svg>
</a>
</div>
</article>
<!-- Project Card 2: Nexarch Infrastructure -->
<article class="work-card">
<div class="card-header-tag">
<span class="badge-cat">INFRASTRUCTURE &amp; AEC</span>
<span class="badge-status live">● LIVE SITE</span>
</div>
<h3 class="card-title">Nexarch Infrastructure</h3>
<p class="card-purpose">
<strong>Problem Solved:</strong> Engineering portal presenting civil infrastructure developments, structural project portfolios, and technical assets.
</p>
<div class="card-outcomes">
<div class="outcome-tag">Civil Engineering Portal</div>
<div class="outcome-tag">Asset Visualization</div>
<div class="outcome-tag">Enterprise Architecture</div>
</div>
<div class="card-tech-stack">
<span>Engineering Software</span><span>Infrastructure Tech</span><span>High-Scale Web</span>
</div>
<div class="card-footer">
<a href="https://nexarchinfrastructure.com/" target="_blank" rel="noopener" class="card-link">
<span>VISIT NEXARCHINFRASTRUCTURE.COM</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="7" y1="17" x2="17" y2="7"/><polyline points="7 7 17 7 17 17"/></svg>
</a>
</div>
</article>
<!-- Project Card 3: Design Iconica -->
<article class="work-card">
<div class="card-header-tag">
<span class="badge-cat">CREATIVE ARCHITECTURE</span>
<span class="badge-status live">● LIVE SITE</span>
</div>
<h3 class="card-title">Design Iconica</h3>
<p class="card-purpose">
<strong>Problem Solved:</strong> Architectural design studio platform combining high-resolution visual showcase engines with client project management portals.
</p>
<div class="card-outcomes">
<div class="outcome-tag">Architectural Portfolio</div>
<div class="outcome-tag">Interactive Design Engine</div>
<div class="outcome-tag">Responsive UX</div>
</div>
<div class="card-tech-stack">
<span>Web Applications</span><span>Design Suite</span><span>Interactive JS</span>
</div>
<div class="card-footer">
<a href="https://designiconica.com/" target="_blank" rel="noopener" class="card-link">
<span>VISIT DESIGNICONICA.COM</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="7" y1="17" x2="17" y2="7"/><polyline points="7 7 17 7 17 17"/></svg>
</a>
</div>
</article>
<!-- Project Card 4: Machine Learning Inference System -->
<article class="work-card highlight-border">
<div class="card-header-tag">
<span class="badge-cat">MACHINE LEARNING &amp; AI</span>
<span class="badge-status dev">● PRODUCTION ML</span>
</div>
<h3 class="card-title">Neural Analytics &amp; ML Predictor</h3>
<p class="card-purpose">
<strong>Problem Solved:</strong> High-speed text classification, anomaly detection, and predictive scoring wrapped in an asynchronous Python FastAPI ASGI microservice.
</p>
<div class="card-outcomes">
<div class="outcome-tag">Real-Time Inference</div>
<div class="outcome-tag">PyTorch Pipeline</div>
<div class="outcome-tag">Microservice API</div>
</div>
<div class="card-tech-stack">
<span>Python 3.11</span><span>FastAPI</span><span>PyTorch</span><span>Scikit-Learn</span>
</div>
<div class="card-footer">
<a href="#hero" class="card-link nav-console-trigger">
<span>TEST IN HERO CONSOLE</span>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polygon points="5 3 19 12 5 21 5 3"/></svg>
</a>
</div>
</article>
</div>
</div>
</section>
<!-- Section: What We Can Achieve (Capabilities) -->
<section id="capabilities" class="section bg-subtle">
<div class="section-container">
<div class="section-header">
<div class="section-tag">// OUTCOME-DRIVEN CAPABILITIES</div>
<h2 class="section-title">What Can Be Achieved</h2>
<p class="section-sub">Demonstrated engineering capabilities producing tangible technical outcomes for web platforms and enterprise backends.</p>
</div>
<div class="cap-grid">
<div class="cap-card">
<div class="cap-icon">🐍</div>
<h3 class="cap-name">Python &amp; Backend Engineering</h3>
<p class="cap-desc">
High-concurrency backend microservices using <strong>FastAPI</strong> and <strong>Django</strong> for enterprise business logic, database ORMs, background workers, and scalable REST APIs.
</p>
</div>
<div class="cap-card">
<div class="cap-icon">🌐</div>
<h3 class="cap-name">Web Application Architecture</h3>
<p class="cap-desc">
Full-stack web applications built with <strong>HTML5, CSS3, and JavaScript (ES6+)</strong> featuring responsive UIs, dynamic state management, and sub-second page performance.
</p>
</div>
<div class="cap-card">
<div class="cap-icon">🤖</div>
<h3 class="cap-name">Machine Learning Integration</h3>
<p class="cap-desc">
Deployment of machine learning models using <strong>PyTorch</strong> and <strong>Scikit-Learn</strong>, turning raw data into predictive REST API endpoints and intelligent web applications.
</p>
</div>
<div class="cap-card">
<div class="cap-icon">💳</div>
<h3 class="cap-name">Payment Gateway Integrations</h3>
<p class="cap-desc">
Seamless integration of <strong>Stripe, Razorpay, and PayPal</strong> featuring encrypted payment flows, webhook verification, automated billing, and subscription management.
</p>
</div>
<div class="cap-card">
<div class="cap-icon">⚙️</div>
<h3 class="cap-name">Engineering &amp; Technical Calculators</h3>
<p class="cap-desc">
Specialized engineering portals, technical calculators, CAD/infrastructure asset displays, and numerical data processing for domain-specific applications.
</p>
</div>
<div class="cap-card">
<div class="cap-icon">📦</div>
<h3 class="cap-name">DevOps &amp; Infrastructure</h3>
<p class="cap-desc">
Containerized deployments with <strong>Docker, Linux environments, and Git version control</strong> ensuring reliable CI/CD pipelines and repeatable staging environments.
</p>
</div>
</div>
</div>
</section>
<!-- Section: Technology Stack -->
<section id="tech" class="section">
<div class="section-container">
<div class="section-header">
<div class="section-tag">// VERIFIED COMPETENCIES</div>
<h2 class="section-title">Technology Stack</h2>
<p class="section-sub">Technologies actively used across production platforms and software projects.</p>
</div>
<div class="tech-box-grid">
<div class="tech-pill-box">
<span class="tp-icon">🐍</span>
<div class="tp-info">
<span class="tp-title">Python</span>
<span class="tp-sub">FastAPI, Django, AsyncIO</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">⚡</span>
<div class="tp-info">
<span class="tp-title">FastAPI &amp; Django</span>
<span class="tp-sub">REST APIs &amp; Microservices</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">🌐</span>
<div class="tp-info">
<span class="tp-title">HTML5 &amp; CSS3</span>
<span class="tp-sub">Responsive HUD Systems</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">📜</span>
<div class="tp-info">
<span class="tp-title">JavaScript (ES6+)</span>
<span class="tp-sub">Single-Page App Logic</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">🧠</span>
<div class="tp-info">
<span class="tp-title">PyTorch &amp; Scikit</span>
<span class="tp-sub">Machine Learning Models</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">💳</span>
<div class="tp-info">
<span class="tp-title">Stripe &amp; FinTech</span>
<span class="tp-sub">Payment Webhooks &amp; APIs</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">🐳</span>
<div class="tp-info">
<span class="tp-title">Docker &amp; Linux</span>
<span class="tp-sub">Containerized Deployments</span>
</div>
</div>
<div class="tech-pill-box">
<span class="tp-icon">🔀</span>
<div class="tp-info">
<span class="tp-title">Git &amp; GitHub</span>
<span class="tp-sub">Version Control &amp; CI</span>
</div>
</div>
</div>
</div>
</section>
<!-- Section: Contact / Project Inquiry -->
<section id="contact" class="section bg-subtle">
<div class="section-container">
<div class="contact-wrapper">
<div class="contact-info">
<div class="section-tag">// INITIATE ENGAGEMENT</div>
<h2 class="contact-title">Let's Build Serious Software Together</h2>
<p class="contact-sub">
Have an enterprise application, web platform, payment integration, or machine learning project?
Reach out to discuss technical architecture and implementation parameters.
</p>
<div class="contact-details">
<div class="c-detail-item">
<span class="c-lbl">DEVELOPER:</span>
<span class="c-val">Roshan Yadav (Roshan-py)</span>
</div>
<div class="c-detail-item">
<span class="c-lbl">EMAIL:</span>
<a href="mailto:er.roshan.y@gmail.com" class="c-val link-underline">er.roshan.y@gmail.com</a>
</div>
<div class="c-detail-item">
<span class="c-lbl">LOCATION:</span>
<span class="c-val">India // Available Globally</span>
</div>
<div class="c-detail-item">
<span class="c-lbl">GITHUB:</span>
<a href="https://github.com/Roshan-py" target="_blank" rel="noopener" class="c-val link-underline">github.com/Roshan-py</a>
</div>
</div>
</div>
<div class="contact-card">
<form id="contact-form" class="c-form" onsubmit="return false;">
<div class="form-field">
<label for="c-name">YOUR NAME / ORGANIZATION:</label>
<input type="text" id="c-name" placeholder="e.g. Roshan Yadav" required>
</div>
<div class="form-field">
<label for="c-email">EMAIL ADDRESS:</label>
<input type="email" id="c-email" placeholder="name@company.com" required>
</div>
<div class="form-field">
<label for="c-stream">PRIMARY CAPABILITY / STREAM:</label>
<select id="c-stream">
<option value="enterprise">Enterprise Application Development (Python/Django)</option>
<option value="webapp">Web Application Architecture (HTML/CSS/JS)</option>
<option value="ml">Machine Learning / AI Integration (FastAPI/PyTorch)</option>
<option value="payments">Payment Gateway Integration (Stripe/FinTech)</option>
<option value="engineering">Engineering Application &amp; Tools</option>
</select>
</div>
<div class="form-field">
<label for="c-msg">PROJECT PARAMETERS / DETAILS:</label>
<textarea id="c-msg" rows="4" placeholder="Describe the scope, objectives, or questions..." required></textarea>
</div>
<button type="submit" id="btn-submit" class="btn btn-primary btn-full">
<span>TRANSMIT INQUIRY</span>
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
</button>
</form>
<div id="contact-response" class="contact-response"></div>
</div>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer class="footer">
<div class="footer-container">
<div class="footer-left">
<span class="brand-prefix">&lt;&#47;&gt;</span> <strong>ROSHAN YADAV</strong> // SOFTWARE ENGINEERING &amp; AI
<p class="footer-copy">&copy; 2026 Roshan Yadav. Engineered for performance and clarity.</p>
</div>
<div class="footer-right">
<a href="https://github.com/Roshan-py" target="_blank" rel="noopener" class="footer-link">GitHub</a>
<a href="#work" class="footer-link">Work</a>
<a href="#capabilities" class="footer-link">Capabilities</a>
<a href="#contact" class="footer-link">Contact</a>
</div>
</div>
</footer>
<script src="app.js"></script>
</body>
</html>