Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
165 changes: 165 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,165 @@

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Ishitha Madicharla — AIML Student</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
<script src="main.js"></script>
</head>
<body>
<header class="site-header">
<div class="container header-inner">
<h1 class="logo">Ishitha Madicharla</h1>
<nav class="nav">
<a href="#about">About</a>
<a href="#projects">Projects</a>
<a href="#skills">Skills</a>
<a href="#education">Education</a>
<a href="#contact">Contact</a>
</nav>
</div>
</header>

<main>
<section class="hero container">
<div class="hero-left">
<div class="avatar">IM</div>
<div>
<p class="subtitle">AIML Student</p>
<h2>Hi — I'm Ishitha</h2>
<p class="lead">I am a 2nd-year BTech AIML student passionate about building AI models, automation tools, and full-stack web apps. I enjoy solving real-world problems using Python, ML, and React. Currently looking for opportunities to intern and collaborate on AI or software projects.</p>

<div class="contact-quick">
<a href="mailto:ishithamadicharla16@gmail.com">ishithamadicharla16@gmail.com</a>
<span>•</span>
<a href="tel:+919000875688">+91 90008 75688</a>
</div>

<div class="links">
<a href="https://github.com/ishitha1611" target="_blank" rel="noopener">GitHub</a>
<a href="https://www.linkedin.com/in/ishitha-madicharla-2342212a3/" target="_blank" rel="noopener">LinkedIn</a>
</div>
</div>
</div>

<div class="hero-right">
<div class="card">
<h3>Quick Facts</h3>
<ul>
<li><strong>Location:</strong> India</li>
<li><strong>Role:</strong> 2nd-year BTech AIML student</li>
<li><strong>Open to:</strong> Internships, collaborations</li>
</ul>
</div>
</div>
</section>

<section id="skills" class="container section">
<h3>Technical Skills</h3>
<div class="chips">
<span>HTML</span>
<span>CSS</span>
<span>JavaScript</span>
<span>Python</span>
<span>Pandas</span>
<span>Scikit-learn</span>
<span>React</span>
<span>Cloud basics</span>
</div>

<h3 style="margin-top:1.25rem">Soft Skills</h3>
<div class="chips">
<span>Teamwork</span>
<span>Communication</span>
</div>
</section>

<section id="projects" class="container section">
<h3>Projects</h3>
<p class="muted"></p>

<div class="project-grid">
<article class="project">
<h4>Spam Email Detection</h4>
<p>Machine learning model to classify emails as spam or not-spam. Built using Python, Pandas, scikit-learn and evaluated with precision/recall metrics.</p>
<p class="meta">Tech: Python, Pandas, scikit-learn</p>
<a href="#" class="btn small">View on GitHub</a>
</article>

<article class="project">
<h4>CRUD Task Manager (React)</h4>
<p>A responsive task manager with create/read/update/delete features and local storage persistence. Designed with React and modern hooks.</p>
<p class="meta">Tech: React, JavaScript, HTML, CSS</p>
<a href="#" class="btn small">View on GitHub</a>
</article>

<article class="project">
<h4>Handwritten Digit Recognition</h4>
<p>Convolutional neural network trained on MNIST to recognize digits with data augmentation and simple preprocessing.</p>
<p class="meta">Tech: Python, TensorFlow/Keras, NumPy</p>
<a href="#" class="btn small">View on GitHub</a>
</article>
</div>
</section>

<section id="education" class="container section">
<h3>Education</h3>
<div class="edu-grid">
<div class="edu">
<h4>BTech — AIML (2nd year)</h4>
<p>Currently pursuing a BTech in AIML.</p>
</div>

<div class="edu">
<h4>Intermediate — Narayana Junior College</h4>
<p>CGPA: 9.2</p>
</div>

<div class="edu">
<h4>Schooling — Slate The School</h4>
<p>10 CGPA</p>
</div>
</div>

<h3 style="margin-top:1rem">Certifications</h3>
<ul class="certs">
<li>Python Developer</li>
<li>AWS Architect Solutions</li>
<li>Microsoft Azure Fundamentals</li>
<li>B10X AAI Tools Workshop</li>
</ul>
</section>

<section id="contact" class="container section contact-section">
<h3>Contact</h3>
<p>If you'd like to get in touch for internships or collaborations, you can email me or call.</p>

