Single property: Fixed contact sidebar, full-width content area

This commit is contained in:
Hanson.xyz Dev
2025-11-28 17:29:29 -06:00
parent e72097c3a5
commit dd006f51dc
4 changed files with 143 additions and 144 deletions
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -62,9 +62,13 @@ while (have_posts()) :
</div>
</nav>
<!-- Fixed Sidebar -->
<aside class="single-property-sidebar">
<?php get_template_part('template-parts/property/property-agent', null, array('agent' => $listing_agent, 'property_id' => $property_id)); ?>
</aside>
<div class="container">
<div class="single-property-layout">
<!-- Main Content -->
<!-- Main Content (full width) -->
<div class="single-property-content">
<!-- Gallery -->
<?php get_template_part('template-parts/property/property-gallery', null, array('gallery' => $gallery, 'property_id' => $property_id)); ?>
@@ -191,12 +195,6 @@ while (have_posts()) :
</section>
<?php endif; ?>
</div>
<!-- Sidebar -->
<aside class="single-property-sidebar">
<?php get_template_part('template-parts/property/property-agent', null, array('agent' => $listing_agent, 'property_id' => $property_id)); ?>
</aside>
</div>
</div>
</main>
@@ -51,16 +51,8 @@
padding-bottom: 4rem;
}
.single-property-layout {
display: grid;
grid-template-columns: 1fr;
gap: 2rem;
.single-property-content {
padding-top: 2rem;
@media (min-width: 1024px) {
grid-template-columns: 1fr 350px;
gap: 3rem;
}
}
// Property Header
@@ -208,12 +200,21 @@
}
}
// Sidebar
// Fixed Sidebar
.single-property-sidebar {
display: none;
@media (min-width: 1024px) {
position: sticky;
top: 100px;
align-self: start;
display: block;
position: fixed;
top: 120px;
right: 2rem;
width: 320px;
z-index: 100;
}
@media (min-width: 1280px) {
right: calc((100vw - 1200px) / 2);
}
}