Fix text and layout being cut off on small screens by simplifying and reflowing the content below the landing hero while preserving the top landing section exactly as before.
Make search, tag browsing and recipe discovery more tap-friendly and readable on mobile devices.
Description
Reworked the content under the landing section in index.php into a mobile-first structure: new discover-shell (search + stats + tag panel), quick-start (compact recipe cards), a simplified latest library view, and an empty-state UI for filtered results.
Added small server-side helpers and precomputed values (e.g. quickStartRecipes, latestRecipes, recipeCount, averageMinutes, activeTag, tagCount) and localized copy keys for the new blocks in index.php so templates remain simple and fast.
Added accessibility helper .sr-only and new CSS rules in assets/style.css for .discover-shell, .discover-stats, .tag-panel, .quick-start, .empty-state and responsive media queries to ensure clean single-column stacking and readable spacing on tablets and phones.
Kept the original landing hero and header/footer includes untouched, and only refactored the sections below the landing to avoid regressions in branding/hero visuals.
Testing
Ran php -l index.php and the file passed PHP syntax checks successfully.
Ran php -l partials/header.php and php -l partials/head.php and both passed PHP syntax checks successfully.
Static validation of CSS additions was performed by visual inspection in code; responsive rules were added and unit-like automated UI screenshots were not available in this environment.
### Motivation
- Fix text and layout being cut off on small screens by simplifying and reflowing the content below the landing hero while preserving the top landing section exactly as before.
- Make search, tag browsing and recipe discovery more tap-friendly and readable on mobile devices.
### Description
- Reworked the content under the landing section in `index.php` into a mobile-first structure: new `discover-shell` (search + stats + tag panel), `quick-start` (compact recipe cards), a simplified `latest` library view, and an `empty-state` UI for filtered results.
- Added small server-side helpers and precomputed values (e.g. `quickStartRecipes`, `latestRecipes`, `recipeCount`, `averageMinutes`, `activeTag`, `tagCount`) and localized copy keys for the new blocks in `index.php` so templates remain simple and fast.
- Added accessibility helper `.sr-only` and new CSS rules in `assets/style.css` for `.discover-shell`, `.discover-stats`, `.tag-panel`, `.quick-start`, `.empty-state` and responsive media queries to ensure clean single-column stacking and readable spacing on tablets and phones.
- Kept the original landing hero and header/footer includes untouched, and only refactored the sections below the landing to avoid regressions in branding/hero visuals.
### Testing
- Ran `php -l index.php` and the file passed PHP syntax checks successfully.
- Ran `php -l partials/header.php` and `php -l partials/head.php` and both passed PHP syntax checks successfully.
- Static validation of CSS additions was performed by visual inspection in code; responsive rules were added and unit-like automated UI screenshots were not available in this environment.
------
[Codex Task](https://chatgpt.com/codex/tasks/task_e_69c068f9aaf08329bc8ff4df2d2d8f45)
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
### 💡 Codex Review
Here are some automated review suggestions for this pull request.
**Reviewed commit:** `5e300c84fa`
<details> <summary>ℹ️ About Codex in GitHub</summary>
<br/>
[Your team has set up Codex to review pull requests in this repo](http://chatgpt.com/codex/settings/general). Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
</details>
Order Quick start recipes by total time before slicing
The new "Quick start" block promises the shortest path from craving to plate, but array_slice($recipes, 0, 3) just reuses whatever order filter_recipes() returned. In the current catalog, data/recipes.json puts the 60-minute tagliatelle before the 30-minute steak, so this section already highlights a slower recipe ahead of a faster one; any catalog order change will keep producing misleading "quick" recommendations.
Useful? React with 👍 / 👎.
**<sub><sub></sub></sub> Order Quick start recipes by total time before slicing**
The new "Quick start" block promises the shortest path from craving to plate, but `array_slice($recipes, 0, 3)` just reuses whatever order `filter_recipes()` returned. In the current catalog, `data/recipes.json` puts the 60-minute tagliatelle before the 30-minute steak, so this section already highlights a slower recipe ahead of a faster one; any catalog order change will keep producing misleading "quick" recommendations.
Useful? React with 👍 / 👎.
Stop slicing the library down to six filtered recipes
$recipeCount still reports every matching recipe, but $latestRecipes keeps only the first six and the new library markup has no pager or "view all" link. That means as soon as there are more than six live recipes—or more than six matches for a search/tag—everything after the sixth disappears from the homepage entirely even though the header says more results exist.
Useful? React with 👍 / 👎.
**<sub><sub></sub></sub> Stop slicing the library down to six filtered recipes**
`$recipeCount` still reports every matching recipe, but `$latestRecipes` keeps only the first six and the new library markup has no pager or "view all" link. That means as soon as there are more than six live recipes—or more than six matches for a search/tag—everything after the sixth disappears from the homepage entirely even though the header says more results exist.
Useful? React with 👍 / 👎.
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Motivation
Description
index.phpinto a mobile-first structure: newdiscover-shell(search + stats + tag panel),quick-start(compact recipe cards), a simplifiedlatestlibrary view, and anempty-stateUI for filtered results.quickStartRecipes,latestRecipes,recipeCount,averageMinutes,activeTag,tagCount) and localized copy keys for the new blocks inindex.phpso templates remain simple and fast..sr-onlyand new CSS rules inassets/style.cssfor.discover-shell,.discover-stats,.tag-panel,.quick-start,.empty-stateand responsive media queries to ensure clean single-column stacking and readable spacing on tablets and phones.Testing
php -l index.phpand the file passed PHP syntax checks successfully.php -l partials/header.phpandphp -l partials/head.phpand both passed PHP syntax checks successfully.Codex Task
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit:
5e300c84faℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
@@ -108,6 +108,46 @@ $navHome = $t['home'];$navLatest = $t['latest'];$navBasics = $t['basics'];$quickStartRecipes = array_slice($recipes, 0, 3);The new "Quick start" block promises the shortest path from craving to plate, but
array_slice($recipes, 0, 3)just reuses whatever orderfilter_recipes()returned. In the current catalog,data/recipes.jsonputs the 60-minute tagliatelle before the 30-minute steak, so this section already highlights a slower recipe ahead of a faster one; any catalog order change will keep producing misleading "quick" recommendations.Useful? React with 👍 / 👎.
@@ -109,2 +109,4 @@$navBasics = $t['basics'];$quickStartRecipes = array_slice($recipes, 0, 3);$latestRecipes = array_slice($recipes, 0, 6);$recipeCountstill reports every matching recipe, but$latestRecipeskeeps only the first six and the new library markup has no pager or "view all" link. That means as soon as there are more than six live recipes—or more than six matches for a search/tag—everything after the sixth disappears from the homepage entirely even though the header says more results exist.Useful? React with 👍 / 👎.