<div class="contact-cards">
<div class="card small">
<h4>Email</h4>
<p><a href="mailto:ishithamadicharla16@gmail.com">ishithamadicharla16@gmail.com</a></p>
</div>
<div class="card small">
<h4>Phone</h4>
<p><a href="tel:+919000875688">+91 90008 75688</a></p>
</div>
</div>

<p class="muted">Download resume: <a href="#" class="link">Resume (PDF)</a> — replace the link with your uploaded resume file.</p>
</section>
</main>

<footer class="site-footer">
<div class="container">
<p>© <strong>Ishitha Madicharla</strong> — AIML Student • <a href="https://github.com/ishitha1611" target="_blank" rel="noopener">GitHub</a></p>
</div>
</footer>

<!-- Link your JS file -->
<script src="main.js"></script>
</body>
</html>
81 changes: 81 additions & 0 deletions style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,81 @@
/* Base styles */
:root{
--bg:#0f1724;
--card:#0b1220;
--muted:#94a3b8;
--accent:#6ee7b7;
--glass: rgba(255,255,255,0.03);
--radius:14px;
--container:1100px;
font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}

*{box-sizing:border-box}
html,body{height:100%;}
body{
margin:0;
background: linear-gradient(180deg,#081224 0%, #071026 100%);
color:#e6eef6;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
line-height:1.5;
}
.container{max-width:var(--container);margin:0 auto;padding:1.5rem}

/* Header */
.site-header{backdrop-filter: blur(6px);border-bottom:1px solid rgba(255,255,255,0.03)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:1rem 0}
.logo{font-size:1.1rem;margin:0;font-weight:700}
.nav a{color:var(--muted);text-decoration:none;margin-left:1rem;font-weight:600}
.nav a:hover{color:var(--accent)}

/* Hero */
.hero{display:grid;grid-template-columns:1fr 320px;gap:2rem;align-items:start;padding:2rem 0}
.hero-left{display:flex;gap:1.25rem;align-items:flex-start}
.avatar{width:96px;height:96px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.25rem;background:linear-gradient(135deg,#0f1724,#122135);border:1px solid rgba(255,255,255,0.03)}
.subtitle{color:var(--accent);font-weight:700;margin:0}
.lead{color:var(--muted);margin-top:0.5rem}
.contact-quick{margin-top:0.75rem;color:var(--muted)}
.contact-quick a{color:#dbeafe;text-decoration:none}
.links{margin-top:0.75rem}
.links a{display:inline-block;margin-right:0.75rem;padding:0.35rem 0.6rem;border-radius:8px;background:var(--glass);text-decoration:none;color:#dbeafe;font-weight:600}

.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,0.03)}
.card h3{margin-top:0}

/* Sections */
.section{padding:1.5rem 0}
.chips{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.5rem}
.chips span{background:rgba(255,255,255,0.03);padding:0.4rem 0.6rem;border-radius:999px;font-weight:600;color:var(--muted);}

.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin-top:1rem}
.project{background:var(--card);padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,0.02)}
.project h4{margin:0 0 0.4rem 0}
.project .meta{color:var(--muted);font-size:0.9rem}
.btn{display:inline-block;margin-top:0.75rem;padding:0.45rem 0.75rem;border-radius:8px;background:transparent;border:1px solid rgba(255,255,255,0.06);text-decoration:none;color:inherit;font-weight:700}
.btn.small{font-size:0.9rem;padding:0.3rem 0.5rem}

.edu-grid{display:flex;flex-wrap:wrap;gap:1rem}
.edu{background:var(--glass);padding:0.75rem;border-radius:10px;border:1px solid rgba(255,255,255,0.02);min-width:220px}
.certs{margin:0 0 0 1rem}

.contact-cards{display:flex;gap:1rem;margin-top:1rem}
.card.small{flex:1}
.muted{color:var(--muted);font-size:0.95rem}
.link{color:var(--accent);text-decoration:none}

/* Footer */
.site-footer{border-top:1px solid rgba(255,255,255,0.03);padding:1rem 0;margin-top:2rem}
.site-footer p{margin:0;color:var(--muted)}

/* Responsive */
@media (max-width:900px){
.hero{grid-template-columns:1fr;}
.nav{display:none}
.header-inner{justify-content:space-between}
}

@media (max-width:480px){
.avatar{width:72px;height:72px;font-size:1rem}
.container{padding:1rem}
}