---
name: md-to-html-book-mobile
description: Convert a large Markdown book to a responsive dark-themed HTML file with localStorage scroll memory. Optimized for mobile reading on Telegram.
category: devops
---

# MD → Responsive HTML Book Converter

Use this when the user wants an HTML version of a markdown book for mobile reading on Telegram.

## Requirements

- Python 3.12+ with `markdown` library installed (system Python at `/Library/Frameworks/Python.framework/Versions/3.12/bin/python3`)
- Extensions: `tables`, `fenced_code`, `codehilite`, `toc`, `nl2br`

## Command

```bash
/Library/Frameworks/Python.framework/Versions/3.12/bin/python3 -c "
import markdown,os
with open('BOOK.md','r') as f:md=f.read()
h=markdown.markdown(md,extensions=['tables','fenced_code','codehilite','toc','nl2br'],extension_configs={'codehilite':{'css_class':'highlight'},'toc':{'permalink':True}})
# CSS and JS inline in full command
with open('BOOK.html','w') as f:f.write(...)
"
```

## Key CSS Features

- **Dark theme**: amber/orange accents on dark background
- **Fluid typography**: `clamp()` for all headings (1.6em-2.2em for h1, 1.3em-1.6em for h2)
- **Responsive tables**: `min-width: 400px` with `overflow-x: auto`
- **Code blocks**: `-webkit-overflow-scrolling: touch` for iOS
- **`word-break: break-word`** on paragraphs and headings
- **`hyphens: auto`** on paragraphs for better mobile text flow
- **Two breakpoints**: 600px (tablets/phones) and 380px (tiny phones)
- **Print styles**: white background, page-break-inside avoid on pre/blockquote/table

## Key JS Feature — Scroll Memory

```javascript
(function(){
    var K='fenix1_scroll',t;
    function s(){clearTimeout(t);t=setTimeout(function(){
        try{localStorage.setItem(K,window.scrollY||window.pageYOffset)}catch(e){}},300)}
    function r(){try{var y=localStorage.getItem(K);
        if(y&&!isNaN(y)){var p=parseInt(y,10);if(p>0){
            setTimeout(function(){window.scrollTo(0,p)},200);
            setTimeout(function(){window.scrollTo(0,p)},600);
            setTimeout(function(){window.scrollTo(0,p)},1200)
        }}}catch(e){}}
    window.addEventListener('scroll',s,{passive:true});
    window.addEventListener('beforeunload',function(){s()});
    document.addEventListener('visibilitychange',function(){if(document.hidden)s()});
    if(document.readyState==='complete')r();else window.addEventListener('load',r)
})();
```

Key: saves on scroll (debounced 300ms), saves on tab switch (`visibilitychange`), restores with 3 retries at 200/600/1200ms for slow page render.

## Pitfalls

- System Python must be used (sandbox Python may not have `markdown`)
- File must exist on local filesystem (not in sandbox)
- Large books (3500+ lines, 400KB+) take ~1-2 seconds to convert
- After conversion, verify with `ls -lh` to confirm size
- Always send both `.md` and `.html` files to the user via `MEDIA:` paths
- File path issues on macOS with spaces — use quotes around paths
- iCloud sync can move files unexpectedly — always check with `find` before assuming file exists

## Delivery

After generating HTML, send the file to the user via Telegram:
```markdown
MEDIA:/Users/valen/Desktop/BOOK.html
```
