-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
172 lines (146 loc) · 9.31 KB
/
Copy pathindex.html
File metadata and controls
172 lines (146 loc) · 9.31 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Charan Teja Epuri's portfolio showcasing skills, projects, certifications, and experience as a Python Full Stack Developer." />
<meta name="keywords" content="Charan Teja Epuri, Portfolio, Python Full Stack Developer, Django, React.js, JavaScript, Web Development" />
<meta name="author" content="Charan Teja Epuri" />
<meta name="theme-color" content="#0a0e27" />
<meta property="og:title" content="Charan Teja Epuri Portfolio" />
<meta property="og:description" content="Modern, responsive portfolio website with projects, skills, certifications, and contact details." />
<meta property="og:type" content="website" />
<meta property="og:image" content="title-pic.jpg" />
<title>Charan Teja Epuri Portfolio</title>
<link rel="icon" type="image/jpeg" href="title-pic.jpg" />
<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=Poppins:wght@300;400;500;600;700;800&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="index.css" />
</head>
<body>
<header class="site-header">
<nav class="navbar" aria-label="Primary">
<a class="brand" href="#about" aria-label="Go to top">
<img src="title-pic.jpg" alt="Charan Teja Epuri" class="brand-photo" loading="lazy" />
<span class="brand-name">Charan Teja Epuri</span>
</a>
<div class="nav-tools">
<ul class="nav-links" id="nav-links">
<li><a href="#about">About</a></li>
<li><a href="#resume">Resume</a></li>
<li><a href="#internships">Internships</a></li>
<li><a href="#professional-profile">Profile</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#certifications">Certifications</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<button id="theme-toggle" class="icon-btn theme-toggle" aria-label="Toggle theme" type="button">
<i class="fa-solid fa-sun" aria-hidden="true"></i>
</button>
<button id="nav-toggle" class="icon-btn nav-toggle" aria-label="Toggle navigation" type="button">☰</button>
</div>
</nav>
</header>
<main>
<section id="about" class="section about">
<div class="about-inner">
<div class="photo-wrap">
<img src="PROFILE PIC.jpg" alt="Charan Teja Epuri" class="profile-photo" loading="lazy" />
</div>
<div class="about-text">
<p class="eyebrow">Portfolio Website</p>
<h1 class="name">Charan Teja Epuri</h1>
<p id="typewriter" class="typewriter" aria-live="polite"></p>
<p class="profile-summary">
Motivated Artificial Intelligence and Data Science graduate aiming to launch a career as a Python Full Stack Developer. I am committed to leveraging my expertise in Django for robust backend architecture and React.js for creating dynamic, responsive frontends. My objective is to bridge the gap between intelligent data processing and high-performance web development within a professional IT environment.
</p>
</div>
</div>
</section>
<section id="resume" class="section resume">
<h2>Resume</h2>
<p class="section-lead">Open or download my latest resume.</p>
<div class="resume-actions">
<a class="btn" href="https://drive.google.com/file/d/1m4MOZmFWJcsDuI28Dz1vpPeOmIzx5pZV/view?usp=sharing" target="_blank" rel="noopener" id="open-resume">Open Resume</a>
<a class="btn outline" href="https://drive.google.com/file/d/1m4MOZmFWJcsDuI28Dz1vpPeOmIzx5pZV/view?usp=sharing" download="Charan-Teja-Epuri-Resume.pdf" target="_blank" rel="noopener">Download Resume</a>
</div>
<h3>Education</h3>
<ul class="education-list">
<li><strong>Artificial Intelligence and Data Science</strong> — SRKR Engineering College (A), 2025</li>
<li><strong>Intermediate (M.P.C)</strong> — Sri Chaitanya Junior College, 2021</li>
<li><strong>SSC</strong> — T.V.N.R.M National High School, 2019</li>
</ul>
</section>
<section id="internships" class="section internships">
<h2>Internships</h2>
<div id="internships-container"></div>
</section>
<section id="professional-profile" class="section professional-profile">
<h2>Professional Profile</h2>
<div class="resume-content" id="profile-container"></div>
</section>
<section id="skills" class="section skills">
<h2>Skills</h2>
<div class="skills-grid" id="skills-container"></div>
</section>
<section id="projects" class="section projects-section">
<h2>Projects</h2>
<div id="projects-container" class="projects"></div>
</section>
<section id="certifications" class="section certifications">
<h2>Certifications</h2>
<div class="cert-list" id="cert-container"></div>
</section>
<section id="contact" class="section contact">
<h2>Contact</h2>
<div class="contact-grid">
<a class="contact-item" href="mailto:charanepuri26@gmail.com">
<i class="fa-solid fa-envelope" aria-hidden="true"></i>
<span>charanepuri26@gmail.com</span>
</a>
<a class="contact-item phone" href="tel:+919573640326">
<i class="fa-solid fa-phone" aria-hidden="true"></i>
<span>Phone</span>
</a>
<a class="contact-item whatsapp" href="https://wa.me/919573640326" target="_blank" rel="noopener noreferrer" aria-label="WhatsApp">
<i class="fa-brands fa-whatsapp" aria-hidden="true"></i>
<span>WhatsApp</span>
</a>
</div>
</section>
</main>
<footer class="site-footer">
<div class="footer-inner">
<div class="footer-left">
<strong>Charan Teja Epuri</strong>
<div class="muted">Python Full Stack Developer</div>
</div>
<div class="footer-right social">
<a href="https://www.linkedin.com/in/charan-teja-972aa9231" target="_blank" rel="noopener noreferrer" aria-label="LinkedIn">
<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
</a>
<a href="https://github.com/charanepuri" target="_blank" rel="noopener noreferrer" aria-label="GitHub">
<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v 3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
</a>
<a href="https://www.instagram.com/_just_call_me_charan_tej?igsh=M3c1ZHhsbjloZXcw" target="_blank" rel="noopener noreferrer" aria-label="Instagram">
<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.057-1.645.069-4.849.069-3.204 0-3.584-.012-4.849-.069-3.259-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zM5.838 12a6.162 6.162 0 1 1 12.324 0 6.162 6.162 0 0 1-12.324 0zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm4.965-10.322a1.44 1.44 0 1 1 2.881.001 1.44 1.44 0 0 1-2.881-.001z"/></svg>
</a>
<a href="https://www.snapchat.com/add/justcalltej2003?share_id=KhLsClk_8wM&locale=en-IN" target="_blank" rel="noopener noreferrer" aria-label="Snapchat" >
<i class="fa-brands fa-snapchat" style="font-size: 22px;"></i>
</a>
</div>
</div>
</footer>
<div id="cert-modal" class="modal" aria-hidden="true">
<div class="modal-content">
<button id="cert-close" class="modal-close" aria-label="Close" type="button">✕</button>
<iframe id="cert-frame" src="" title="Certificate preview" frameborder="0"></iframe>
<a id="cert-download" class="btn" href="#" download>Download</a>
</div>
</div>
<script src="app.js" defer></script>
</body>
</html>