Files
site-builder/test-anchor-visibility.html
Josh Knapp b511a6684d Add templates, tests, and miscellaneous project files
Includes new page templates (fitness-gym, nonprofit, online-course,
photography-studio, real-estate, startup-company, travel-blog,
wedding-invitation) with thumbnail SVGs, test specs, documentation
files, and minor updates to index.html, router.php, and playwright config.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-01 14:15:58 -08:00

57 lines
1.6 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>Anchor Visibility Test</title>
<style>
body { padding: 40px; font-family: sans-serif; }
section { border: 2px solid #ccc; padding: 20px; margin: 20px 0; }
h2 { margin-top: 0; }
/* Simulate editor canvas styles */
.in-editor .editor-anchor {
position: relative;
min-height: 20px;
border: 1px dashed #9ca3af;
padding: 4px 8px;
background: rgba(59,130,246,0.05);
}
.in-editor .editor-anchor::before {
content: '⚓ ' attr(id);
font-size: 12px;
color: #6b7280;
}
</style>
</head>
<body>
<h1>Anchor Visibility Test</h1>
<section class="in-editor">
<h2>1. In Editor (with .editor-anchor styling)</h2>
<p>Above anchor</p>
<div data-anchor="true" id="anchor-1" class="editor-anchor"></div>
<p>Below anchor</p>
</section>
<section>
<h2>2. In Preview (no .editor-anchor styling)</h2>
<p>Above anchor</p>
<div data-anchor="true" id="anchor-1" class="editor-anchor"></div>
<p>Below anchor</p>
</section>
<section>
<h2>3. After Export (class removed)</h2>
<p>Above anchor</p>
<div data-anchor="true" id="anchor-1"></div>
<p>Below anchor</p>
</section>
<section>
<h2>4. Ideal Export (element removed entirely)</h2>
<p>Above anchor</p>
<!-- anchor removed -->
<p>Below anchor</p>
</section>
</body>
</html>