bible-app / templates /chapter.html
broadfield-dev's picture
Create chapter.html
bc986bc verified
<!-- templates/chapter.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{{ book_name }} {{ chapter_num }} - Bible App</title>
<style>
body { font-family: sans-serif; margin: 2em; background-color: #f4f4f9; color: #333; }
.container { max-width: 800px; margin: auto; background: #fff; padding: 2em; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
h1, h2 { color: #4a4a4a; }
p { line-height: 1.6; }
.verse-num { font-weight: bold; color: #5c67f2; vertical-align: super; font-size: 0.8em; margin-left: 4px; }
.nav-links { margin-bottom: 2em; font-size: 1.1em; }
a { color: #5c67f2; text-decoration: none; }
a:hover { text-decoration: underline; }
</style>
</head>
<body>
<div class="container">
<div class="nav-links">
<a href="/">← Back to Search</a> |
<a href="{{ url_for('view_book', version=version, book_name=book_name) }}">View Full Book of {{ book_name }}</a>
</div>
<h1>{{ book_name }} Chapter {{ chapter_num }}</h1>
<hr>
<p>
{% for verse in verses %}
<span class="verse-num">{{ verse.verse }}</span> {{ verse.text }}
{% endfor %}
</p>
</div>
</body>
</html>