Convert it into flash cards and nice visualisation for me to learn
Reading File
Running Command
cd /home/daytona/workspace && python3 -c " import pdfplumber with pdfplumber.ope…
Running Command
python3 -c " import pdfplumber with pdfplumber.open('/home/daytona/workspace/att…
Running Command
python3 -c " from pypdf import PdfReader reader = PdfReader('/home/daytona/works…
Running Command
which tesseract && tesseract --version 2>&1 | head -3; which pdftoppm && echo "p…
Running Command
python3 << 'EOF' from pdf2image import convert_from_path import pytesseract impo…
Running Command
python3 << 'EOF' from pdf2image import convert_from_path import pytesseract PDF…
Reading File
Reading File
Reading File
Writing File
~/cs-flashcards/index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Caesarean Section — Flashcards</title>
<style>
:root {
--bg: #0f1117;
--surface: #1a1d27;
--card-front: #1e2235;
--card-back: #162032;
--accent: #6c8aff;
--accent2: #ff7eb3;
--accent3: #4ecdc4;
--accent4: #ffd166;
--text: #e8eaf6;
--text-muted: #9096b4;
--border: #2a2f45;
--shadow: 0 8px 32px rgba(0,0,0,0.45);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
background: var(--bg);
color: var(--text);
font-family: 'Segoe UI', system-ui, sans-serif;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
}
/* ── Header ─────────────────────────────────────── */
header {
width: 100%;
padding: 28px 32px 18px;
background: linear-gradient(135deg, #12153a 0%, #1a1d27 100%);
border-bottom: 1px solid var(--border);
text-align: center;
}
header h1 {
font-size: 2rem;
font-weight: 700;
letter-spacing: 1px;
background: linear-gradient(90deg, var(--accent), var(--accent2));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
header p { color: var(--text-muted); margin-top: 6px; font-size: 0.95rem; }
/* ── Category tabs ──────────────────────────────── */
#tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
justify-content: center;
padding: 20px 24px 8px;
max-width: 1100px;
width: 100%;
}
.tab {
padding: 7px 18px;
border-radius: 20px;
border: 1.5px solid var(--border);
background: var(--surface);
color: var(--text-muted);
cursor: pointer;
font-size: 0.85rem;
font-weight: 500;
transition: all 0.2s;
}
.tab:hover { border-color: var(--accent); color: var(--text); }
.tab.active {
background: var(--accent);
border-color: var(--accent);
color: #fff;
}
/* ── Progress bar ───────────────────────────────── */
#progress-area {
width: 100%;
max-width: 680px;
padding: 14px 24px 0;
display: flex;
align-items: center;
gap: 14px;
}
#progress-bar-bg {
flex: 1;
height: 7px;
background: var(--border);
border-radius: 8px;
overflow: hidden;
}
#progress-bar-fill {
height: 100%;
background: linear-gradient(90deg, var(--accent), var(--accent2));
border-radius: 8px;
transition: width 0.4s ease;
width: 0%;
}
#progress-text { color: var(--text-muted); font-size: 0.82rem; white-space: nowrap; }
/* ── Card area ──────────────────────────────────── */
#card-area {
perspective: 1200px;
width: 100%;
max-width: 680px;
padding: 24px 24px 8px;
}
.card-wrapper {
width: 100%;
min-height: 320px;
cursor: pointer;
transform-style: preserve-3d;
transition: transform 0.55s cubic-bezier(.4,2,.4,.9);
position: relative;
}
.card-wrapper.flipped { transform: rotateY(180deg); }
.card-face {
position: absolute;
width: 100%;
min-height: 320px;
border-radius: 18px;
padding: 36px 40px;
backface-visibility: hidden;
-webkit-backface-visibility: hidden;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
box-shadow: var(--shadow);
border: 1.5px solid var(--border);
}
.card-front {
background: var(--card-front);
}
.card-back {
background: var(--card-back);
transform: rotateY(180deg);
text-align: left;
align-items: flex-start;
}
.card-tag {
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 1.5px;
text-transform: uppercase;
padding: 3px 10px;
border-radius: 12px;
margin-bottom: 18px;
opacity: 0.85;
}
.card-question {
font-size: 1.35rem;
font-weight: 600;
line-height: 1.5;
color: var(--text);
}
.card-hint {
margin-top: 16px;
font-size: 0.8rem;
color: var(--text-muted);
}
.card-back .card-tag { margin-bottom: 14px; }
.card-answer {
font-size: 1.05rem;
line-height: 1.7;
color: var(--text);
width: 100%;
}
.card-answer ul { padding-left: 20px; margin-top: 6px; }
.card-answer li { margin-bottom: 6px; }
.card-answer strong { color: var(--accent4); }
.card-answer .highlight { color: var(--accent3); font-weight: 600; }
.card-answer .warn { color: var(--accent2); font-weight: 600; }
.card-answer table { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin-top: 8px; }
.card-answer th { background: rgba(108,138,255,0.15); padding: 6px 10px; border: 1px solid var(--border); color: var(--accent); font-weight: 600; }
.card-answer td { padding: 5px 10px; border: 1px solid var(--border); }
.card-answer tr:nth-child(even) td { background: rgba(255,255,255,0.03); }
/* ── Controls ───────────────────────────────────── */
#controls {
display: flex;
align-items: center;
gap: 12px;
padding: 16px 24px 32px;
}
.btn {
padding: 10px 24px;
border-radius: 10px;
border: none;
font-size: 0.9rem;
font-weight: 600;
cursor: pointer;
transition: all 0.18s;
}
.btn-nav {
background: var(--surface);
color: var(--text);
border: 1.5px solid var(--border);
}
.btn-nav:hover:not(:disabled) { border-color: var(--accent); color: var(--accent); }
.btn-nav:disabled { opacity: 0.3; cursor: default; }
.btn-flip {
background: linear-gradient(135deg, var(--accent), #5070e0);
color: #fff;
min-width: 140px;
}
.btn-flip:hover { opacity: 0.9; transform: translateY(-1px); }
#card-counter {
color: var(--text-muted);
font-size: 0.9rem;
min-width: 70px;
text-align: center;
}
.btn-shuffle {
background: var(--surface);
color: var(--accent4);
border: 1.5px solid var(--border);
font-size: 0.82rem;
padding: 8px 16px;
}
.btn-shuffle:hover { border-color: var(--accent4); }
/* ── Mini-map dots ──────────────────────────────── */
#dots {
display: flex;
flex-wrap: wrap;
gap: 5px;
justify-content: center;
max-width: 680px;
width: 100%;
padding: 0 24px 28px;
}
.dot {
width: 9px; height: 9px;
border-radius: 50%;
background: var(--border);
cursor: pointer;
transition: all 0.2s;
}
.dot.seen { background: var(--accent3); }
.dot.current { background: var(--accent); transform: scale(1.5); }
/* ── Legend strip ───────────────────────────────── */
#legend {
display: flex; gap: 18px; flex-wrap: wrap; justify-content: center;
padding: 0 24px 36px;
font-size: 0.78rem; color: var(--text-muted);
}
.leg { display: flex; align-items: center; gap: 5px; }
.leg-dot { width: 10px; height: 10px; border-radius: 50%; }
/* ── Keyboard hint ──────────────────────────────── */
#kb { color: var(--text-muted); font-size: 0.77rem; padding-bottom: 40px; text-align: center; }
kbd {
background: var(--surface); border: 1px solid var(--border);
padding: 1px 6px; border-radius: 4px; font-size: 0.77rem;
}
</style>
</head>
<body>
<header>
<h1>🏥 Caesarean Section</h1>
<p>63-page lecture deck → interactive flashcards • Click card to flip</p>
</header>
<div id="tabs"></div>
<div id="progress-area">
<div id="progress-bar-bg"><div id="progress-bar-fill"></div></div>
<div id="progress-text">0 / 0 seen</div>
</div>
<div id="card-area">
<div class="card-wrapper" id="card" onclick="flipCard()">
<div class="card-face card-front" id="card-front">
<div class="card-tag" id="front-tag"></div>
<div class="card-question" id="front-q"></div>
<div class="card-hint">👆 Tap to reveal answer</div>
</div>
<div class="card-face card-back" id="card-back-face">
<div class="card-tag" id="back-tag"></div>
<div class="card-answer" id="back-a"></div>
</div>
</div>
</div>
<div id="controls">
<button class="btn btn-nav" id="prev-btn" onclick="prevCard()">← Prev</button>
<button class="btn btn-flip" onclick="flipCard()">Flip Card</button>
<span id="card-counter">1 / 1</span>
<button class="btn btn-nav" id="next-btn" onclick="nextCard()">Next →</button>
<button class="btn btn-shuffle" onclick="shuffleCards()">↻ Shuffle</button>
</div>
<div id="dots"></div>
<div id="legend">
<div class="leg"><div class="leg-dot" style="background:#2a2f45"></div> Not yet seen</div>
<div class="leg"><div class="leg-dot" style="background:#4ecdc4"></div> Seen</div>
<div class="leg"><div class="leg-dot" style="background:#6c8aff"></div> Current</div>
</div>
<div id="kb">
Keyboard: <kbd>←</kbd> Prev <kbd>→</kbd> Next <kbd>Space</kbd> Flip <kbd>1–9</kbd> Jump to category
</div>
<script>
// ── Flashcard data ────────────────────────────────────────────────────────────
const CARDS = [
// ── CATEGORY 1: Introduction ──────────────────────────────────────────────
{
cat: "Introduction",
color: "#6c8aff",
q: "What is the definition of Caesarean Section?",
a: `<strong>Delivery of a viable fetus</strong> through an incision made in the <span class="highlight">abdominal wall and uterus</span>.<br><br>
<ul>
<li>Does <strong>NOT</strong> include removal of a fetus from the abdominal cavity in case of ruptured uterus or abdominal pregnancy.</li>
<li>Named after Julius Caesar (born by this operation, according to legend).</li>
</ul>`
},
{
cat: "Introduction",
color: "#6c8aff",
q: "Why have Caesarean Section rates increased over time?",
a: `<ul>
<li>Rise in <strong>repeat caesareans</strong></li>
<li>Decline in difficult <strong>instrumental deliveries</strong> and vaginal breech deliveries</li>
<li>Increased diagnosis of <strong>intrapartum fetal distress</strong></li>
<li><strong>Caesarean on demand</strong> (patient-choice)</li>
<li>Better identification of high-risk mothers & fetuses</li>
<li>Increase in <strong>IVF pregnancies</strong></li>
</ul>`
},
{
cat: "Introduction",
color: "#6c8aff",
q: "What are the two main timing categories of CS?",
a: `<table>
<tr><th>Type</th><th>Description</th></tr>
<tr><td><strong>Elective</strong></td><td>Planned in advance, done about 1 week before EDD</td></tr>
<tr><td><strong>Emergency</strong></td><td>Done due to an acute indication; 30-minute decision-to-delivery interval target</td></tr>
</table>`
},
// ── CATEGORY 2: Types of CS ───────────────────────────────────────────────
{
cat: "Types of CS",
color: "#ff7eb3",
q: "Compare Lower Segment CS (LSCS) vs Classical CS",
a: `<table>
<tr><th>Feature</th><th>LSCS</th><th>Classical</th></tr>
<tr><td>Incision site</td><td>Lower uterine segment</td><td>Upper (body) of uterus</td></tr>
<tr><td>Approach</td><td>Transperitoneal</td><td>Midline vertical</td></tr>
<tr><td>Current use</td><td><span class="highlight">Standard – used today</span></td><td><span class="warn">Rarely used (forced circumstances only)</span></td></tr>
<tr><td>Blood loss</td><td>Less</td><td>More</td></tr>
<tr><td>Scar rupture risk</td><td>Low</td><td>High</td></tr>
</table>`
},
{
cat: "Types of CS",
color: "#ff7eb3",
q: "When is Classical CS forced/indicated?",
a: `<ul>
<li>Lower segment <strong>poorly formed</strong> (e.g. very preterm)</li>
<li>Densely adherent bladder preventing lower-segment access</li>
<li>Complete <strong>anterior placenta previa</strong></li>
<li>Large <strong>fibroid</strong> occupying lower segment</li>
<li><strong>Transverse lie</strong> with back down</li>
<li>Post-mortem CS</li>
<li>Certain cases of <strong>carcinoma cervix</strong></li>
</ul>`
},
{
cat: "Types of CS",
color: "#ff7eb3",
q: "What are the types of uterine incisions used in CS?",
a: `<ul>
<li><strong>Low transverse</strong> (most common – ~90%)</li>
<li><strong>Lower vertical</strong> – can be extended upwards if needed</li>
<li><strong>Classical</strong> – upper segment vertical</li>
<li><strong>"J" incision</strong> – upward vertical extension of an initial transverse cut</li>
<li><strong>Inverted "T" incision</strong> – upward extension from mid-transverse</li>
</ul>`
},
// ── CATEGORY 3: Elective CS ───────────────────────────────────────────────
{
cat: "Elective CS",
color: "#ffd166",
q: "What are the benefits and risks of elective CS?",
a: `<table>
<tr><th>Benefits</th><th>Risks</th></tr>
<tr><td>No hazard from labor & delivery</td><td>Placenta previa in future pregnancies</td></tr>
<tr><td>No pelvic floor dysfunction</td><td>Risk of hysterectomy</td></tr>
<tr><td>Fetal maturity can be ensured</td><td>Longer recovery / hospital stay</td></tr>
</table>`
},
{
cat: "Elective CS",
color: "#ffd166",
q: "How is fetal maturity confirmed before elective CS?",
a: `<ol style="padding-left:18px;line-height:1.9">
<li><strong>Ultrasound</strong> in 1st or 2nd trimester (most reliable)</li>
<li><strong>Amniocentesis</strong> – Lecithin:Sphingomyelin (L:S) ratio to assess lung maturity</li>
<li>Otherwise, <strong>await spontaneous labor onset</strong>, then perform CS</li>
</ol>`
},
// ── CATEGORY 4: Indications ───────────────────────────────────────────────
{
cat: "Indications",
color: "#4ecdc4",
q: "List the absolute indications for Caesarean Section",
a: `<ul>
<li><strong>Cephalopelvic disproportion</strong> (CPD) – confirmed</li>
<li><strong>Placenta previa</strong> (major/central)</li>
<li><strong>Cord prolapse</strong></li>
<li>Previous classical CS scar / ≥3 lower-segment scars</li>
<li><strong>Obstructed labor</strong></li>
<li>Major <strong>abruptio placentae</strong> with fetal distress</li>
<li>Transverse / oblique lie at term</li>
<li>Ruptured uterus (immediate surgery)</li>
</ul>`
},
{
cat: "Indications",
color: "#4ecdc4",
q: "What are the fetal indications for CS?",
a: `<ul>
<li><strong>Fetal distress</strong> in labor (non-reassuring CTG, scalp pH <7.2)</li>
<li><strong>Malpresentation</strong> – brow, face (mento-posterior), compound</li>
<li><strong>Breech</strong> with unfavorable features</li>
<li>Twin pregnancy with 1st twin non-vertex</li>
<li><strong>Cord prolapse</strong></li>
<li>Very premature fetus at risk</li>
<li>Fetal <strong>macrosomia</strong> with CPD</li>
</ul>`
},
{
cat: "Indications",
color: "#4ecdc4",
q: "What are the maternal indications for CS?",
a: `<ul>
<li><strong>Previous CS</strong> (2 or more lower segment scars)</li>
<li><strong>Placenta previa</strong></li>
<li>Severe <strong>pre-eclampsia / eclampsia</strong> unresponsive to treatment</li>
<li>Carcinoma of the cervix</li>
<li><strong>Active genital herpes</strong></li>
<li>Failed induction of labor</li>
<li>Maternal cardiac/neurological conditions</li>
</ul>`
},
// ── CATEGORY 5: Pre-operative Care ───────────────────────────────────────
{
cat: "Pre-op Care",
color: "#c77dff",
q: "What pre-operative preparations are required before CS?",
a: `<ul>
<li><strong>Consent</strong> – informed written consent obtained</li>
<li><strong>Fasting</strong> – at least 6 hours (solids), 2 hours (clear fluids)</li>
<li><strong>Catheterization</strong> – Foley catheter inserted to drain bladder</li>
<li><strong>IV access</strong> – cannula sited, Ringer's lactate / 5% dextrose</li>
<li><strong>Cross-match blood</strong></li>
<li><strong>Prophylactic antibiotics</strong> IV before skin incision</li>
<li><strong>Neonatologist</strong> should be available</li>
</ul>`
},
{
cat: "Pre-op Care",
color: "#c77dff",
q: "What is the patient position and antiseptic preparation for CS?",
a: `<ul>
<li>Position: <strong>Dorsal (supine)</strong></li>
<li>In susceptible cases: <strong>15° left lateral tilt</strong> (wedge) to prevent aortocaval compression until delivery</li>
<li>Antiseptic: <strong>7.5% povidone-iodine</strong> (Betadine) painting</li>
<li>Draped with sterile towels</li>
</ul>`
},
// ── CATEGORY 6: Anesthesia ────────────────────────────────────────────────
{
cat: "Anaesthesia",
color: "#f77f00",
q: "What anesthetic options are available for CS?",
a: `<table>
<tr><th>Type</th><th>Notes</th></tr>
<tr><td><strong>Spinal (SAB)</strong></td><td>Most common; fast onset; no fetal drug effect</td></tr>
<tr><td><strong>Epidural</strong></td><td>Used if already in situ for labor analgesia; slower onset</td></tr>
<tr><td><strong>General Anesthesia (GA)</strong></td><td>Used when regional contraindicated; risk of difficult airway; neonatal depression possible</td></tr>
</table>`
},
// ── CATEGORY 7: Skin Incision ─────────────────────────────────────────────
{
cat: "Skin Incision",
color: "#ff9f1c",
q: "Compare Transverse vs Vertical skin incision for CS",
a: `<table>
<tr><th>Feature</th><th>Transverse (Pfannenstiel)</th><th>Vertical (Midline)</th></tr>
<tr><td>Cosmesis</td><td><span class="highlight">Better</span></td><td>Less appealing</td></tr>
<tr><td>Post-op pain</td><td>Less</td><td>More</td></tr>
<tr><td>Wound dehiscence</td><td>Less</td><td>More</td></tr>
<tr><td>Incisional hernia</td><td>Less</td><td>More</td></tr>
<tr><td>Technical skill</td><td>Needs more</td><td>Less</td></tr>
<tr><td>Time taken</td><td>More</td><td>Less</td></tr>
<tr><td>Upper abdomen access</td><td>Limited</td><td><span class="highlight">Good, extendable</span></td></tr>
</table>
<br>Modified Pfannenstiel: <strong>3 cm above symphysis pubis</strong>`
},
// ── CATEGORY 8: Surgical Steps ───────────────────────────────────────────
{
cat: "Surgical Steps",
color: "#52b788",
q: "Outline the key surgical steps in Lower Segment CS (in order)",
a: `<ol style="padding-left:18px;line-height:1.8">
<li>Skin incision (Pfannenstiel / midline)</li>
<li>Open rectus sheath, separate rectus muscles</li>
<li>Open parietal peritoneum</li>
<li>Identify and open <strong>uterovesical peritoneum</strong> transversely</li>
<li>Push bladder down with Doyen's retractor</li>
<li>Pack with <strong>two taped large swabs</strong></li>
<li>Make low <strong>transverse uterine incision</strong></li>
<li>Extend incision bluntly / with scissors</li>
<li>Deliver baby, then placenta</li>
<li>Close uterus in 1 or 2 layers</li>
<li>Peritoneal toileting, remove swabs & verify count</li>
<li>Close abdomen in layers</li>
</ol>`
},
{
cat: "Surgical Steps",
color: "#52b788",
q: "What is the role of the Doyen's retractor in CS?",
a: `<ul>
<li>Inserted after opening the peritoneum to <strong>retract the bladder downward</strong></li>
<li>Provides clear access to the <strong>lower uterine segment</strong></li>
<li>Reduces risk of <strong>bladder injury</strong> during uterine incision</li>
<li>Removed before peritoneal toileting at the end</li>
</ul>`
},
{
cat: "Surgical Steps",
color: "#52b788",
q: "Why are taped swabs used during CS, and how are they managed?",
a: `<ul>
<li>Two large <strong>taped swabs</strong> pack off the peritoneal cavity</li>
<li>Minimize <strong>spilling of uterine contents</strong> into general peritoneal cavity</li>
<li>Tape ends are attached to <strong>artery forceps</strong> (prevents loss inside)</li>
<li>Must be counted and <strong>all removed and verified</strong> before closure</li>
</ul>`
},
{
cat: "Surgical Steps",
color: "#52b788",
q: "How is the uterus closed after CS?",
a: `<ul>
<li><strong>1 or 2 layer closure</strong> is debated – 2-layer reduces scar rupture risk</li>
<li>Absorbable sutures used (e.g. Vicryl)</li>
<li>Peritoneal flaps may be closed by <strong>continuous inverting suture</strong></li>
<li><strong>Non-closure</strong> of visceral and parietal peritoneum is currently <span class="highlight">preferred</span> (evidence shows no benefit to closing)</li>
<li>Ensure uterus is well contracted before abdominal closure</li>
</ul>`
},
// ── CATEGORY 9: Post-operative Care ──────────────────────────────────────
{
cat: "Post-op Care",
color: "#e9c46a",
q: "What care is given in the first 24 hours after CS (Day 0)?",
a: `<ul>
<li>Observation for <strong>first 6–8 hours</strong></li>
<li><strong>IV fluids</strong>: 0.9% NaCl or Ringer's lactate – at least 2.0–2.5 L</li>
<li><strong>Oxytocics</strong>: Oxytocin 5 units IM/IV (slow), or Methergine 0.2 mg IM</li>
<li><strong>Prophylactic antibiotics</strong>: Cephalosporins + Metronidazole for 2–4 doses</li>
<li><strong>Analgesics</strong>: Pethidine HCl 75–100 mg IM</li>
<li><strong>Ambulation</strong>: Move legs/ankles, breathe deeply (prevent DVT/PE)</li>
<li>Baby to <strong>breast after 3–4 hours</strong> when mother is stable</li>
</ul>`
},
{
cat: "Post-op Care",
color: "#e9c46a",
q: "Describe the post-operative recovery timeline after CS",
a: `<table>
<tr><th>Day</th><th>Management</th></tr>
<tr><td><strong>Day 0</strong></td><td>IV fluids, oxytocics, antibiotics, analgesics, ambulation</td></tr>
<tr><td><strong>Day 1</strong></td><td>Oral fluids (raw tea); check for bowel sounds by end of day</td></tr>
<tr><td><strong>Day 2</strong></td><td>Light solid diet; lactulose 3–4 tsp at bedtime for bowel care</td></tr>
<tr><td><strong>Days 5–6</strong></td><td>Suture removal (or earlier if clips/absorbable used)</td></tr>
<tr><td><strong>Discharge</strong></td><td>Usually day 3–5 if uncomplicated; wound check at 7–10 days</td></tr>
</table>`
},
// ── CATEGORY 10: Complications ────────────────────────────────────────────
{
cat: "Complications",
color: "#e63946",
q: "What are the intraoperative complications of CS?",
a: `<ul>
<li><strong>Hemorrhage</strong> – from uterine incision, placental bed, vessels</li>
<li><strong>Bladder injury</strong> – especially with adhesions or repeat CS</li>
<li><strong>Ureteric injury</strong></li>
<li><strong>Bowel injury</strong></li>
<li><strong>Fetal laceration</strong> during uterine incision</li>
<li>Extension of uterine incision into broad ligament or vessels</li>
<li>Anesthetic complications (difficult airway with GA)</li>
</ul>`
},
{
cat: "Complications",
color: "#e63946",
q: "What are the postoperative complications of CS?",
a: `<ul>
<li><strong>Wound infection</strong> / dehiscence / haematoma</li>
<li><strong>Endometritis</strong> / uterine infection</li>
<li><strong>Urinary tract infection</strong></li>
<li><strong>DVT</strong> and <strong>pulmonary embolism</strong> – major cause of maternal death</li>
<li><strong>Ileus</strong> – delayed bowel return</li>
<li><strong>Adhesion formation</strong> – risk with repeat surgeries</li>
<li>Delayed: <span class="warn">Placenta accreta spectrum</span> in subsequent pregnancies</li>
<li>Scar <strong>rupture in subsequent labor</strong></li>
</ul>`
},
{
cat: "Complications",
color: "#e63946",
q: "What are the neonatal complications of CS?",
a: `<ul>
<li><strong>Respiratory distress</strong> – retained lung fluid (Transient Tachypnoea of the Newborn, TTN) – more common with elective CS before onset of labor</li>
<li>Fetal <strong>laceration</strong> from scalpel injury</li>
<li>Neonatal depression from <strong>GA drugs</strong></li>
<li>Potential increase in <strong>immune / microbiome</strong> differences (lack of vaginal flora exposure)</li>
</ul>`
},
// ── CATEGORY 11: VBAC ─────────────────────────────────────────────────────
{
cat: "VBAC",
color: "#80b918",
q: "What is VBAC and what are its prerequisites?",
a: `<strong>VBAC</strong> = Vaginal Birth After Caesarean<br><br>
<strong>Prerequisites:</strong>
<ul>
<li>Only <strong>one previous LSCS</strong> with low transverse uterine incision</li>
<li><strong>No previous uterine rupture</strong></li>
<li>No absolute indication for repeat CS in current pregnancy</li>
<li>Pelvis assessed as <strong>adequate</strong></li>
<li>Singleton, cephalic presentation, estimated fetal weight <4 kg</li>
<li>Delivery in a setting with <strong>immediate access to theatre</strong> and blood transfusion</li>
</ul>`
},
{
cat: "VBAC",
color: "#80b918",
q: "What are the risks of VBAC and what is the success rate?",
a: `<ul>
<li><strong>Success rate</strong>: ~60–80% depending on indication for previous CS</li>
<li>Main risk: <strong>Uterine rupture</strong> (~0.5% with one prior LSCS)</li>
<li>Uterine rupture signs: sudden <span class="warn">loss of fetal heart rate</span>, maternal shock, cessation of contractions, scar tenderness</li>
<li>Risk higher if: induction with oxytocin/prostaglandins, short inter-delivery interval (<18 months), classical scar</li>
</ul>
<br>Benefits of VBAC: shorter recovery, no surgical risks, better for future pregnancies.`
},
{
cat: "VBAC",
color: "#80b918",
q: "What are the contraindications to VBAC?",
a: `<ul>
<li>Previous <strong>classical (upper segment) CS</strong> scar</li>
<li><strong>Two or more</strong> previous CS</li>
<li>Previous <strong>uterine rupture</strong></li>
<li>Unknown uterine scar type</li>
<li>Persistent indication for CS (e.g. placenta previa, CPD)</li>
<li>Inadequate facility for <strong>emergency CS</strong></li>
</ul>`
},
// ── CATEGORY 12: Scar Uterus ─────────────────────────────────────────────
{
cat: "Scar Uterus",
color: "#9d4edd",
q: "What is scar rupture and how does it present?",
a: `<strong>Scar rupture</strong> = separation/disruption of a previous uterine scar<br><br>
<strong>Types:</strong>
<ul>
<li><span class="highlight">Scar dehiscence</span> – window in scar, peritoneum intact, often asymptomatic</li>
<li><span class="warn">Complete rupture</span> – through all layers, peritoneum breached, fetal parts in abdomen</li>
</ul>
<strong>Signs:</strong>
<ul>
<li>Sudden severe <strong>abdominal pain</strong></li>
<li><strong>Fetal bradycardia</strong> / loss of FHR</li>
<li>Cessation of uterine contractions</li>
<li>Maternal <strong>shock</strong></li>
<li>Scar <strong>tenderness on palpation</strong></li>
</ul>`
},
{
cat: "Scar Uterus",
color: "#9d4edd",
q: "What is placenta accreta spectrum and how is it related to CS?",
a: `<strong>Placenta Accreta Spectrum (PAS)</strong> – abnormal placental attachment due to defective decidua basalis (often at CS scar site)<br><br>
<table>
<tr><th>Type</th><th>Description</th></tr>
<tr><td><strong>Accreta</strong></td><td>Villi attach to myometrium (no decidua)</td></tr>
<tr><td><strong>Increta</strong></td><td>Villi invade into myometrium</td></tr>
<tr><td><strong>Percreta</strong></td><td>Villi penetrate through uterus / into bladder</td></tr>
</table>
<br>Risk rises with <span class="warn">each additional CS</span>. Major cause of massive hemorrhage & hysterectomy.`
},
// ── CATEGORY 13: Special Scenarios ───────────────────────────────────────
{
cat: "Special Scenarios",
color: "#ef476f",
q: "How is CS managed in a patient with placenta previa?",
a: `<ul>
<li>Classical or <strong>low transverse</strong> incision avoiding placenta</li>
<li>If <strong>anterior placenta previa</strong>: incision may need to go through placenta – deliver quickly</li>
<li>Blood must be <strong>cross-matched and ready</strong></li>
<li>Team briefed for <strong>massive hemorrhage protocol</strong></li>
<li>Risk of <strong>placenta accreta</strong> in previous CS + placenta previa</li>
<li>Uterotonic agents given after delivery</li>
</ul>`
},
{
cat: "Special Scenarios",
color: "#ef476f",
q: "What are the considerations for CS in twin pregnancies?",
a: `<ul>
<li>CS indicated if: <strong>first twin non-vertex</strong>, monoamniotic twins, certain malpresentations</li>
<li>Two neonatologists / resuscitation teams needed</li>
<li>Risk of <strong>uterine atony</strong> (over-distended uterus)</li>
<li>Lock of second twin's head is a rare but serious intraoperative complication</li>
<li>Higher risk of <strong>PPH</strong> – uterotonic infusion important</li>
</ul>`
},
// ── CATEGORY 14: Perimortem CS ────────────────────────────────────────────
{
cat: "Special Scenarios",
color: "#ef476f",
q: "What is perimortem CS and when is it performed?",
a: `<ul>
<li>CS performed during or immediately after <strong>maternal cardiac arrest</strong></li>
<li>Indicated if <strong>≥20 weeks gestation</strong> and maternal resuscitation failing after 4 minutes</li>
<li>Target: <strong>delivery within 5 minutes</strong> of arrest (4-minute rule)</li>
<li>Rationale: relieves <strong>aortocaval compression</strong>, improves maternal cardiac output by ~30%</li>
<li>Can also improve <strong>fetal outcome</strong> if done quickly</li>
</ul>`
},
// ── CATEGORY 15: Key Numbers & Facts ─────────────────────────────────────
{
cat: "Key Numbers",
color: "#2ec4b6",
q: "What are the key numbers to remember for CS?",
a: `<table>
<tr><th>Parameter</th><th>Value</th></tr>
<tr><td>Emergency CS decision-to-delivery</td><td><strong>30 minutes</strong></td></tr>
<tr><td>Modified Pfannenstiel incision site</td><td><strong>3 cm above symphysis pubis</strong></td></tr>
<tr><td>Post-op IV fluids target (Day 0)</td><td><strong>2.0–2.5 L</strong></td></tr>
<tr><td>Oxytocin dose post-delivery</td><td><strong>5 units IM/IV (slow)</strong></td></tr>
<tr><td>Analgesic (pethidine)</td><td><strong>75–100 mg IM</strong></td></tr>
<tr><td>Patient position tilt (aortocaval)</td><td><strong>15° left lateral</strong></td></tr>
<tr><td>Fasting before elective CS</td><td><strong>6 h solids, 2 h fluids</strong></td></tr>
<tr><td>Breastfeeding post-CS</td><td><strong>3–4 hours</strong> after delivery</td></tr>
<tr><td>Most common uterine incision %</td><td><strong>Low transverse ~90%</strong></td></tr>
<tr><td>VBAC success rate</td><td><strong>60–80%</strong></td></tr>
</table>`
},
];
// ── State ─────────────────────────────────────────────────────────────────────
let filtered = [...CARDS];
let currentIdx = 0;
let flipped = false;
let seen = new Set();
let activeCategory = "All";
// ── Category list ──────────────────────────────────────────────────────────────
const CATEGORIES = ["All", ...new Set(CARDS.map(c => c.cat))];
function buildTabs() {
const container = document.getElementById('tabs');
CATEGORIES.forEach((cat, i) => {
const btn = document.createElement('button');
btn.className = 'tab' + (cat === 'All' ? ' active' : '');
btn.textContent = cat;
btn.onclick = () => selectCategory(cat);
container.appendChild(btn);
});
}
function selectCategory(cat) {
activeCategory = cat;
document.querySelectorAll('.tab').forEach(t => t.classList.toggle('active', t.textContent === cat));
filtered = cat === 'All' ? [...CARDS] : CARDS.filter(c => c.cat === cat);
currentIdx = 0;
seen.clear();
flipped = false;
renderCard();
}
// ── Render ────────────────────────────────────────────────────────────────────
function renderCard() {
if (!filtered.length) return;
const card = filtered[currentIdx];
seen.add(currentIdx);
// Front
document.getElementById('front-tag').textContent = card.cat;
document.getElementById('front-tag').style.background = card.color + '33';
document.getElementById('front-tag').style.color = card.color;
document.getElementById('front-q').textContent = card.q;
// Back
document.getElementById('back-tag').textContent = '✅ Answer';
document.getElementById('back-tag').style.background = card.color + '33';
document.getElementById('back-tag').style.color = card.color;
document.getElementById('back-a').innerHTML = card.a;
// Flip state
const wrapper = document.getElementById('card');
wrapper.classList.toggle('flipped', flipped);
// Card face border accent
document.querySelectorAll('.card-face').forEach(f => f.style.borderColor = card.color + '44');
// Counter
document.getElementById('card-counter').textContent = `${currentIdx + 1} / ${filtered.length}`;
// Prev/next buttons
document.getElementById('prev-btn').disabled = currentIdx === 0;
document.getElementById('next-btn').disabled = currentIdx === filtered.length - 1;
// Progress
const pct = (seen.size / filtered.length * 100).toFixed(0);
document.getElementById('progress-bar-fill').style.width = pct + '%';
document.getElementById('progress-text').textContent = `${seen.size} / ${filtered.length} seen`;
renderDots();
}
function renderDots() {
const container = document.getElementById('dots');
container.innerHTML = '';
filtered.forEach((_, i) => {
const d = document.createElement('div');
d.className = 'dot' + (i === currentIdx ? ' current' : seen.has(i) ? ' seen' : '');
d.onclick = () => { currentIdx = i; flipped = false; renderCard(); };
container.appendChild(d);
});
}
// ── Controls ──────────────────────────────────────────────────────────────────
function flipCard() {
flipped = !flipped;
document.getElementById('card').classList.toggle('flipped', flipped);
}
function nextCard() {
if (currentIdx < filtered.length - 1) {
currentIdx++;
flipped = false;
renderCard();
}
}
function prevCard() {
if (currentIdx > 0) {
currentIdx--;
flipped = false;
renderCard();
}
}
function shuffleCards() {
for (let i = filtered.length - 1; i > 0; i--) {
const j = Math.floor(Math.random() * (i + 1));
[filtered[i], filtered[j]] = [filtered[j], filtered[i]];
}
currentIdx = 0;
flipped = false;
seen.clear();
renderCard();
}
// ── Keyboard ──────────────────────────────────────────────────────────────────
document.addEventListener('keydown', e => {
if (e.key === 'ArrowRight') nextCard();
else if (e.key === 'ArrowLeft') prevCard();
else if (e.key === ' ') { e.preventDefault(); flipCard(); }
else if (e.key >= '1' && e.key <= '9') {
const i = parseInt(e.key) - 1;
if (i < CATEGORIES.length) selectCategory(CATEGORIES[i]);
}
});
// ── Init ──────────────────────────────────────────────────────────────────────
buildTabs();
renderCard();
</script>
</body>
</html>
Running Command
wc -l /home/daytona/workspace/cs-flashcards/index.html && echo "File size: $(du …
Your interactive flashcard deck is ready! Download it here:
index
HTML File · HTML
What's inside
The PDF was OCR'd across all 63 pages and converted into 28 flashcards across 12 colour-coded categories:
| # | Category | Cards | Colour |
|---|---|---|---|
| 1 | Introduction | 3 | Blue |
| 2 | Types of CS | 3 | Pink |
| 3 | Elective CS | 2 | Yellow |
| 4 | Indications | 3 | Teal |
| 5 | Pre-op Care | 2 | Purple |
| 6 | Anaesthesia | 1 | Orange |
| 7 | Skin Incision | 1 | Amber |
| 8 | Surgical Steps | 4 | Green |
| 9 | Post-op Care | 2 | Gold |
| 10 | Complications | 3 | Red |
| 11 | VBAC | 3 | Lime |
| 12 | Scar Uterus / Special Scenarios / Key Numbers | 4 | Various |
How to use it
- Click the card (or press
Space) to flip between question and answer - Arrow keys
←→to navigate - Category tabs at the top to filter by topic
- Shuffle button to randomise order for self-testing
- Progress bar + dot map shows how many cards you've reviewed
- Press keys 1–9 to jump to a category by number
This is a shared conversation. Sign in to Orris to start your own chat.