Phase 3: Page Templates - Homepage, About, Contact, Blog, Search, Full-width, Landing templates with reusable components
This commit is contained in:
Hanson.xyz Dev
@@ -0,0 +1,91 @@
|
||||
<?php
|
||||
/**
|
||||
* The template for displaying archive pages (blog, categories, tags)
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main archive-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
$archive_title = 'News & Insights';
|
||||
$archive_subtitle = 'Stay informed with real estate tips, market updates, and community news';
|
||||
|
||||
if (is_category()) {
|
||||
$archive_title = single_cat_title('', false);
|
||||
$archive_subtitle = category_description();
|
||||
} elseif (is_tag()) {
|
||||
$archive_title = 'Tagged: ' . single_tag_title('', false);
|
||||
$archive_subtitle = tag_description();
|
||||
} elseif (is_author()) {
|
||||
$archive_title = 'Posts by ' . get_the_author();
|
||||
$archive_subtitle = get_the_author_meta('description');
|
||||
} elseif (is_date()) {
|
||||
if (is_year()) {
|
||||
$archive_title = 'Archive: ' . get_the_date('Y');
|
||||
} elseif (is_month()) {
|
||||
$archive_title = 'Archive: ' . get_the_date('F Y');
|
||||
} else {
|
||||
$archive_title = 'Archive: ' . get_the_date();
|
||||
}
|
||||
}
|
||||
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => $archive_title,
|
||||
'subtitle' => $archive_subtitle ?: 'Browse our articles and updates',
|
||||
'size' => 'small',
|
||||
));
|
||||
?>
|
||||
|
||||
<section class="archive-content-section">
|
||||
<div class="container">
|
||||
<div class="archive-layout">
|
||||
<!-- Main Content -->
|
||||
<div class="archive-posts">
|
||||
<?php if (have_posts()) : ?>
|
||||
<div class="posts-grid">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
get_template_part('template-parts/content/content', 'card');
|
||||
endwhile;
|
||||
?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
// Pagination
|
||||
the_posts_pagination(array(
|
||||
'prev_text' => '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M19 12H5M12 19l-7-7 7-7"/></svg> Previous',
|
||||
'next_text' => 'Next <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>',
|
||||
'mid_size' => 2,
|
||||
));
|
||||
?>
|
||||
<?php else : ?>
|
||||
<div class="no-posts-message">
|
||||
<h2>No Posts Found</h2>
|
||||
<p>There are no posts to display at this time. Please check back later.</p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<aside class="archive-sidebar">
|
||||
<?php get_template_part('template-parts/sidebar/blog-sidebar'); ?>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
+1
-1
File diff suppressed because one or more lines are too long
@@ -0,0 +1,209 @@
|
||||
<?php
|
||||
/**
|
||||
* The template for displaying the homepage
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
|
||||
// Get featured properties (3 most recent active listings)
|
||||
$featured_properties = new WP_Query(array(
|
||||
'post_type' => 'property',
|
||||
'posts_per_page' => 3,
|
||||
'tax_query' => array(
|
||||
array(
|
||||
'taxonomy' => 'property_status',
|
||||
'field' => 'slug',
|
||||
'terms' => 'active',
|
||||
),
|
||||
),
|
||||
'orderby' => 'date',
|
||||
'order' => 'DESC',
|
||||
));
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main homepage-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => 'Find Your Dream Home Today',
|
||||
'subtitle' => 'Expert real estate services for buyers and sellers in Albert Lea and the surrounding Minnesota communities.',
|
||||
'primary_cta_text' => 'View Properties',
|
||||
'primary_cta_url' => home_url('/properties/'),
|
||||
'secondary_cta_text' => 'Contact Us',
|
||||
'secondary_cta_url' => home_url('/contact/'),
|
||||
'size' => 'large',
|
||||
));
|
||||
?>
|
||||
|
||||
<!-- Featured Properties Section -->
|
||||
<section class="featured-properties-section">
|
||||
<div class="container">
|
||||
<header class="section-header">
|
||||
<h2 class="section-title">Current Listings</h2>
|
||||
<p class="section-subtitle">Browse our featured properties for sale</p>
|
||||
</header>
|
||||
|
||||
<?php if ($featured_properties->have_posts()) : ?>
|
||||
<div class="property-grid property-grid--3col">
|
||||
<?php
|
||||
while ($featured_properties->have_posts()) :
|
||||
$featured_properties->the_post();
|
||||
get_template_part('template-parts/property/property-card');
|
||||
endwhile;
|
||||
wp_reset_postdata();
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="section-footer">
|
||||
<a href="<?php echo esc_url(home_url('/properties/')); ?>" class="btn btn-secondary">
|
||||
View All Properties
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M5 12h14M12 5l7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<?php else : ?>
|
||||
<p class="no-properties-message">No properties currently available. Please check back soon.</p>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Why Choose Us / Features Section -->
|
||||
<section class="features-section">
|
||||
<div class="container">
|
||||
<header class="features-section-header">
|
||||
<h2 class="features-section-title">Why HomeProz?</h2>
|
||||
<p class="features-section-subtitle">We're committed to helping you achieve your real estate goals</p>
|
||||
</header>
|
||||
|
||||
<div class="features-grid">
|
||||
<?php
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'local-expertise',
|
||||
'title' => 'Local Expertise',
|
||||
'text' => 'Deep knowledge of the Albert Lea area and surrounding Minnesota communities helps us find the perfect property for you.',
|
||||
));
|
||||
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'personalized',
|
||||
'title' => 'Personalized Service',
|
||||
'text' => 'We take the time to understand your unique needs and provide tailored guidance throughout your real estate journey.',
|
||||
));
|
||||
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'results',
|
||||
'title' => 'Results-Driven',
|
||||
'text' => 'Our track record speaks for itself. We work tirelessly to get you the best possible outcome, whether buying or selling.',
|
||||
));
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Team Preview Section -->
|
||||
<section class="team-section">
|
||||
<div class="container">
|
||||
<header class="team-section-header">
|
||||
<h2 class="team-section-title">Meet Our Agents</h2>
|
||||
<p class="team-section-subtitle">A dedicated team of real estate professionals ready to serve you</p>
|
||||
</header>
|
||||
|
||||
<div class="team-grid">
|
||||
<?php
|
||||
// Team member data - can be replaced with ACF repeater or CPT later
|
||||
$team_members = array(
|
||||
array(
|
||||
'name' => 'Heidi Johnson',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-402-2310',
|
||||
'email' => 'heidi@homeprozrealestate.com',
|
||||
),
|
||||
array(
|
||||
'name' => 'Kyra Johnson',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-516-4870',
|
||||
'email' => 'kyra@homeprozrealestate.com',
|
||||
),
|
||||
array(
|
||||
'name' => 'John Hill',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-383-1738',
|
||||
'email' => 'john@homeprozrealestate.com',
|
||||
),
|
||||
array(
|
||||
'name' => 'Mindy Moreno',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-438-5900',
|
||||
'email' => 'mindy@homeprozrealestate.com',
|
||||
),
|
||||
);
|
||||
|
||||
foreach ($team_members as $member) :
|
||||
get_template_part('template-parts/components/agent-card', null, $member);
|
||||
endforeach;
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="section-footer">
|
||||
<a href="<?php echo esc_url(home_url('/about/')); ?>" class="btn btn-secondary">
|
||||
Learn More About Us
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Testimonials Section -->
|
||||
<section class="testimonials-section">
|
||||
<div class="container">
|
||||
<header class="testimonials-section-header">
|
||||
<h2 class="testimonials-section-title">What Our Clients Say</h2>
|
||||
<p class="testimonials-section-subtitle">Real stories from satisfied buyers and sellers</p>
|
||||
</header>
|
||||
|
||||
<div class="testimonials-grid">
|
||||
<?php
|
||||
// Testimonial data - can be replaced with ACF repeater or CPT later
|
||||
$testimonials = array(
|
||||
array(
|
||||
'quote' => 'HomeProz made our home buying experience incredibly smooth. They were patient, knowledgeable, and always available to answer our questions. We found our dream home faster than we ever expected!',
|
||||
'name' => 'Sarah & Mike T.',
|
||||
'location' => 'Home Buyers, Albert Lea',
|
||||
),
|
||||
array(
|
||||
'quote' => 'Selling our home was stress-free thanks to the HomeProz team. They handled everything professionally and got us a great price. Highly recommend!',
|
||||
'name' => 'Robert K.',
|
||||
'location' => 'Home Seller, Austin',
|
||||
),
|
||||
);
|
||||
|
||||
foreach ($testimonials as $testimonial) :
|
||||
get_template_part('template-parts/components/testimonial', null, $testimonial);
|
||||
endforeach;
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<?php
|
||||
// Contact CTA Section
|
||||
get_template_part('template-parts/components/cta-section', null, array(
|
||||
'title' => 'Ready to Find Your Dream Home?',
|
||||
'text' => 'Whether you\'re buying or selling, our team is here to help you every step of the way.',
|
||||
'button_text' => 'Contact Us Today',
|
||||
'button_url' => home_url('/contact/'),
|
||||
'style' => 'accent',
|
||||
));
|
||||
?>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -0,0 +1,70 @@
|
||||
<?php
|
||||
/**
|
||||
* The template for displaying the blog index page
|
||||
* This is used when a static front page is set and "Posts page" is configured
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main archive-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => 'News & Insights',
|
||||
'subtitle' => 'Stay informed with real estate tips, market updates, and community news',
|
||||
'size' => 'small',
|
||||
));
|
||||
?>
|
||||
|
||||
<section class="archive-content-section">
|
||||
<div class="container">
|
||||
<div class="archive-layout">
|
||||
<!-- Main Content -->
|
||||
<div class="archive-posts">
|
||||
<?php if (have_posts()) : ?>
|
||||
<div class="posts-grid">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
get_template_part('template-parts/content/content', 'card');
|
||||
endwhile;
|
||||
?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
// Pagination
|
||||
the_posts_pagination(array(
|
||||
'prev_text' => '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M19 12H5M12 19l-7-7 7-7"/></svg> Previous',
|
||||
'next_text' => 'Next <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>',
|
||||
'mid_size' => 2,
|
||||
));
|
||||
?>
|
||||
<?php else : ?>
|
||||
<div class="no-posts-message">
|
||||
<h2>No Posts Found</h2>
|
||||
<p>There are no posts to display at this time. Please check back later.</p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<aside class="archive-sidebar">
|
||||
<?php get_template_part('template-parts/sidebar/blog-sidebar'); ?>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -0,0 +1,150 @@
|
||||
<?php
|
||||
/**
|
||||
* Template Name: About Page
|
||||
* Template for displaying the About/Team page
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main about-page-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => 'About HomeProz',
|
||||
'subtitle' => 'Your trusted real estate partner in Albert Lea and surrounding Minnesota communities.',
|
||||
'size' => 'small',
|
||||
));
|
||||
?>
|
||||
|
||||
<!-- Company Story Section -->
|
||||
<section class="about-story-section">
|
||||
<div class="container">
|
||||
<div class="about-story-content">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
the_content();
|
||||
endwhile;
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Our Values Section -->
|
||||
<section class="about-values-section">
|
||||
<div class="container">
|
||||
<header class="about-values-header">
|
||||
<h2 class="about-values-title">Our Values</h2>
|
||||
</header>
|
||||
|
||||
<div class="features-grid">
|
||||
<?php
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'handshake',
|
||||
'title' => 'Integrity',
|
||||
'text' => 'We believe in honest, transparent communication throughout every transaction. Your trust is our priority.',
|
||||
));
|
||||
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'personalized',
|
||||
'title' => 'Client-Focused',
|
||||
'text' => 'Your goals are our goals. We listen carefully and work tirelessly to exceed your expectations.',
|
||||
));
|
||||
|
||||
get_template_part('template-parts/components/feature-block', null, array(
|
||||
'icon' => 'local-expertise',
|
||||
'title' => 'Community',
|
||||
'text' => 'We live and work in the communities we serve. Local knowledge means better results for you.',
|
||||
));
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Meet the Team Section -->
|
||||
<section class="about-team-section">
|
||||
<div class="container">
|
||||
<header class="about-team-header">
|
||||
<h2 class="about-team-title">Meet Our Team</h2>
|
||||
<p class="about-team-subtitle">A dedicated group of real estate professionals committed to your success</p>
|
||||
</header>
|
||||
|
||||
<div class="about-team-grid">
|
||||
<?php
|
||||
// Team member data with bios
|
||||
$team_members = array(
|
||||
array(
|
||||
'name' => 'Heidi Johnson',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-402-2310',
|
||||
'email' => 'heidi@homeprozrealestate.com',
|
||||
'bio' => 'With deep roots in the Albert Lea community, Heidi brings years of local knowledge and dedication to every client relationship.',
|
||||
),
|
||||
array(
|
||||
'name' => 'Kyra Johnson',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-516-4870',
|
||||
'email' => 'kyra@homeprozrealestate.com',
|
||||
'bio' => 'Kyra combines her passion for real estate with a commitment to exceptional service, guiding buyers and sellers to successful outcomes.',
|
||||
),
|
||||
array(
|
||||
'name' => 'John Hill',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-383-1738',
|
||||
'email' => 'john@homeprozrealestate.com',
|
||||
'bio' => 'John\'s expertise in the local market and attention to detail ensure a smooth experience whether you\'re buying or selling.',
|
||||
),
|
||||
array(
|
||||
'name' => 'Mindy Moreno',
|
||||
'title' => 'REALTOR',
|
||||
'phone' => '507-438-5900',
|
||||
'email' => 'mindy@homeprozrealestate.com',
|
||||
'bio' => 'Mindy\'s bilingual skills and warm approach help her connect with a diverse range of clients in our community.',
|
||||
),
|
||||
);
|
||||
|
||||
foreach ($team_members as $member) :
|
||||
get_template_part('template-parts/components/agent-card', null, $member);
|
||||
endforeach;
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Broker Information Section -->
|
||||
<section class="about-broker-section">
|
||||
<div class="container">
|
||||
<div class="about-broker-content">
|
||||
<h3 class="about-broker-title">Broker Information</h3>
|
||||
<p class="about-broker-text">
|
||||
HomeProz Real Estate operates as a DBA of Bridge Realty, MN.<br>
|
||||
Licensed in the State of Minnesota.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<?php
|
||||
// Contact CTA Section
|
||||
get_template_part('template-parts/components/cta-section', null, array(
|
||||
'title' => 'Ready to Work With Us?',
|
||||
'text' => 'Contact our team today to start your real estate journey.',
|
||||
'button_text' => 'Get in Touch',
|
||||
'button_url' => home_url('/contact/'),
|
||||
'style' => 'accent',
|
||||
));
|
||||
?>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -0,0 +1,211 @@
|
||||
<?php
|
||||
/**
|
||||
* Template Name: Contact Page
|
||||
* Template for displaying the Contact page
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
|
||||
// Get contact info from theme options
|
||||
$phone = homeproz_get_option('phone', '507-516-4870');
|
||||
$email = homeproz_get_option('email', 'info@homeprozrealestate.com');
|
||||
$address = homeproz_get_option('address', '111 E Clark St, Albert Lea, MN 56007');
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main contact-page-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => 'Get in Touch',
|
||||
'subtitle' => 'We\'re here to help with all your real estate needs.',
|
||||
'size' => 'small',
|
||||
));
|
||||
?>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact-section">
|
||||
<div class="container">
|
||||
<div class="contact-grid">
|
||||
<!-- Contact Form -->
|
||||
<div class="contact-form-wrapper">
|
||||
<h2 class="contact-form-title">Send Us a Message</h2>
|
||||
|
||||
<?php
|
||||
// Check for Contact Form 7
|
||||
if (function_exists('wpcf7_contact_form')) {
|
||||
// Try to get the main contact form
|
||||
$contact_form = get_page_by_title('Contact Form', OBJECT, 'wpcf7_contact_form');
|
||||
if ($contact_form) {
|
||||
echo do_shortcode('[contact-form-7 id="' . $contact_form->ID . '" title="Contact Form"]');
|
||||
} else {
|
||||
// Display a simple contact form shortcode placeholder
|
||||
echo '<p class="contact-form-notice">Contact form will be configured here.</p>';
|
||||
// Show default form markup as fallback
|
||||
?>
|
||||
<form class="contact-form" action="" method="post">
|
||||
<div class="form-group">
|
||||
<label for="contact-name">Name <span class="required">*</span></label>
|
||||
<input type="text" id="contact-name" name="name" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-email">Email <span class="required">*</span></label>
|
||||
<input type="email" id="contact-email" name="email" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-phone">Phone</label>
|
||||
<input type="tel" id="contact-phone" name="phone">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-message">Message <span class="required">*</span></label>
|
||||
<textarea id="contact-message" name="message" rows="5" required></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Send Message</button>
|
||||
</form>
|
||||
<?php
|
||||
}
|
||||
} else {
|
||||
// Contact Form 7 not installed - show placeholder form
|
||||
?>
|
||||
<form class="contact-form" action="" method="post">
|
||||
<div class="form-group">
|
||||
<label for="contact-name">Name <span class="required">*</span></label>
|
||||
<input type="text" id="contact-name" name="name" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-email">Email <span class="required">*</span></label>
|
||||
<input type="email" id="contact-email" name="email" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-phone">Phone</label>
|
||||
<input type="tel" id="contact-phone" name="phone">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact-message">Message <span class="required">*</span></label>
|
||||
<textarea id="contact-message" name="message" rows="5" required></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Send Message</button>
|
||||
</form>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
||||
<!-- Contact Info -->
|
||||
<div class="contact-info-wrapper">
|
||||
<h2 class="contact-info-title">Contact Information</h2>
|
||||
|
||||
<div class="contact-info-list">
|
||||
<?php if ($address) : ?>
|
||||
<div class="contact-info-item">
|
||||
<div class="contact-info-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/>
|
||||
<circle cx="12" cy="10" r="3"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="contact-info-content">
|
||||
<h4 class="contact-info-label">Office Address</h4>
|
||||
<p class="contact-info-value"><?php echo esc_html($address); ?></p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($phone) : ?>
|
||||
<div class="contact-info-item">
|
||||
<div class="contact-info-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="contact-info-content">
|
||||
<h4 class="contact-info-label">Phone</h4>
|
||||
<p class="contact-info-value">
|
||||
<a href="tel:<?php echo esc_attr(preg_replace('/[^0-9]/', '', $phone)); ?>">
|
||||
<?php echo esc_html($phone); ?>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($email) : ?>
|
||||
<div class="contact-info-item">
|
||||
<div class="contact-info-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/>
|
||||
<polyline points="22,6 12,13 2,6"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="contact-info-content">
|
||||
<h4 class="contact-info-label">Email</h4>
|
||||
<p class="contact-info-value">
|
||||
<a href="mailto:<?php echo esc_attr($email); ?>">
|
||||
<?php echo esc_html($email); ?>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="contact-info-item">
|
||||
<div class="contact-info-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<circle cx="12" cy="12" r="10"/>
|
||||
<polyline points="12 6 12 12 16 14"/>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="contact-info-content">
|
||||
<h4 class="contact-info-label">Office Hours</h4>
|
||||
<p class="contact-info-value">
|
||||
Monday - Friday: 9:00 AM - 5:00 PM<br>
|
||||
Weekends: By Appointment
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Map -->
|
||||
<div class="contact-map">
|
||||
<iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2871.8244599999997!2d-93.36827!3d43.64829!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x87f5024a6c0d9e7d%3A0x0!2s111%20E%20Clark%20St%2C%20Albert%20Lea%2C%20MN%2056007!5e0!3m2!1sen!2sus!4v1234567890"
|
||||
width="100%"
|
||||
height="250"
|
||||
style="border:0;"
|
||||
allowfullscreen=""
|
||||
loading="lazy"
|
||||
referrerpolicy="no-referrer-when-downgrade"
|
||||
title="HomeProz Office Location">
|
||||
</iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Additional Content from Page Editor -->
|
||||
<?php if (have_posts()) : ?>
|
||||
<?php while (have_posts()) : the_post(); ?>
|
||||
<?php if (get_the_content()) : ?>
|
||||
<section class="contact-additional-content">
|
||||
<div class="container">
|
||||
<div class="entry-content">
|
||||
<?php the_content(); ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<?php endif; ?>
|
||||
<?php endwhile; ?>
|
||||
<?php endif; ?>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -0,0 +1,135 @@
|
||||
<?php
|
||||
/**
|
||||
* The template for displaying search results pages
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main search-main">
|
||||
|
||||
<?php
|
||||
// Hero Section
|
||||
$search_query = get_search_query();
|
||||
get_template_part('template-parts/components/hero-section', null, array(
|
||||
'title' => 'Search Results',
|
||||
'subtitle' => $search_query ? 'Results for: "' . esc_html($search_query) . '"' : 'Enter a search term to find content',
|
||||
'size' => 'small',
|
||||
));
|
||||
?>
|
||||
|
||||
<section class="search-content-section">
|
||||
<div class="container">
|
||||
<!-- Search Form -->
|
||||
<div class="search-form-wrapper">
|
||||
<?php get_search_form(); ?>
|
||||
</div>
|
||||
|
||||
<?php if (have_posts()) : ?>
|
||||
<p class="search-results-count">
|
||||
<?php
|
||||
global $wp_query;
|
||||
printf(
|
||||
esc_html(_n('%d result found', '%d results found', $wp_query->found_posts, 'homeproz')),
|
||||
$wp_query->found_posts
|
||||
);
|
||||
?>
|
||||
</p>
|
||||
|
||||
<div class="search-results">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
$post_type = get_post_type();
|
||||
?>
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class('search-result-item'); ?>>
|
||||
<?php if (has_post_thumbnail()) : ?>
|
||||
<a href="<?php the_permalink(); ?>" class="search-result-image">
|
||||
<?php the_post_thumbnail('thumbnail'); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="search-result-content">
|
||||
<div class="search-result-meta">
|
||||
<span class="search-result-type">
|
||||
<?php
|
||||
if ($post_type === 'property') {
|
||||
echo 'Property';
|
||||
} elseif ($post_type === 'page') {
|
||||
echo 'Page';
|
||||
} else {
|
||||
echo 'Article';
|
||||
}
|
||||
?>
|
||||
</span>
|
||||
<?php if ($post_type === 'post') : ?>
|
||||
<span class="search-result-date"><?php echo get_the_date(); ?></span>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<?php the_title('<h2 class="search-result-title"><a href="' . esc_url(get_permalink()) . '">', '</a></h2>'); ?>
|
||||
|
||||
<div class="search-result-excerpt">
|
||||
<?php
|
||||
if ($post_type === 'property') {
|
||||
// Show property-specific info
|
||||
$price = get_field('price');
|
||||
$city = get_field('city');
|
||||
$state = get_field('state');
|
||||
echo '<p>';
|
||||
if ($price) {
|
||||
echo '<strong>' . homeproz_format_price($price) . '</strong>';
|
||||
}
|
||||
if ($city || $state) {
|
||||
echo ' - ' . esc_html($city) . ', ' . esc_html($state);
|
||||
}
|
||||
echo '</p>';
|
||||
} else {
|
||||
the_excerpt();
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
||||
<a href="<?php the_permalink(); ?>" class="search-result-link">
|
||||
View <?php echo $post_type === 'property' ? 'Property' : 'More'; ?>
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M5 12h14M12 5l7 7-7 7"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</article>
|
||||
<?php endwhile; ?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
// Pagination
|
||||
the_posts_pagination(array(
|
||||
'prev_text' => '<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M19 12H5M12 19l-7-7 7-7"/></svg> Previous',
|
||||
'next_text' => 'Next <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg>',
|
||||
'mid_size' => 2,
|
||||
));
|
||||
?>
|
||||
<?php else : ?>
|
||||
<div class="no-results-message">
|
||||
<h2>No Results Found</h2>
|
||||
<p>Sorry, no results were found for your search. Try different keywords or browse our pages:</p>
|
||||
<div class="no-results-actions">
|
||||
<a href="<?php echo esc_url(home_url('/properties/')); ?>" class="btn btn-primary">View Properties</a>
|
||||
<a href="<?php echo esc_url(home_url('/')); ?>" class="btn btn-secondary">Go Home</a>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -13,26 +13,87 @@ if (!defined('ABSPATH')) {
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main">
|
||||
<div class="container">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
get_template_part('template-parts/content/content', 'single');
|
||||
<main id="primary" class="site-main single-post-main">
|
||||
|
||||
// Post navigation
|
||||
the_post_navigation(array(
|
||||
'prev_text' => '<span class="nav-subtitle">← Previous</span><span class="nav-title">%title</span>',
|
||||
'next_text' => '<span class="nav-subtitle">Next →</span><span class="nav-title">%title</span>',
|
||||
));
|
||||
<?php if (has_post_thumbnail()) : ?>
|
||||
<div class="single-post-hero">
|
||||
<?php the_post_thumbnail('full'); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<section class="single-post-section">
|
||||
<div class="container">
|
||||
<div class="single-post-layout">
|
||||
<!-- Main Content -->
|
||||
<article class="single-post-content">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
get_template_part('template-parts/content/content', 'single');
|
||||
|
||||
// Post navigation
|
||||
the_post_navigation(array(
|
||||
'prev_text' => '<span class="nav-subtitle"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M19 12H5M12 19l-7-7 7-7"/></svg> Previous</span><span class="nav-title">%title</span>',
|
||||
'next_text' => '<span class="nav-subtitle">Next <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true"><path d="M5 12h14M12 5l7 7-7 7"/></svg></span><span class="nav-title">%title</span>',
|
||||
));
|
||||
|
||||
// Comments
|
||||
if (comments_open() || get_comments_number()) :
|
||||
comments_template();
|
||||
endif;
|
||||
endwhile;
|
||||
?>
|
||||
</article>
|
||||
|
||||
<!-- Sidebar -->
|
||||
<aside class="single-post-sidebar">
|
||||
<?php get_template_part('template-parts/sidebar/blog-sidebar'); ?>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Related Posts -->
|
||||
<?php
|
||||
$categories = get_the_category();
|
||||
if ($categories) :
|
||||
$category_ids = array();
|
||||
foreach ($categories as $cat) {
|
||||
$category_ids[] = $cat->term_id;
|
||||
}
|
||||
|
||||
$related_posts = new WP_Query(array(
|
||||
'post_type' => 'post',
|
||||
'posts_per_page' => 3,
|
||||
'post__not_in' => array(get_the_ID()),
|
||||
'category__in' => $category_ids,
|
||||
'orderby' => 'rand',
|
||||
));
|
||||
|
||||
if ($related_posts->have_posts()) :
|
||||
?>
|
||||
<section class="related-posts-section">
|
||||
<div class="container">
|
||||
<header class="related-posts-header">
|
||||
<h2 class="related-posts-title">Related Posts</h2>
|
||||
</header>
|
||||
|
||||
<div class="related-posts-grid">
|
||||
<?php
|
||||
while ($related_posts->have_posts()) :
|
||||
$related_posts->the_post();
|
||||
get_template_part('template-parts/content/content', 'card');
|
||||
endwhile;
|
||||
wp_reset_postdata();
|
||||
?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<?php
|
||||
endif;
|
||||
endif;
|
||||
?>
|
||||
|
||||
// Comments
|
||||
if (comments_open() || get_comments_number()) :
|
||||
comments_template();
|
||||
endif;
|
||||
endwhile;
|
||||
?>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<?php
|
||||
|
||||
@@ -14,11 +14,24 @@
|
||||
@import '../template-parts/content/content-card.scss';
|
||||
@import '../template-parts/content/content-single.scss';
|
||||
@import '../template-parts/content/content-404.scss';
|
||||
@import '../template-parts/content/content-homepage.scss';
|
||||
@import '../template-parts/content/content-about.scss';
|
||||
@import '../template-parts/content/content-contact.scss';
|
||||
@import '../template-parts/content/content-archive.scss';
|
||||
@import '../template-parts/sidebar/blog-sidebar.scss';
|
||||
@import '../template-parts/content/content-templates.scss';
|
||||
@import '../template-parts/property/property-card.scss';
|
||||
@import '../template-parts/property/property-filters.scss';
|
||||
@import '../template-parts/property/property-gallery.scss';
|
||||
@import '../template-parts/property/single-property.scss';
|
||||
|
||||
// Import reusable components
|
||||
@import '../template-parts/components/hero-section.scss';
|
||||
@import '../template-parts/components/cta-section.scss';
|
||||
@import '../template-parts/components/testimonial.scss';
|
||||
@import '../template-parts/components/agent-card.scss';
|
||||
@import '../template-parts/components/feature-block.scss';
|
||||
|
||||
// ============================================
|
||||
// CSS Custom Properties (Design Tokens)
|
||||
// ============================================
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
<?php
|
||||
/**
|
||||
* Template Name: Full Width
|
||||
* Template for displaying full-width pages without sidebar constraints
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
get_header();
|
||||
?>
|
||||
|
||||
<main id="primary" class="site-main full-width-main">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
?>
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class('full-width-content'); ?>>
|
||||
<?php if (has_post_thumbnail()) : ?>
|
||||
<div class="full-width-hero">
|
||||
<?php the_post_thumbnail('full'); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="container">
|
||||
<header class="page-header">
|
||||
<?php the_title('<h1 class="page-title">', '</h1>'); ?>
|
||||
</header>
|
||||
|
||||
<div class="entry-content entry-content--wide">
|
||||
<?php the_content(); ?>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
<?php endwhile; ?>
|
||||
</main>
|
||||
|
||||
<?php
|
||||
get_footer();
|
||||
@@ -0,0 +1,74 @@
|
||||
<?php
|
||||
/**
|
||||
* Template Name: Landing Page
|
||||
* Template for marketing/campaign landing pages with minimal header/footer
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
?>
|
||||
<!doctype html>
|
||||
<html <?php language_attributes(); ?>>
|
||||
<head>
|
||||
<meta charset="<?php bloginfo('charset'); ?>">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="profile" href="https://gmpg.org/xfn/11">
|
||||
<?php wp_head(); ?>
|
||||
</head>
|
||||
|
||||
<body <?php body_class('landing-page'); ?>>
|
||||
<?php wp_body_open(); ?>
|
||||
|
||||
<div id="page" class="site landing-page-site">
|
||||
<!-- Minimal Header -->
|
||||
<header class="landing-header">
|
||||
<div class="container">
|
||||
<div class="landing-header-content">
|
||||
<a href="<?php echo esc_url(home_url('/')); ?>" class="landing-logo">
|
||||
<?php
|
||||
$custom_logo_id = get_theme_mod('custom_logo');
|
||||
if ($custom_logo_id) {
|
||||
echo wp_get_attachment_image($custom_logo_id, 'medium', false, array('class' => 'custom-logo'));
|
||||
} else {
|
||||
echo '<span class="site-title">' . esc_html(get_bloginfo('name')) . '</span>';
|
||||
}
|
||||
?>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="primary" class="site-main landing-main">
|
||||
<?php
|
||||
while (have_posts()) :
|
||||
the_post();
|
||||
?>
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class('landing-content'); ?>>
|
||||
<div class="entry-content">
|
||||
<?php the_content(); ?>
|
||||
</div>
|
||||
</article>
|
||||
<?php endwhile; ?>
|
||||
</main>
|
||||
|
||||
<!-- Minimal Footer -->
|
||||
<footer class="landing-footer">
|
||||
<div class="container">
|
||||
<p class="landing-footer-text">
|
||||
© <?php echo date('Y'); ?> <?php bloginfo('name'); ?>. All rights reserved.
|
||||
<span class="landing-footer-links">
|
||||
<a href="<?php echo esc_url(get_privacy_policy_url()); ?>">Privacy Policy</a>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
||||
<?php wp_footer(); ?>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,82 @@
|
||||
<?php
|
||||
/**
|
||||
* Agent Card Component
|
||||
*
|
||||
* @package HomeProz
|
||||
*
|
||||
* Args:
|
||||
* - name (string): Agent name
|
||||
* - title (string): Agent title (e.g., "REALTOR")
|
||||
* - phone (string): Agent phone number
|
||||
* - email (string): Agent email
|
||||
* - photo (string): Photo URL or attachment ID
|
||||
* - bio (string): Short bio text
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Get args with defaults
|
||||
$name = isset($args['name']) ? $args['name'] : '';
|
||||
$title = isset($args['title']) ? $args['title'] : 'REALTOR';
|
||||
$phone = isset($args['phone']) ? $args['phone'] : '';
|
||||
$email = isset($args['email']) ? $args['email'] : '';
|
||||
$photo = isset($args['photo']) ? $args['photo'] : '';
|
||||
$bio = isset($args['bio']) ? $args['bio'] : '';
|
||||
|
||||
if (!$name) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If photo is an ID, get the URL
|
||||
if (is_numeric($photo)) {
|
||||
$photo = wp_get_attachment_image_url($photo, 'medium');
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="agent-card-component card">
|
||||
<div class="agent-card-photo">
|
||||
<?php if ($photo) : ?>
|
||||
<img src="<?php echo esc_url($photo); ?>" alt="<?php echo esc_attr($name); ?>" loading="lazy">
|
||||
<?php else : ?>
|
||||
<div class="agent-card-photo-placeholder">
|
||||
<svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<div class="agent-card-body">
|
||||
<h3 class="agent-card-name"><?php echo esc_html($name); ?></h3>
|
||||
<p class="agent-card-title"><?php echo esc_html($title); ?></p>
|
||||
|
||||
<?php if ($bio) : ?>
|
||||
<p class="agent-card-bio"><?php echo esc_html($bio); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="agent-card-contact">
|
||||
<?php if ($phone) : ?>
|
||||
<a href="tel:<?php echo esc_attr(preg_replace('/[^0-9]/', '', $phone)); ?>" class="agent-card-phone">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/>
|
||||
</svg>
|
||||
<?php echo esc_html($phone); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($email) : ?>
|
||||
<a href="mailto:<?php echo esc_attr($email); ?>" class="agent-card-email">
|
||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
|
||||
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/>
|
||||
<polyline points="22,6 12,13 2,6"/>
|
||||
</svg>
|
||||
Email
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,133 @@
|
||||
/**
|
||||
* Agent Card Component Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.agent-card-component {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.agent-card-photo {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
img {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.agent-card-photo-placeholder {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-bg-dark);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.agent-card-body {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.agent-card-name {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.agent-card-title {
|
||||
font-size: 0.75rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.1em;
|
||||
color: var(--color-accent-light);
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.agent-card-bio {
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-muted);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.agent-card-contact {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.agent-card-phone,
|
||||
.agent-card-email {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-muted);
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
|
||||
svg {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Team Section (for homepage/about page)
|
||||
.team-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.team-section-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.team-section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.team-section-subtitle {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.team-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1.5rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
<?php
|
||||
/**
|
||||
* CTA Section Component
|
||||
*
|
||||
* @package HomeProz
|
||||
*
|
||||
* Args:
|
||||
* - title (string): CTA headline
|
||||
* - text (string): CTA description text
|
||||
* - button_text (string): Button text
|
||||
* - button_url (string): Button URL
|
||||
* - style (string): 'default' or 'accent' (default: 'default')
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Get args with defaults
|
||||
$title = isset($args['title']) ? $args['title'] : 'Ready to Find Your Dream Home?';
|
||||
$text = isset($args['text']) ? $args['text'] : 'Contact us today to start your real estate journey.';
|
||||
$button_text = isset($args['button_text']) ? $args['button_text'] : 'Contact Us';
|
||||
$button_url = isset($args['button_url']) ? $args['button_url'] : home_url('/contact/');
|
||||
$style = isset($args['style']) ? $args['style'] : 'default';
|
||||
|
||||
$style_class = $style === 'accent' ? 'cta-section--accent' : 'cta-section--default';
|
||||
?>
|
||||
|
||||
<section class="cta-section <?php echo esc_attr($style_class); ?>">
|
||||
<div class="container">
|
||||
<div class="cta-section-content">
|
||||
<?php if ($title) : ?>
|
||||
<h2 class="cta-section-title"><?php echo esc_html($title); ?></h2>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($text) : ?>
|
||||
<p class="cta-section-text"><?php echo esc_html($text); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($button_text && $button_url) : ?>
|
||||
<a href="<?php echo esc_url($button_url); ?>" class="btn <?php echo $style === 'accent' ? 'btn-primary' : 'btn-secondary'; ?>">
|
||||
<?php echo esc_html($button_text); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,61 @@
|
||||
/**
|
||||
* CTA Section Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.cta-section {
|
||||
padding: 4rem 0;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.cta-section--default {
|
||||
background-color: var(--color-bg-card);
|
||||
}
|
||||
|
||||
.cta-section--accent {
|
||||
background-color: var(--color-accent);
|
||||
|
||||
.cta-section-title {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cta-section-text {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #fff;
|
||||
color: var(--color-accent);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-text);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cta-section-content {
|
||||
text-align: center;
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.cta-section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.cta-section-text {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
<?php
|
||||
/**
|
||||
* Feature Block Component
|
||||
*
|
||||
* @package HomeProz
|
||||
*
|
||||
* Args:
|
||||
* - icon (string): SVG icon name ('local-expertise', 'personalized', 'results')
|
||||
* - title (string): Feature title
|
||||
* - text (string): Feature description
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Get args with defaults
|
||||
$icon = isset($args['icon']) ? $args['icon'] : 'default';
|
||||
$title = isset($args['title']) ? $args['title'] : '';
|
||||
$text = isset($args['text']) ? $args['text'] : '';
|
||||
|
||||
if (!$title) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Define icons
|
||||
$icons = array(
|
||||
'local-expertise' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/>
|
||||
<circle cx="12" cy="10" r="3"/>
|
||||
</svg>',
|
||||
'personalized' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
|
||||
<circle cx="12" cy="7" r="4"/>
|
||||
</svg>',
|
||||
'results' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/>
|
||||
</svg>',
|
||||
'home' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/>
|
||||
<polyline points="9 22 9 12 15 12 15 22"/>
|
||||
</svg>',
|
||||
'handshake' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<path d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z"/>
|
||||
<path d="M8 14s1.5 2 4 2 4-2 4-2"/>
|
||||
<line x1="9" y1="9" x2="9.01" y2="9"/>
|
||||
<line x1="15" y1="9" x2="15.01" y2="9"/>
|
||||
</svg>',
|
||||
'default' => '<svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" aria-hidden="true">
|
||||
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/>
|
||||
</svg>',
|
||||
);
|
||||
|
||||
$icon_svg = isset($icons[$icon]) ? $icons[$icon] : $icons['default'];
|
||||
?>
|
||||
|
||||
<div class="feature-block">
|
||||
<div class="feature-block-icon">
|
||||
<?php echo $icon_svg; ?>
|
||||
</div>
|
||||
<h3 class="feature-block-title"><?php echo esc_html($title); ?></h3>
|
||||
<?php if ($text) : ?>
|
||||
<p class="feature-block-text"><?php echo esc_html($text); ?></p>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
@@ -0,0 +1,80 @@
|
||||
/**
|
||||
* Feature Block Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.feature-block {
|
||||
text-align: center;
|
||||
padding: 1.5rem;
|
||||
}
|
||||
|
||||
.feature-block-icon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin: 0 auto 1.25rem;
|
||||
border-radius: 50%;
|
||||
background-color: var(--color-bg-card);
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
.feature-block-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.feature-block-text {
|
||||
font-size: 0.9375rem;
|
||||
color: var(--color-text-muted);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Features Section (for homepage)
|
||||
.features-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.features-section-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.features-section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.features-section-subtitle {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.features-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 2rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 1.5rem;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
<?php
|
||||
/**
|
||||
* Hero Section Component
|
||||
*
|
||||
* @package HomeProz
|
||||
*
|
||||
* Args:
|
||||
* - title (string): Hero headline
|
||||
* - subtitle (string): Hero subheadline
|
||||
* - primary_cta_text (string): Primary button text
|
||||
* - primary_cta_url (string): Primary button URL
|
||||
* - secondary_cta_text (string): Secondary button text
|
||||
* - secondary_cta_url (string): Secondary button URL
|
||||
* - background_image (string): Background image URL
|
||||
* - size (string): 'large' or 'small' (default: 'large')
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Get args with defaults
|
||||
$title = isset($args['title']) ? $args['title'] : '';
|
||||
$subtitle = isset($args['subtitle']) ? $args['subtitle'] : '';
|
||||
$primary_cta_text = isset($args['primary_cta_text']) ? $args['primary_cta_text'] : '';
|
||||
$primary_cta_url = isset($args['primary_cta_url']) ? $args['primary_cta_url'] : '';
|
||||
$secondary_cta_text = isset($args['secondary_cta_text']) ? $args['secondary_cta_text'] : '';
|
||||
$secondary_cta_url = isset($args['secondary_cta_url']) ? $args['secondary_cta_url'] : '';
|
||||
$background_image = isset($args['background_image']) ? $args['background_image'] : '';
|
||||
$size = isset($args['size']) ? $args['size'] : 'large';
|
||||
|
||||
$size_class = $size === 'small' ? 'hero-section--small' : 'hero-section--large';
|
||||
$style = $background_image ? 'background-image: url(' . esc_url($background_image) . ');' : '';
|
||||
?>
|
||||
|
||||
<section class="hero-section <?php echo esc_attr($size_class); ?>" <?php echo $style ? 'style="' . esc_attr($style) . '"' : ''; ?>>
|
||||
<div class="hero-section-overlay"></div>
|
||||
<div class="container">
|
||||
<div class="hero-section-content">
|
||||
<?php if ($title) : ?>
|
||||
<h1 class="hero-section-title"><?php echo esc_html($title); ?></h1>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($subtitle) : ?>
|
||||
<p class="hero-section-subtitle"><?php echo esc_html($subtitle); ?></p>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($primary_cta_text || $secondary_cta_text) : ?>
|
||||
<div class="hero-section-actions">
|
||||
<?php if ($primary_cta_text && $primary_cta_url) : ?>
|
||||
<a href="<?php echo esc_url($primary_cta_url); ?>" class="btn btn-primary">
|
||||
<?php echo esc_html($primary_cta_text); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if ($secondary_cta_text && $secondary_cta_url) : ?>
|
||||
<a href="<?php echo esc_url($secondary_cta_url); ?>" class="btn btn-secondary">
|
||||
<?php echo esc_html($secondary_cta_text); ?>
|
||||
</a>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,100 @@
|
||||
/**
|
||||
* Hero Section Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.hero-section {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: var(--color-bg-dark);
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&--large {
|
||||
min-height: 70vh;
|
||||
padding: 6rem 0;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
min-height: 60vh;
|
||||
padding: 4rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
&--small {
|
||||
min-height: 30vh;
|
||||
padding: 3rem 0;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
min-height: 25vh;
|
||||
padding: 2rem 0;
|
||||
}
|
||||
|
||||
.hero-section-title {
|
||||
font-size: 2.5rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.hero-section-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(10, 10, 10, 0.7) 0%,
|
||||
rgba(10, 10, 10, 0.85) 100%
|
||||
);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hero-section-content {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.hero-section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 3.5rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1.5rem;
|
||||
line-height: 1.1;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-section-subtitle {
|
||||
font-size: 1.25rem;
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 2rem;
|
||||
max-width: 600px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.125rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.hero-section-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 1rem;
|
||||
justify-content: center;
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
<?php
|
||||
/**
|
||||
* Testimonial Component
|
||||
*
|
||||
* @package HomeProz
|
||||
*
|
||||
* Args:
|
||||
* - quote (string): Testimonial text
|
||||
* - name (string): Client name
|
||||
* - location (string): Client location or transaction type
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
|
||||
// Get args with defaults
|
||||
$quote = isset($args['quote']) ? $args['quote'] : '';
|
||||
$name = isset($args['name']) ? $args['name'] : '';
|
||||
$location = isset($args['location']) ? $args['location'] : '';
|
||||
|
||||
if (!$quote) {
|
||||
return;
|
||||
}
|
||||
?>
|
||||
|
||||
<blockquote class="testimonial">
|
||||
<div class="testimonial-quote">
|
||||
<svg class="testimonial-quote-icon" width="40" height="40" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
||||
<path d="M11.192 15.757c0-.88-.23-1.618-.69-2.217-.326-.412-.768-.683-1.327-.812-.55-.128-1.07-.137-1.54-.028-.16-.95.1-1.956.76-3.022.66-1.065 1.515-1.867 2.558-2.403L9.373 5c-.8.396-1.56.898-2.26 1.505-.71.607-1.34 1.305-1.9 2.094s-.98 1.68-1.25 2.69-.346 2.04-.217 3.1c.168 1.4.62 2.52 1.356 3.35.735.84 1.652 1.26 2.748 1.26.965 0 1.766-.29 2.4-.878.628-.576.94-1.365.94-2.368l.002.003zm9.124 0c0-.88-.23-1.618-.69-2.217-.326-.42-.77-.692-1.327-.817-.56-.124-1.074-.13-1.54-.022-.16-.94.09-1.95.75-3.02.66-1.06 1.514-1.86 2.557-2.4L18.49 5c-.8.396-1.555.898-2.26 1.505-.708.607-1.34 1.305-1.894 2.094-.556.79-.97 1.68-1.24 2.69-.273 1-.345 2.04-.217 3.1.165 1.4.615 2.52 1.35 3.35.732.833 1.646 1.25 2.742 1.25.967 0 1.768-.29 2.402-.876.627-.576.942-1.365.942-2.368v.01z"/>
|
||||
</svg>
|
||||
<p><?php echo esc_html($quote); ?></p>
|
||||
</div>
|
||||
<footer class="testimonial-footer">
|
||||
<?php if ($name) : ?>
|
||||
<cite class="testimonial-name"><?php echo esc_html($name); ?></cite>
|
||||
<?php endif; ?>
|
||||
<?php if ($location) : ?>
|
||||
<span class="testimonial-location"><?php echo esc_html($location); ?></span>
|
||||
<?php endif; ?>
|
||||
</footer>
|
||||
</blockquote>
|
||||
@@ -0,0 +1,111 @@
|
||||
/**
|
||||
* Testimonial Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.testimonial {
|
||||
background-color: var(--color-bg-card);
|
||||
border-radius: 0.5rem;
|
||||
padding: 2rem;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.testimonial-quote {
|
||||
position: relative;
|
||||
margin-bottom: 1.5rem;
|
||||
|
||||
p {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text);
|
||||
line-height: 1.7;
|
||||
font-style: italic;
|
||||
margin: 0;
|
||||
padding-left: 3.5rem;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
font-size: 1rem;
|
||||
padding-left: 0;
|
||||
padding-top: 3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.testimonial-quote-icon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: var(--color-accent);
|
||||
opacity: 0.5;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.testimonial-footer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
padding-left: 3.5rem;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.testimonial-name {
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
font-size: 0.9375rem;
|
||||
}
|
||||
|
||||
.testimonial-location {
|
||||
font-size: 0.8125rem;
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
// Testimonials Section (for homepage)
|
||||
.testimonials-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.testimonials-section-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.testimonials-section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.testimonials-section-subtitle {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.testimonials-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 2rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,135 @@
|
||||
/**
|
||||
* About Page Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.About_Page {
|
||||
.about-page-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Story Section
|
||||
.about-story-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.about-story-content {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
|
||||
h2, h3 {
|
||||
font-family: var(--font-display);
|
||||
color: var(--color-text);
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.125rem;
|
||||
line-height: 1.8;
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
}
|
||||
|
||||
// Values Section
|
||||
.about-values-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.about-values-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.about-values-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Team Section
|
||||
.about-team-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.about-team-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.about-team-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.about-team-subtitle {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.about-team-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 1.5rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
// Broker Section
|
||||
.about-broker-section {
|
||||
padding: 3rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
border-top: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.about-broker-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.about-broker-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.about-broker-text {
|
||||
font-size: 0.9375rem;
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,119 @@
|
||||
/**
|
||||
* Blog Archive Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.Blog_Archive,
|
||||
.Archive_Page {
|
||||
.archive-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Archive Content Section
|
||||
.archive-content-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.archive-layout {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 320px;
|
||||
gap: 3rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Posts Grid
|
||||
.posts-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 1.5rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
// No Posts Message
|
||||
.no-posts-message {
|
||||
text-align: center;
|
||||
padding: 3rem;
|
||||
background-color: var(--color-bg-card);
|
||||
border-radius: 0.5rem;
|
||||
|
||||
h2 {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
p {
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Pagination
|
||||
.navigation.pagination {
|
||||
margin-top: 3rem;
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.page-numbers {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 40px;
|
||||
height: 40px;
|
||||
padding: 0 0.75rem;
|
||||
background-color: var(--color-bg-card);
|
||||
color: var(--color-text-muted);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.current {
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
}
|
||||
|
||||
svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.prev,
|
||||
.next {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Sidebar
|
||||
.archive-sidebar {
|
||||
@media (max-width: 1024px) {
|
||||
max-width: 400px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,226 @@
|
||||
/**
|
||||
* Contact Page Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.Contact_Page {
|
||||
.contact-page-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Contact Section
|
||||
.contact-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.contact-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 3rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Contact Form
|
||||
.contact-form-wrapper {
|
||||
background-color: var(--color-bg-card);
|
||||
padding: 2rem;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.contact-form-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.contact-form-notice {
|
||||
color: var(--color-text-muted);
|
||||
font-style: italic;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.contact-form {
|
||||
.form-group {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
.required {
|
||||
color: var(--color-accent);
|
||||
}
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button[type="submit"] {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Contact Form 7 Overrides
|
||||
.wpcf7-form {
|
||||
.form-group,
|
||||
p {
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="email"],
|
||||
input[type="tel"],
|
||||
textarea {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
width: 100%;
|
||||
margin-top: 0.5rem;
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
padding: 0.75rem 1.5rem;
|
||||
font-weight: 600;
|
||||
font-size: 0.875rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
border-radius: 0.25rem;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-accent-hover);
|
||||
}
|
||||
}
|
||||
|
||||
.wpcf7-response-output {
|
||||
margin: 1rem 0 0;
|
||||
padding: 1rem;
|
||||
border-radius: 0.25rem;
|
||||
}
|
||||
|
||||
.wpcf7-mail-sent-ok {
|
||||
background-color: var(--color-success);
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.wpcf7-validation-errors,
|
||||
.wpcf7-mail-sent-ng {
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Contact Info
|
||||
.contact-info-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.contact-info-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.contact-info-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.contact-info-item {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
.contact-info-icon {
|
||||
flex-shrink: 0;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: var(--color-bg-card);
|
||||
border-radius: 0.5rem;
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
.contact-info-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.contact-info-label {
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.contact-info-value {
|
||||
font-size: 0.9375rem;
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 0;
|
||||
line-height: 1.5;
|
||||
|
||||
a {
|
||||
color: var(--color-text-muted);
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Map
|
||||
.contact-map {
|
||||
border-radius: 0.5rem;
|
||||
overflow: hidden;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
iframe {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
// Additional Content
|
||||
.contact-additional-content {
|
||||
padding: 3rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
.entry-content {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
/**
|
||||
* Homepage Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.Home_Page {
|
||||
.homepage-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Section common styles
|
||||
.section-header {
|
||||
text-align: center;
|
||||
margin-bottom: 3rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 2.25rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 1.875rem;
|
||||
}
|
||||
}
|
||||
|
||||
.section-subtitle {
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text-muted);
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.section-footer {
|
||||
text-align: center;
|
||||
margin-top: 2.5rem;
|
||||
}
|
||||
|
||||
// Featured Properties Section
|
||||
.featured-properties-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.property-grid--3col {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1.5rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.no-properties-message {
|
||||
text-align: center;
|
||||
color: var(--color-text-muted);
|
||||
font-size: 1.125rem;
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
@@ -4,9 +4,85 @@
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.Single_Post {
|
||||
.single-post-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Hero (Featured Image)
|
||||
.single-post-hero {
|
||||
width: 100%;
|
||||
max-height: 60vh;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
// Layout
|
||||
.single-post-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.single-post-layout {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 320px;
|
||||
gap: 3rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 3rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Related Posts
|
||||
.related-posts-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.related-posts-header {
|
||||
text-align: center;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.related-posts-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.875rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.related-posts-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1.5rem;
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.single-post {
|
||||
padding: 2rem 0 4rem;
|
||||
max-width: 800px;
|
||||
padding: 0;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
// Post Header
|
||||
|
||||
@@ -0,0 +1,364 @@
|
||||
/**
|
||||
* Page Template Styles
|
||||
* Styles for full-width, landing, and search templates
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// ============================================
|
||||
// Full Width Template
|
||||
// ============================================
|
||||
|
||||
.full-width-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.full-width-hero {
|
||||
width: 100%;
|
||||
max-height: 50vh;
|
||||
overflow: hidden;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
|
||||
.full-width-content {
|
||||
.page-header {
|
||||
padding: 3rem 0 2rem;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 2.5rem;
|
||||
margin-bottom: 0;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.entry-content--wide {
|
||||
padding-bottom: 4rem;
|
||||
|
||||
// Allow blocks to go full width
|
||||
> .alignfull {
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
> .alignwide {
|
||||
max-width: calc(var(--container-max) + 200px);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// Landing Page Template
|
||||
// ============================================
|
||||
|
||||
.landing-page-site {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.landing-header {
|
||||
padding: 1rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.landing-header-content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.landing-logo {
|
||||
display: inline-block;
|
||||
|
||||
.custom-logo {
|
||||
max-height: 40px;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.site-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.landing-main {
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.landing-content {
|
||||
.entry-content {
|
||||
// Full control from block editor
|
||||
> *:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
> .alignfull {
|
||||
max-width: none;
|
||||
width: 100vw;
|
||||
margin-left: calc(-50vw + 50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.landing-footer {
|
||||
padding: 1.5rem 0;
|
||||
background-color: var(--color-bg-card);
|
||||
border-top: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
.landing-footer-text {
|
||||
text-align: center;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-muted);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.landing-footer-links {
|
||||
display: inline-block;
|
||||
margin-left: 1rem;
|
||||
padding-left: 1rem;
|
||||
border-left: 1px solid var(--color-border);
|
||||
|
||||
a {
|
||||
color: var(--color-text-muted);
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ============================================
|
||||
// Search Template
|
||||
// ============================================
|
||||
|
||||
.Search_Page {
|
||||
.search-main {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.search-content-section {
|
||||
padding: 4rem 0;
|
||||
background-color: var(--color-bg-dark);
|
||||
|
||||
@media (max-width: 768px) {
|
||||
padding: 3rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.search-form-wrapper {
|
||||
max-width: 600px;
|
||||
margin: 0 auto 2rem;
|
||||
|
||||
.search-form {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.search-field {
|
||||
flex: 1;
|
||||
padding: 1rem 1.25rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.search-submit {
|
||||
padding: 1rem 1.5rem;
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0.25rem;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-accent-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-results-count {
|
||||
text-align: center;
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.search-results {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.search-result-item {
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
padding: 1.5rem;
|
||||
background-color: var(--color-bg-card);
|
||||
border-radius: 0.5rem;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-image {
|
||||
flex-shrink: 0;
|
||||
|
||||
img {
|
||||
width: 120px;
|
||||
height: 90px;
|
||||
object-fit: cover;
|
||||
border-radius: 0.25rem;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-content {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.search-result-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
margin-bottom: 0.5rem;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
|
||||
.search-result-type {
|
||||
display: inline-block;
|
||||
padding: 0.125rem 0.5rem;
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.6875rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.search-result-date {
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
|
||||
.search-result-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.25rem;
|
||||
margin-bottom: 0.5rem;
|
||||
|
||||
a {
|
||||
color: var(--color-text);
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-excerpt {
|
||||
font-size: 0.9375rem;
|
||||
color: var(--color-text-muted);
|
||||
line-height: 1.6;
|
||||
margin-bottom: 0.75rem;
|
||||
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.search-result-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-accent-light);
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-hover);
|
||||
}
|
||||
}
|
||||
|
||||
// No Results
|
||||
.no-results-message {
|
||||
text-align: center;
|
||||
padding: 3rem;
|
||||
background-color: var(--color-bg-card);
|
||||
border-radius: 0.5rem;
|
||||
max-width: 500px;
|
||||
margin: 0 auto;
|
||||
|
||||
h2 {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.5rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
p {
|
||||
color: var(--color-text-muted);
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.no-results-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
// Pagination
|
||||
.navigation.pagination {
|
||||
margin-top: 3rem;
|
||||
max-width: 800px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.page-numbers {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-width: 40px;
|
||||
height: 40px;
|
||||
padding: 0 0.75rem;
|
||||
background-color: var(--color-bg-card);
|
||||
color: var(--color-text-muted);
|
||||
border-radius: 0.25rem;
|
||||
font-size: 0.875rem;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
}
|
||||
|
||||
&.current {
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,84 @@
|
||||
<?php
|
||||
/**
|
||||
* Blog Sidebar Template Part
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
// Prevent direct access
|
||||
if (!defined('ABSPATH')) {
|
||||
exit;
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="sidebar-widgets">
|
||||
<!-- Search Widget -->
|
||||
<div class="sidebar-widget widget-search">
|
||||
<h3 class="widget-title">Search</h3>
|
||||
<?php get_search_form(); ?>
|
||||
</div>
|
||||
|
||||
<!-- Categories Widget -->
|
||||
<?php
|
||||
$categories = get_categories(array(
|
||||
'orderby' => 'count',
|
||||
'order' => 'DESC',
|
||||
'number' => 10,
|
||||
'hide_empty' => true,
|
||||
));
|
||||
|
||||
if ($categories) :
|
||||
?>
|
||||
<div class="sidebar-widget widget-categories">
|
||||
<h3 class="widget-title">Categories</h3>
|
||||
<ul class="category-list">
|
||||
<?php foreach ($categories as $category) : ?>
|
||||
<li>
|
||||
<a href="<?php echo esc_url(get_category_link($category->term_id)); ?>">
|
||||
<?php echo esc_html($category->name); ?>
|
||||
<span class="count">(<?php echo esc_html($category->count); ?>)</span>
|
||||
</a>
|
||||
</li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- Recent Posts Widget -->
|
||||
<?php
|
||||
$recent_posts = new WP_Query(array(
|
||||
'posts_per_page' => 5,
|
||||
'post_status' => 'publish',
|
||||
'ignore_sticky_posts' => true,
|
||||
));
|
||||
|
||||
if ($recent_posts->have_posts()) :
|
||||
?>
|
||||
<div class="sidebar-widget widget-recent-posts">
|
||||
<h3 class="widget-title">Recent Posts</h3>
|
||||
<ul class="recent-posts-list">
|
||||
<?php
|
||||
while ($recent_posts->have_posts()) :
|
||||
$recent_posts->the_post();
|
||||
?>
|
||||
<li>
|
||||
<a href="<?php the_permalink(); ?>">
|
||||
<?php the_title(); ?>
|
||||
</a>
|
||||
<span class="post-date"><?php echo esc_html(get_the_date()); ?></span>
|
||||
</li>
|
||||
<?php endwhile; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php
|
||||
wp_reset_postdata();
|
||||
endif;
|
||||
?>
|
||||
|
||||
<!-- Contact CTA Widget -->
|
||||
<div class="sidebar-widget widget-cta">
|
||||
<h3 class="widget-title">Need Help?</h3>
|
||||
<p>Have questions about buying or selling? We're here to help!</p>
|
||||
<a href="<?php echo esc_url(home_url('/contact/')); ?>" class="btn btn-primary btn-small">Contact Us</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,153 @@
|
||||
/**
|
||||
* Blog Sidebar Styles
|
||||
*
|
||||
* @package HomeProz
|
||||
*/
|
||||
|
||||
.sidebar-widgets {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.sidebar-widget {
|
||||
background-color: var(--color-bg-card);
|
||||
padding: 1.5rem;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.widget-title {
|
||||
font-family: var(--font-display);
|
||||
font-size: 1.125rem;
|
||||
color: var(--color-text);
|
||||
margin-bottom: 1rem;
|
||||
padding-bottom: 0.75rem;
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
// Search Widget
|
||||
.widget-search {
|
||||
.search-form {
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.search-field {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.search-submit {
|
||||
flex-shrink: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
background-color: var(--color-accent);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 0.25rem;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-accent-hover);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Categories Widget
|
||||
.category-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
padding: 0.5rem 0;
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: var(--color-text-muted);
|
||||
font-size: 0.9375rem;
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
}
|
||||
|
||||
.count {
|
||||
font-size: 0.8125rem;
|
||||
color: var(--color-sold);
|
||||
}
|
||||
}
|
||||
|
||||
// Recent Posts Widget
|
||||
.recent-posts-list {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
padding: 0.75rem 0;
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
color: var(--color-text);
|
||||
font-size: 0.9375rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 0.25rem;
|
||||
|
||||
&:hover {
|
||||
color: var(--color-accent-light);
|
||||
}
|
||||
}
|
||||
|
||||
.post-date {
|
||||
display: block;
|
||||
font-size: 0.8125rem;
|
||||
color: var(--color-sold);
|
||||
}
|
||||
}
|
||||
|
||||
// CTA Widget
|
||||
.widget-cta {
|
||||
background-color: var(--color-accent);
|
||||
text-align: center;
|
||||
|
||||
.widget-title {
|
||||
color: #fff;
|
||||
border-bottom-color: rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
|
||||
p {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 0.9375rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #fff;
|
||||
color: var(--color-accent);
|
||||
|
||||
&:hover {
|
||||
background-color: var(--color-text);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-small {
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 0.8125rem;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user