feat: add full project - backend, frontend, docker, specs and configs

.specify/features/014-properties-grid-ux/spec.md

@@ -0,0 +1,49 @@
+# Feature Specification: Grid de Imóveis — 4 Colunas, Altura Uniforme e UX/UI
+
+**Feature Branch**: `014-properties-grid-ux`
+**Created**: 2026-04-14
+**Status**: In Progress
+
+## Contexto
+
+A página `/imoveis` atualmente exibe um grid de 3 colunas (`xl:grid-cols-3`) com cards de altura variável conforme o comprimento do título. Os separadores visuais entre cards ficam descalinhados, a paginação usa `per_page=12` (múltiplo de 3) e o `max-w` do layout é 1200px. Esta feature reestrutura o grid para 4 colunas, garante altura uniforme nos cards alinhando o rodapé (stats e botão comparar) ao fundo, aumenta o `max-w` para acomodar 4 colunas ao lado do filtro, e aplica melhorias de UX/UI: localização no card (cidade/bairro), ícone de estacionamento, skeleton atualizado, e ajuste de `per_page` para 16.
+
+### Estado atual
+
+- `CatalogPage` (ou equivalente): `xl:grid-cols-3`, `max-w-[1200px]`, `per_page=12`
+- `PropertyCard.tsx`: altura variável conforme título; sem exibição de cidade/bairro; sem ícone de vagas
+- `PropertyCardSkeleton.tsx`: reflete estrutura de 3 colunas com 12 itens no loading
+- `FilterSidebar.tsx` desktop: `w-64`
+
+## User Stories
+
+### US1 — 4 colunas no grid (P1)
+**Given** usuário na página `/imoveis` em tela >= 1280px, **When** grid de imóveis é renderizado, **Then** exibe 4 cards por linha. Em telas menores: 1 coluna (< 640px), 2 colunas (640–1023px), 3 colunas (1024–1279px).
+
+### US2 — Altura uniforme nos cards (P1)
+**Given** grid com cards de títulos longos e curtos na mesma linha, **When** renderizado, **Then** todos os cards de uma mesma linha têm exatamente a mesma altura, com o rodapé (stats + botão comparar) sempre alinhado na parte inferior.
+
+### US3 — Localização no card (P2)
+**Given** card de um imóvel com cidade e/ou bairro informados, **When** exibido no grid, **Then** mostra cidade e bairro abaixo do título em texto menor e discreto.
+
+### US4 — Ícone de vagas no card (P2)
+**Given** imóvel com `parking_spots > 0`, **When** exibido no grid, **Then** exibe ícone de carro + número de vagas na seção de stats.
+
+### US5 — Paginação compatível (P1)
+**Given** grid de 4 colunas, **When** nova página carrega, **Then** `per_page=16` (múltiplo de 4) e skeleton também exibe 16 itens.
+
+### US6 — Responsividade revisada (P1)
+**Given** usuário em qualquer dispositivo, **When** página carrega, **Then** layout adapta corretamente: filtro como overlay no mobile, grid responsivo sem overflow horizontal.
+
+## Acceptance Criteria
+
+- Grid alterado para `grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4`
+- `max-w` do layout aumentado para `max-w-[1400px]`
+- `FilterSidebar` desktop reduzida de `w-64` para `w-56`
+- `per_page` default alterado de `12` para `16`
+- `PropertyCard.tsx`: elemento raiz do link usa `flex flex-col h-full`; rodapé (stats + botão comparar) usa `mt-auto`
+- `PropertyCard.tsx`: exibe cidade e bairro abaixo do título quando disponíveis
+- `PropertyCard.tsx`: exibe ícone de carro + `parking_spots` quando `parking_spots > 0`
+- `PropertyCardSkeleton.tsx`: atualizado para refletir nova estrutura (placeholder de localização + parking)
+- Skeleton renderiza 16 itens durante o estado de loading
+- Nenhuma dependência externa nova

.specify/features/014-properties-grid-ux/tasks.md

@@ -0,0 +1,24 @@
+# Tasks: Grid de Imóveis — 4 Colunas, Altura Uniforme e UX/UI
+
+**Feature**: `014-properties-grid-ux`
+**Generated**: 2026-04-14
+**Depends On**: Nenhuma — alterações puramente de layout/componente frontend
+
+---
+
+## Frontend — PropertiesPage.tsx
+- [x] T001 Alterar grid de xl:grid-cols-3 para xl:grid-cols-4 (manter sm:grid-cols-2, lg:grid-cols-3) em `frontend/src/pages/PropertiesPage.tsx`
+- [x] T002 Alterar max-w do layout de 1200px para 1400px (todas as ocorrências na página) em `frontend/src/pages/PropertiesPage.tsx`
+- [x] T003 Alterar FilterSidebar desktop de w-64 para w-56 em `frontend/src/components/FilterSidebar.tsx`
+- [x] T004 Alterar per_page default de 12 para 16 (filtersFromParams + handleFiltersChange) em `frontend/src/pages/PropertiesPage.tsx`
+- [x] T005 Alterar skeleton de 9 para 16 itens no loading em `frontend/src/pages/PropertiesPage.tsx`
+
+## Frontend — PropertyCard.tsx
+- [x] T006 Adicionar h-full e flex flex-col no Link container para altura uniforme em `frontend/src/components/PropertyCard.tsx`
+- [x] T007 Adicionar mt-auto no rodapé de stats + botão comparar em `frontend/src/components/PropertyCard.tsx`
+- [x] T008 Exibir localização (cidade e/ou bairro) abaixo do título em `frontend/src/components/PropertyCard.tsx`
+- [x] T009 Adicionar ícone de carro + parking_spots nos stats quando > 0 em `frontend/src/components/PropertyCard.tsx`
+
+## Frontend — PropertyCardSkeleton.tsx
+- [x] T010 Adicionar skeleton de linha de localização após título em `frontend/src/components/PropertyCardSkeleton.tsx`
+- [x] T011 Adicionar skeleton de parking nos stats em `frontend/src/components/PropertyCardSkeleton.tsx`