diff --git a/kjvstudy_org/static/style.css b/kjvstudy_org/static/style.css index 7754a4a..7b980d9 100644 --- a/kjvstudy_org/static/style.css +++ b/kjvstudy_org/static/style.css @@ -412,12 +412,42 @@ p, li, div { /* Verses */ .verses-container { - max-width: 800px; + max-width: 900px; margin: 0 auto; - padding: 1rem 0; + padding: 2rem 1rem; background: var(--background-color); } +.chapter-text { + font-family: var(--font-serif); + font-size: 1.125rem; + line-height: 1.8; + color: var(--text-primary); + text-align: justify; + text-justify: inter-word; + margin: 2rem 0; + padding: 2rem; + background: var(--surface-color); + border-radius: var(--radius-lg); + border: 1px solid var(--border-color); + box-shadow: var(--shadow-sm); +} + +.chapter-text .verse { + display: inline; + position: relative; + margin: 0; + padding: 0.1rem 0.2rem; + background: transparent; + border: none; + border-radius: 3px; + transition: background-color 0.15s ease; +} + +.chapter-text .verse:hover { + background: rgba(139, 92, 246, 0.08); +} + .verse { margin-bottom: 0.5rem; line-height: 1.8; @@ -866,10 +896,18 @@ p, li, div { /* Better spacing for mobile content */ .verses-container { - padding: 0.5rem; + padding: 1rem 0.5rem; margin: 0 auto; } + .chapter-text { + font-size: 1rem; + line-height: 1.7; + padding: 1rem; + text-align: left; + margin: 1rem 0; + } + /* Improve touch targets for all interactive elements */ a, button, input, select, textarea { touch-action: manipulation;