Live Preview
Tag didn’t load? Click here and let us know!Share this result
Previews are deleted daily. Get a permanent share link sent to your inbox:
Script
```html
<!DOCTYPE html>
<html lang="hi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Keshav Dadsena - Two Column Resume</title>
<!-- Tailwind CSS -->
<script src="https://cdn.tailwindcss.com"></script>
<!-- Google Fonts -->
<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=Inter:wght@300;400;500;600;700&family=Montserrat:wght@600;700;800&display=swap" rel="stylesheet">
<!-- FontAwesome Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script>
tailwind.config = {
theme: {
extend: {
fontFamily: {
sans: ['Inter', 'sans-serif'],
heading: ['Montserrat', 'sans-serif'],
}
}
}
}
</script>
<style>
/* Print Styles for PDF Export */
@media print {
body {
background-color: #ffffff !important;
padding: 0 !important;
margin: 0 !important;
-webkit-print-color-adjust: exact !important;
print-color-adjust: exact !important;
}
.no-print {
display: none !important;
}
.resume-card {
box-shadow: none !important;
max-width: 100% !important;
width: 100% !important;
margin: 0 !important;
border-radius: 0 !important;
}
@page {
size: A4 portrait;
margin: 0mm;
}
}
/* Color Themes */
.theme-navy {
--sidebar-bg: #0f172a;
--sidebar-accent: #38bdf8;
--heading-color: #0f172a;
--badge-bg: #e0f2fe;
--badge-text: #0369a1;
}
.theme-teal {
--sidebar-bg: #064e3b;
--sidebar-accent: #2dd4bf;
--heading-color: #064e3b;
--badge-bg: #ccfbf1;
--badge-text: #0f766e;
}
.theme-blue {
--sidebar-bg: #1e3a8a;
--sidebar-accent: #60a5fa;
--heading-color: #1e3a8a;
--badge-bg: #dbeafe;
--badge-text: #1d4ed8;
}
.sidebar-bg { background-color: var(--sidebar-bg); }
.sidebar-accent { color: var(--sidebar-accent); }
.heading-color { color: var(--heading-color); }
.badge-style { background-color: var(--badge-bg); color: var(--badge-text); }
.editable-element:focus {
outline: 2px dashed #0284c7;
background-color: rgba(2, 132, 199, 0.05);
border-radius: 4px;
}
</style>
</head>
<body class="bg-slate-200 text-slate-800 font-sans min-h-screen theme-navy">
<!-- TOP CONTROL BAR (Print, Edit, Photo Upload) -->
<div class="no-print sticky top-0 z-50 bg-slate-900 text-white shadow-md px-4 py-3">
<div class="max-w-4xl mx-auto flex flex-wrap items-center justify-between gap-3 text-xs sm:text-sm">
<div class="flex items-center space-x-2">
<i class="fa-solid fa-columns text-sky-400 text-lg"></i>
<span class="font-bold tracking-wide">Two-Column Resume Builder</span>
</div>
<div class="flex flex-wrap items-center gap-2">
<!-- Photo Upload Button -->
<label for="photo-upload" class="cursor-pointer bg-slate-800 hover:bg-slate-700 px-3 py-1.5 rounded border border-slate-700 transition flex items-center gap-1.5">
<i class="fa-solid fa-camera text-sky-400"></i>
<span>Photo Lagayein</span>
</label>
<input type="file" id="photo-upload" accept="image/*" class="hidden" onchange="uploadPhoto(event)">
<!-- Theme Selector -->
<select onchange="applyTheme(this.value)" class="bg-slate-800 border border-slate-700 text-white px-2 py-1.5 rounded cursor-pointer outline-none">
<option value="theme-navy">Dark Navy</option>
<option value="theme-teal">Teal Green</option>
<option value="theme-blue">Medical Blue</option>
</select>
<!-- Edit Button -->
<button onclick="toggleEdit()" id="edit-btn" class="bg-slate-800 hover:bg-slate-700 px-3 py-1.5 rounded border border-slate-700 transition flex items-center gap-1.5">
<i class="fa-solid fa-pen-to-square text-amber-400"></i>
<span id="edit-text">Edit Karein</span>
</button>
<!-- Print PDF Button -->
<button onclick="window.print()" class="bg-sky-600 hover:bg-sky-500 font-semibold text-white px-4 py-1.5 rounded shadow transition flex items-center gap-1.5">
<i class="fa-solid fa-print"></i>
<span>Print / Save PDF</span>
</button>
</div>
</div>
</div>
<!-- MAIN RESUME CONTAINER (Strict 2-Column Flex Layout) -->
<div class="max-w-[850px] mx-auto my-0 sm:my-6 bg-white shadow-2xl resume-card overflow-hidden">
<!-- STRICT SIDE-BY-SIDE FLEX CONTAINER -->
<div class="flex flex-row w-full min-h-[1050px]">
<!-- LEFT COLUMN (34% Width) -->
<aside class="w-[34%] sidebar-bg text-slate-100 p-5 sm:p-6 flex flex-col justify-between shrink-0">
<div>
<!-- Photo Container -->
<div class="flex justify-center mb-6">
<div class="relative group cursor-pointer" onclick="document.getElementById('photo-upload').click()">
<div class="w-28 h-28 sm:w-32 sm:h-32 rounded-full border-4 border-slate-700/60 overflow-hidden bg-slate-800 shadow-lg flex items-center justify-center">
<img id="user-photo" src="data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%2394a3b8' viewBox='0 0 24 24'><path d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/></svg>" alt="Keshav Dadsena" class="w-full h-full object-cover">
</div>
<div class="no-print absolute inset-0 bg-black/60 rounded-full opacity-0 group-hover:opacity-100 flex items-center justify-center text-[10px] text-white text-center p-1 transition">
Upload Photo
</div>
</div>
</div>
<!-- CONTACT -->
<div class="mb-6">
<h2 class="font-heading text-[11px] font-bold uppercase tracking-wider text-slate-400 border-b border-slate-700 pb-1 mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-phone sidebar-accent"></i> Contact
</h2>
<ul class="space-y-2.5 text-[11px] text-slate-300">
<li class="flex items-start gap-2">
<i class="fa-solid fa-mobile-screen sidebar-accent mt-0.5 text-[10px]"></i>
<span class="editable-element" contenteditable="false">+91-9424169676</span>
</li>
<li class="flex items-start gap-2">
<i class="fa-solid fa-envelope sidebar-accent mt-0.5 text-[10px]"></i>
<span class="editable-element break-all" contenteditable="false">keshavjaiswal0143@gmail.com</span>
</li>
<li class="flex items-start gap-2">
<i class="fa-solid fa-location-dot sidebar-accent mt-0.5 text-[10px]"></i>
<span class="editable-element leading-tight" contenteditable="false">0/2, School Para, Ghanaghat, Lormi, Dist - Mungeli (C.G) 495115</span>
</li>
</ul>
</div>
<!-- KEY SKILLS -->
<div class="mb-6">
<h2 class="font-heading text-[11px] font-bold uppercase tracking-wider text-slate-400 border-b border-slate-700 pb-1 mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-user-nurse sidebar-accent"></i> Key Skills
</h2>
<ul class="space-y-2 text-[11px] text-slate-300">
<li class="flex items-start gap-1.5">
<span class="sidebar-accent font-bold">•</span>
<span class="editable-element" contenteditable="false">Patient Care & Clinical Procedures</span>
</li>
<li class="flex items-start gap-1.5">
<span class="sidebar-accent font-bold">•</span>
<span class="editable-element" contenteditable="false">OPD, IPD & OT Support</span>
</li>
<li class="flex items-start gap-1.5">
<span class="sidebar-accent font-bold">•</span>
<span class="editable-element" contenteditable="false">Problem Solving & Analytical Thinking</span>
</li>
<li class="flex items-start gap-1.5">
<span class="sidebar-accent font-bold">•</span>
<span class="editable-element" contenteditable="false">Interpersonal & Communication Skills</span>
</li>
<li class="flex items-start gap-1.5">
<span class="sidebar-accent font-bold">•</span>
<span class="editable-element" contenteditable="false">Teamwork & Leadership</span>
</li>
</ul>
</div>
<!-- TECHNICAL SKILLS -->
<div class="mb-6">
<h2 class="font-heading text-[11px] font-bold uppercase tracking-wider text-slate-400 border-b border-slate-700 pb-1 mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-laptop sidebar-accent"></i> Technical Skills
</h2>
<p class="text-[10px] text-slate-400 mb-1.5">MS Office Suite:</p>
<div class="flex flex-wrap gap-1">
<span class="bg-slate-800 text-slate-200 border border-slate-700 text-[10px] px-2 py-0.5 rounded">MS Word</span>
<span class="bg-slate-800 text-slate-200 border border-slate-700 text-[10px] px-2 py-0.5 rounded">MS Excel</span>
<span class="bg-slate-800 text-slate-200 border border-slate-700 text-[10px] px-2 py-0.5 rounded">MS PowerPoint</span>
</div>
</div>
<!-- LANGUAGES -->
<div class="mb-6">
<h2 class="font-heading text-[11px] font-bold uppercase tracking-wider text-slate-400 border-b border-slate-700 pb-1 mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-language sidebar-accent"></i> Languages
</h2>
<div class="flex gap-1.5 text-[11px]">
<span class="bg-slate-800 border border-slate-700 px-2.5 py-0.5 rounded-full text-slate-200">English</span>
<span class="bg-slate-800 border border-slate-700 px-2.5 py-0.5 rounded-full text-slate-200">Hindi</span>
</div>
</div>
<!-- PERSONAL DETAILS -->
<div>
<h2 class="font-heading text-[11px] font-bold uppercase tracking-wider text-slate-400 border-b border-slate-700 pb-1 mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-id-card sidebar-accent"></i> Personal Info
</h2>
<ul class="space-y-2 text-[11px] text-slate-300">
<li>
<span class="text-slate-500 block text-[9px] uppercase">Father's Name</span>
<span class="editable-element" contenteditable="false">Mr. Ganpat Lal Dadsena</span>
</li>
<li>
<span class="text-slate-500 block text-[9px] uppercase">Date of Birth</span>
<span class="editable-element" contenteditable="false">13 October 1998</span>
</li>
<li>
<span class="text-slate-500 block text-[9px] uppercase">Hobbies</span>
<span class="editable-element" contenteditable="false">Singing, Bike Riding, Traveling</span>
</li>
</ul>
</div>
</div>
<div class="text-[9px] text-slate-500 text-center border-t border-slate-800 pt-3 mt-4">
Keshav Dadsena • Resume
</div>
</aside>
<!-- RIGHT COLUMN (66% Width) -->
<main class="w-[66%] p-6 sm:p-8 flex flex-col justify-between bg-white text-slate-800">
<div>
<!-- NAME & TITLE HEADER -->
<header class="border-b-2 border-slate-100 pb-4 mb-5">
<h1 class="font-heading text-2xl sm:text-3xl font-extrabold heading-color uppercase tracking-tight editable-element" contenteditable="false">
KESHAV DADSENA
</h1>
<p class="font-semibold text-xs sm:text-sm text-sky-700 tracking-wide mt-1 uppercase flex items-center gap-1.5 editable-element" contenteditable="false">
<i class="fa-solid fa-user-doctor text-sky-600"></i> Professional Nursing Staff / Attendant Nurse
</p>
</header>
<!-- PROFESSIONAL SUMMARY -->
<section class="mb-5">
<h2 class="font-heading text-xs font-bold uppercase tracking-wider heading-color mb-2 flex items-center gap-1.5">
<i class="fa-solid fa-file-lines text-sky-600"></i> Professional Summary
</h2>
<p class="text-xs text-slate-600 leading-relaxed bg-slate-50 p-3 rounded border-l-2 border-sky-600 editable-element" contenteditable="false">
Dedicated and patient-oriented Nursing Professional holding a B.Sc. in Nursing, with hands-on experience in IPD, OPD, and Operation Theater management. Proven ability to provide compassionate care, assist in critical medical procedures, and adapt effectively to fast-paced clinical environments.
</p>
</section>
<!-- PROFESSIONAL EXPERIENCE -->
<section class="mb-5">
<h2 class="font-heading text-xs font-bold uppercase tracking-wider heading-color mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-briefcase text-sky-600"></i> Professional Experience
</h2>
<div class="space-y-4">
<!-- Job 1 -->
<div class="border-l-2 border-sky-600 pl-3">
<div class="flex justify-between items-baseline">
<h3 class="font-heading text-xs font-bold text-slate-900 editable-element" contenteditable="false">Attendant Nurse</h3>
<span class="text-[10px] font-semibold badge-style px-2 py-0.5 rounded editable-element" contenteditable="false">July 03, 2025 – Present</span>
</div>
<p class="text-[11px] font-medium text-sky-700 mb-1 editable-element" contenteditable="false">Jeena Sikho Lifecare Limited, Raipur, Chhattisgarh</p>
<ul class="list-disc list-inside text-[11px] text-slate-600 space-y-0.5">
<li class="editable-element" contenteditable="false">Managing daily patient care routines and assisting healthcare teams with treatment plans.</li>
<li class="editable-element" contenteditable="false">Ensuring proper monitoring and documentation of patient progress.</li>
</ul>
</div>
<!-- Job 2 -->
<div class="border-l-2 border-slate-300 pl-3">
<div class="flex justify-between items-baseline">
<h3 class="font-heading text-xs font-bold text-slate-900 editable-element" contenteditable="false">Nursing Staff</h3>
<span class="text-[10px] text-slate-500 bg-slate-100 px-2 py-0.5 rounded editable-element" contenteditable="false">1 Year 4 Months</span>
</div>
<p class="text-[11px] font-medium text-slate-600 mb-1 editable-element" contenteditable="false">Dr. M.R. Bhagwat Memorial Hospital, Choubey Colony, Raipur</p>
<ul class="list-disc list-inside text-[11px] text-slate-600 space-y-0.5">
<li class="editable-element" contenteditable="false">Provided comprehensive nursing care across OPD, IPD, and OT departments.</li>
<li class="editable-element" contenteditable="false">Assisted surgeons and senior doctors during clinical procedures and patient evaluations.</li>
</ul>
</div>
<!-- Job 3 -->
<div class="border-l-2 border-slate-300 pl-3">
<div class="flex justify-between items-baseline">
<h3 class="font-heading text-xs font-bold text-slate-900 editable-element" contenteditable="false">Health Worker</h3>
<span class="text-[10px] text-slate-500 bg-slate-100 px-2 py-0.5 rounded editable-element" contenteditable="false">2019</span>
</div>
<p class="text-[11px] font-medium text-slate-600 mb-1 editable-element" contenteditable="false">Pulse Polio Program</p>
<ul class="list-disc list-inside text-[11px] text-slate-600 space-y-0.5">
<li class="editable-element" contenteditable="false">Participated in community immunization drives and public healthcare awareness efforts.</li>
</ul>
</div>
</div>
</section>
<!-- CLINICAL POSTINGS & PRACTICAL TRAINING -->
<section class="mb-5">
<h2 class="font-heading text-xs font-bold uppercase tracking-wider heading-color mb-2.5 flex items-center gap-1.5">
<i class="fa-solid fa-hospital text-sky-600"></i> Clinical Postings & Practical Training
</h2>
<div class="grid grid-cols-2 gap-2 text-[11px]">
<div class="p-2 border border-slate-200 rounded bg-slate-50 flex justify-between items-center">
<span class="font-medium text-slate-800 editable-element" contenteditable="false">Suyash Hospital, Kota, Raipur</span>
<span class="text-[10px] font-bold text-sky-700 bg-sky-100 px-1.5 py-0.5 rounded editable-element" contenteditable="false">9 Months</span>
</div>
<div class="p-2 border border-slate-200 rounded bg-slate-50 flex justify-between items-center">
<span class="font-medium text-slate-800 editable-element" contenteditable="false">P.H.C. Dharsiva, Raipur</span>
<span class="text-[10px] font-bold text-sky-700 bg-sky-100 px-1.5 py-0.5 rounded editable-element" contenteditable="false">1 Month</span>
</div>
<div class="p-2 border border-slate-200 rounded bg-slate-50 flex justify-between items-center">
<span class="font-medium text-slate-800 editable-element" contenteditable="false">Petals Children Hospital, Raipur</span>
<span class="text-[10px] font-bold text-sky-700 bg-sky-100 px-1.5 py-0.5 rounded editable-element" contenteditable="false">1 Month</span>
</div>
<div class="p-2 border border-slate-200 rounded bg-slate-50 flex justify-between items-center">
<span class="font-medium text-slate-800 editable-element" contenteditable="false">Dhanwantari Mental Hospital, Raipur</span>
<span class="text-[10px] font-bold text-sky-700 bg-sky-100 px-1.5 py-0.5 rounded editable-element" contenteditable="false">1 Month</span>
</div>
</div>
</section>
<!-- ACADEMIC QUALIFICATION -->
<section class="mb-4">
<h2 class="font-heading text-xs font-bold uppercase tracking-wider heading-color mb-3 flex items-center gap-1.5">
<i class="fa-solid fa-graduation-cap text-sky-600"></i> Academic Qualification
</h2>
<div class="space-y-2.5 text-[11px]">
<div class="border-b border-slate-100 pb-2">
<h3 class="font-heading font-bold text-slate-900 text-xs editable-element" contenteditable="false">Bachelor of Science in Nursing (B.Sc. Nursing)</h3>
<p class="text-slate-600 editable-element" contenteditable="false">Suyash College of Nursing, Pt. DDU Memorial Health Sciences & Ayush University of C.G., Raipur</p>
</div>
<div class="border-b border-slate-100 pb-2 flex justify-between items-center">
<div>
<h3 class="font-semibold text-slate-800 editable-element" contenteditable="false">Higher Secondary School Certificate (Class XII)</h3>
Landing Page
This ad does not have a landing page available
Network Timeline
Performance Summary
8
Requests
5
Domains
396KB
Transfer Size
766KB
Content Size
1,190.0ms
Dom Content Loaded
112.0ms
First Paint
1,488.0ms
Load Time
Domain Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...
Timings (ms)
Loading...
Total Time
Loading...
Content Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...