Files
homeproz/wp-content/themes/homeproz/template-parts/agent/archive-agent.scss
T
Hanson.xyz Dev 42a06a5435 Add agent listing page with ordering and disabled agent support
- Added agent_order (number) and agent_disabled (toggle) ACF fields
- Created archive-agent.php template for /agents/ listing page
  - Queries only active agents, ordered by agent_order then title
  - Grid layout with agent cards showing photo, name, title, bio
  - Contact action buttons (phone, email, profile)
- Added "Agents" link to footer fallback menu
- Updated single-agent.php to return 404 for disabled agents
- Updated property-agent.php to handle disabled agents:
  - Shows agent name and photo (for historical reference)
  - Replaces agent contact with office phone number
  - Removes Agent Profile button and email
  - Adds "Contact Us" button linking to contact form
- Added archive-agent.scss with responsive grid styles

Admin can now:
- Set display order for agents (lower numbers first)
- Disable agents who have left (hides from listing, 404s profile)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-30 19:10:38 -06:00

157 lines
3.3 KiB
SCSS

/**
* Agent Archive Styles
*
* @package HomeProz
*/
.Agents_Archive {
.agents-section {
padding: 3rem 0 4rem;
}
// Agents Grid
.agents-grid {
display: grid;
grid-template-columns: 1fr;
gap: 2rem;
@media (min-width: 640px) {
grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 1024px) {
grid-template-columns: repeat(3, 1fr);
}
@media (min-width: 1280px) {
grid-template-columns: repeat(4, 1fr);
}
}
// Agent Card
.agent-card-item {
background-color: var(--color-bg-card);
border-radius: 0.5rem;
overflow: hidden;
display: flex;
flex-direction: column;
}
.agent-card-link {
display: block;
text-decoration: none;
color: inherit;
flex: 1;
&:hover {
.agent-card-image img {
transform: scale(1.05);
}
.agent-card-name {
color: var(--color-accent-light);
}
}
}
.agent-card-image {
aspect-ratio: 1 / 1;
overflow: hidden;
background-color: var(--color-bg-dark);
img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
}
}
.agent-card-placeholder {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
color: var(--color-text-muted);
}
.agent-card-content {
padding: 1.25rem;
}
.agent-card-title-label {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.1em;
color: var(--color-accent);
margin-bottom: 0.375rem;
font-weight: 600;
}
.agent-card-name {
font-size: 1.25rem;
font-family: var(--font-display);
margin-bottom: 0.5rem;
line-height: 1.2;
}
.agent-card-bio {
font-size: 0.875rem;
color: var(--color-text-muted);
line-height: 1.5;
margin-bottom: 0;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
overflow: hidden;
}
// Agent Card Actions
.agent-card-actions {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0 1.25rem 1.25rem;
margin-top: auto;
}
.agent-action-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 0.375rem;
width: 40px;
height: 40px;
background-color: var(--color-bg-dark);
border-radius: 0.25rem;
color: var(--color-text-muted);
text-decoration: none;
&:hover {
background-color: var(--color-accent);
color: white;
}
&.agent-action-profile {
flex: 1;
width: auto;
font-size: 0.8125rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
}
}
// No Agents Message
.no-agents-message {
text-align: center;
padding: 3rem;
color: var(--color-text-muted);
p {
margin-bottom: 0;
}
}
}