initial
This commit is contained in:
133
meineordi-project-summary.md
Normal file
133
meineordi-project-summary.md
Normal file
@@ -0,0 +1,133 @@
|
||||
# Project Summary: meineordi.at Website Redesign
|
||||
|
||||
## Overview
|
||||
Complete static HTML redesign of the medical practice website for **Dr. med. Carina Kautsch**, Ärztin für Allgemeinmedizin, replacing a Joomla 3 CMS with a single self-contained `index.html` file served via nginx in Docker.
|
||||
|
||||
**Live site (old):** https://meineordi.at/
|
||||
**Logo URL:** https://meineordi.at/images/meineordi/logo.png
|
||||
|
||||
---
|
||||
|
||||
## Practice Information
|
||||
|
||||
| Field | Value |
|
||||
|---|---|
|
||||
| Doctor | Dr. med. Carina Kautsch |
|
||||
| Specialty | Ärztin für Allgemeinmedizin |
|
||||
| Address | Pfenninggeldgasse 1B/3, A-1160 Wien |
|
||||
| Phone | +43 / 1 / 493 17 73 |
|
||||
| Email | info@meineordi.at |
|
||||
|
||||
### Opening Hours
|
||||
| Day | Hours |
|
||||
|---|---|
|
||||
| Montag | 14:00 – 19:00 |
|
||||
| Dienstag | 14:00 – 18:00 |
|
||||
| Mittwoch | 07:30 – 11:30 |
|
||||
| Donnerstag | 13:00 – 17:00 |
|
||||
| Freitag | 09:00 – 12:00 |
|
||||
| Sa / So | geschlossen |
|
||||
|
||||
---
|
||||
|
||||
## Current Deliverable
|
||||
|
||||
### File: `index.html`
|
||||
A single fully self-contained HTML file. No framework, no build step, no CMS.
|
||||
|
||||
**Sections (top to bottom):**
|
||||
1. Sticky header with logo + nav links + phone button
|
||||
2. Hero — logo image large on right, headline + CTA buttons left, 4 quick-info cards below
|
||||
3. Öffnungszeiten — 2-column grid of hour boxes with shadows
|
||||
4. Schließzeiten — dynamically rendered from JS array (see below)
|
||||
5. Leistungen — 6-item service grid with emoji icons
|
||||
6. Aktuelles — 3 notice items (prescriptions, diabetes supplies, sick notes)
|
||||
7. Kontakt & Standort — contact rows + embedded OpenStreetMap iframe
|
||||
8. Footer with logo
|
||||
|
||||
### Design Decisions
|
||||
- **Fonts:** Cormorant Garamond (headings/serif) + DM Sans (body), loaded from Google Fonts
|
||||
- **Primary color:** `#C8102E` (red from meineOrdi logo) — fixed, not auto-extracted
|
||||
- **Background:** Pure white `#ffffff`, alt-sections `#f7f7f7`
|
||||
- **Base font size:** 18px (deliberately larger for older patients)
|
||||
- **Opening hours boxes:** white cards with strong drop shadow (`box-shadow: 0 6px 28px rgba(0,0,0,.14)`) and subtle red border, hover lift effect
|
||||
- **Logo:** displayed in navbar (42px height), large in hero section (280px, float animation), subtle watermark behind hero, inverted white in footer
|
||||
- **Map:** OpenStreetMap embed — no Google API key required
|
||||
- **Mobile:** Fully responsive, hamburger menu below 768px, logo shifts above text on mobile
|
||||
- **Animations:** CSS `fadeUp` on hero elements, `floatLogo` on hero logo
|
||||
|
||||
### Closure/Holiday Management (no CMS needed)
|
||||
At the very top of `<body>` is a clearly commented JavaScript array:
|
||||
|
||||
```js
|
||||
const SCHLIESSZEITEN = [
|
||||
{
|
||||
dates: "30.3. – 3.4.",
|
||||
reason: "Karwoche",
|
||||
deputy: "Dr. Irene Lachawitz",
|
||||
deputyAddr: "1160 Wien, Neulerchenfelderstraße 14/6",
|
||||
deputyPhone: "01 / 406 31 04",
|
||||
deputyHours: "Mo & Mi 8–12 Uhr · Di & Do 14–18 Uhr · Fr 12–16 Uhr"
|
||||
},
|
||||
// ... more entries
|
||||
];
|
||||
```
|
||||
|
||||
The `renderClosures()` function at the bottom of the script reads this array and builds the closure cards dynamically. Empty array → "Keine Schließzeiten" message shown automatically. This is the ONLY place that needs editing to manage holidays.
|
||||
|
||||
---
|
||||
|
||||
## Docker Setup
|
||||
|
||||
### Files
|
||||
```
|
||||
meineordi-docker.tar.gz
|
||||
├── Dockerfile
|
||||
├── index.html
|
||||
└── docker-compose.yml
|
||||
```
|
||||
|
||||
### Dockerfile
|
||||
```dockerfile
|
||||
FROM nginx:alpine
|
||||
COPY index.html /usr/share/nginx/html/index.html
|
||||
```
|
||||
|
||||
### docker-compose.yml
|
||||
```yaml
|
||||
services:
|
||||
meineordi-web:
|
||||
image: meineordi-web:latest
|
||||
container_name: meineordi-web
|
||||
restart: unless-stopped
|
||||
ports:
|
||||
- "8080:80"
|
||||
healthcheck:
|
||||
test: ["CMD", "wget", "-qO-", "http://localhost/"]
|
||||
interval: 30s
|
||||
timeout: 5s
|
||||
retries: 3
|
||||
```
|
||||
|
||||
### Build & Deploy
|
||||
```bash
|
||||
# Build image (must be done on the Docker host)
|
||||
docker build -t meineordi-web:latest .
|
||||
|
||||
# Deploy via Portainer → Stacks → Add stack → paste docker-compose.yml
|
||||
# OR run directly:
|
||||
docker compose up -d
|
||||
```
|
||||
|
||||
**Note:** The image must be built locally on the Docker host (or pushed to a registry) before Portainer can use it. The compose file references `meineordi-web:latest` as a pre-built local image, not a registry image.
|
||||
|
||||
---
|
||||
|
||||
## Possible Next Steps / Open Items
|
||||
|
||||
- **Reverse proxy integration** — The compose file currently exposes port 8080 directly. If the server uses Nginx Proxy Manager, Traefik, or Caddy, the `ports:` mapping should be replaced with a shared Docker network and proxy labels/config.
|
||||
- **Registry/CI** — For easier updates, the image could be pushed to a private registry (e.g. Gitea with built-in registry, or Docker Hub) so Portainer can pull updates without SSH access.
|
||||
- **HTTPS / domain** — Point `meineordi.at` DNS to the new server and configure SSL termination at the reverse proxy level.
|
||||
- **Logo CORS** — The logo is loaded cross-origin from `meineordi.at`. Once the site is self-hosted, copy `logo.png` into the Docker image alongside `index.html` and reference it as `/logo.png` to avoid any cross-origin issues and eliminate the external dependency.
|
||||
- **Content updates** — All content (hours, notices, services) is hardcoded in `index.html`. If more frequent edits are needed, consider a simple JSON config file mounted as a Docker volume, or a minimal admin UI built on top.
|
||||
- **Imprint / Datenschutz** — Austrian law (ECG / DSGVO) requires an Impressum and Datenschutzerklärung. These pages don't exist yet.
|
||||
Reference in New Issue
Block a user