🎉 initial commit
This commit is contained in:
101
README.md
Normal file
101
README.md
Normal file
@@ -0,0 +1,101 @@
|
||||
# Sunday Comics - Webcomic Flask App
|
||||
|
||||
A Flask-based webcomic website with server-side rendering using Jinja2 templates.
|
||||
|
||||
## Features
|
||||
|
||||
- Comic viewer with navigation (First, Previous, Next, Latest)
|
||||
- Archive page with thumbnail grid
|
||||
- Responsive design
|
||||
- Server-side rendering with Jinja2
|
||||
- Clean, comic-focused layout
|
||||
|
||||
## Project Structure
|
||||
|
||||
```
|
||||
sunday/
|
||||
├── app.py # Main Flask application
|
||||
├── requirements.txt # Python dependencies
|
||||
├── templates/ # Jinja2 templates
|
||||
│ ├── base.html # Base template with navigation
|
||||
│ ├── index.html # Latest comic page
|
||||
│ ├── comic.html # Individual comic viewer
|
||||
│ ├── archive.html # Archive grid
|
||||
│ ├── about.html # About page
|
||||
│ ├── contact.html # Contact page
|
||||
│ └── 404.html # Error page
|
||||
└── static/ # Static files
|
||||
├── css/
|
||||
│ └── style.css # Main stylesheet
|
||||
├── js/
|
||||
└── images/ # Comic images
|
||||
└── thumbs/ # Thumbnail images for archive
|
||||
```
|
||||
|
||||
## Setup
|
||||
|
||||
1. Install dependencies:
|
||||
```bash
|
||||
pip install -r requirements.txt
|
||||
```
|
||||
|
||||
2. Run the application:
|
||||
```bash
|
||||
python app.py
|
||||
```
|
||||
|
||||
3. Visit http://127.0.0.1:5000 in your browser
|
||||
|
||||
## Adding Comics
|
||||
|
||||
Currently, comics are stored in the `COMICS` list in `app.py`. Each comic needs:
|
||||
|
||||
```python
|
||||
{
|
||||
'number': 1, # Comic number (sequential)
|
||||
'title': 'Comic Title', # Title of the comic
|
||||
'filename': 'comic-001.png', # Image filename
|
||||
'date': '2025-01-01', # Publication date
|
||||
'alt_text': 'Alt text for comic', # Accessibility text
|
||||
'transcript': 'Optional transcript' # Optional transcript
|
||||
}
|
||||
```
|
||||
|
||||
### Adding a New Comic
|
||||
|
||||
1. Save your comic image in `static/images/` (e.g., `comic-001.png`)
|
||||
2. Optionally, create a thumbnail in `static/images/thumbs/` with the same filename
|
||||
3. Add the comic entry to the `COMICS` list in `app.py`
|
||||
|
||||
## Upgrading to a Database
|
||||
|
||||
For production use, consider replacing the `COMICS` list with a database:
|
||||
|
||||
- SQLite for simple setups
|
||||
- PostgreSQL/MySQL for production
|
||||
- Use Flask-SQLAlchemy for ORM support
|
||||
|
||||
## Customization
|
||||
|
||||
### Branding
|
||||
- Update "Sunday Comics" references in `templates/base.html`
|
||||
- Update site title and footer text
|
||||
|
||||
### Styling
|
||||
- Modify `static/css/style.css` to change colors, fonts, and layout
|
||||
- Current color scheme uses blue (#3498db) and dark blue-gray (#2c3e50)
|
||||
|
||||
### About Page
|
||||
- Edit `templates/about.html` to add your bio and comic information
|
||||
|
||||
## Pages
|
||||
|
||||
- `/` - Shows the latest comic
|
||||
- `/comic/<id>` - View a specific comic by number
|
||||
- `/archive` - Browse all comics in a grid
|
||||
- `/about` - About the comic and author
|
||||
- `/contact` - Contact form
|
||||
|
||||
## License
|
||||
|
||||
[Add your license here]
|
||||
Reference in New Issue
Block a user