Improve article page readability and appearance on desktop

Adjust article page layout on desktop, reducing image size, title font size, and text size while narrowing content width for better readability and visual balance.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 23852c00-4779-460a-9e0c-d09fee4b6c92
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: a2ee97c2-94c0-42af-9ffb-1551048efa6a
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/23852c00-4779-460a-9e0c-d09fee4b6c92/BvOHMz7
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sebastjanartic
2026-03-07 07:24:54 +00:00
parent 0df13503b8
commit d13867d660
2 changed files with 103 additions and 92 deletions
+8
View File
@@ -151,6 +151,14 @@ When adding new articles:
9. Facebook embeds: copy the iframe code as-is from user
10. After deploy, go to Facebook Sharing Debugger and click "Scrape Again" to refresh cache
## Article Page Layout
- Outer wrapper: `max-w-7xl` (for PageSideAds), inner content: `max-w-4xl mx-auto`
- Cover image: `max-h-[420px]` with object-cover
- Title: `text-2xl md:text-3xl` font-bold
- Meta (author/date/views): `text-xs` with `w-3.5 h-3.5` icons
- Body text: `prose-base` with `prose-p:text-[15px]` and `prose-headings:text-lg`
- In-article ad splits content at midpoint
## Important Notes
- Tailwind `object-[center_25%]` does NOT work — must use inline `style={{ objectPosition: "center 25%" }}`
- Horoscope widget navigates to /horoskop on click (no modal)