nestopa-web · card designs
The three proposed cards, built live. Change the controls and the card redraws, so you can check any combination rather than take a screenshot's word for it.
Every listing in Buy and Rent search results, and the map list.
There are too many combinations to draw them all, so pick one. Tenure and type decide the shape, the checkboxes are the things that may or may not be there. Anything a listing always has is not a checkbox, because there is no version of the card without it.
Every project in the Projects results grid.
A project card is wider than a property card and keeps everything over the photo, because a project has to carry a name, a developer and its numbers. Price leads, then the name. The phase, the unit count and the completion year share one pill at the top right, with a single coloured dot carrying the status. Beds and baths come off entirely, since they describe a unit rather than a building.
| Element | Fires when | Note |
|---|---|---|
| Phase badge | project.new = 1, then split by phase | the only badge on the card |
| Starting price | price > 0, otherwise the card prints "N/A" | N/A appears on live listings today |
| Name, location, units, beds, baths | always | beds and baths are min-max ranges |
| Shortlist heartabsent | projects cannot be shortlisted at all | property cards have one |
| Developer logoabsent here | only on the wide new-development card, and only from lg up | the search card never shows it |
| Completion yearunused | year_completed is stored and indexed, never rendered | the first question buyers ask |
| Promotedunused | promoted is stored, indexed and filterable, never rendered | a paid flag with no visible effect |
The branch reads @elseif($phase === "new_development" || $show), and
$show is already true by the time execution gets there, so it swallows every
remaining case. Ready to Move always renders as a blue New Development pill instead.
The whole badge is wrapped in @if($show) and the card passes
project.new. So the moment a project stops being new, it loses its phase pill and
the card says nothing about whether it is finished, half built, or years away.
Inside Buy and Rent results, once per page after the fourth listing, and only when the search has a matching new development.
A different component from the project card, two grid columns wide and 224px tall. It is a promo placement dropped into someone else's results, so the name leads and the extra width carries the unit, bed and bath counts along a rail at the foot.
Foreign quota, condos only, and a daily rental price. Nothing in the database holds either
one. The ownership column looks close but it means freehold or leasehold, a
different question. Everything else on the card can be built without waiting.
It is a feature agents already tick, and it already shows on the detail page. Search results are hydrated straight from the database, so it costs one word in one eager load and one extra query per page. No migration.
The converter only runs when the site language is Thai. In English it prints raw square metres, which is not how land is bought here. Even in Thai it returns "2.33 rai" instead of rai-ngan-wah. Switch the builder above to Land and toggle the language to see it. This is the change with the widest reach, because the same numbers appear on detail pages, project pages and the partner feeds.
Featured, Premium and the agency logo are stamped on depending on which of four search rounds picked the listing up, and those rounds are capped and randomised. So a premium listing that loses the draw shows no badge at all, every agency logo vanishes the moment a buyer changes the sort, and badges thin out on later pages. Redesigning the card does not touch any of this.
Everything still sits over the photo. The title comes off because it repeated the location under it. Beds and baths become one badge, size becomes one badge that changes shape by property type, and the rest are chips that wrap to a second line instead of being silently cut off the way they are now.
Every badge condition, the file and line behind it, and the reasoning per decision is in the reference page. Open that one while building, not before.
Notes and reasoning are hidden. Add ?text or #text to the address to
show them. The hash works even where the query string gets stripped, and it takes effect without
a reload.