Add a quick report link which shows at the top on mobile
This commit is contained in:
parent
31ca1a2f45
commit
d19c3fe265
1 changed files with 40 additions and 0 deletions
|
|
@ -14,6 +14,13 @@
|
||||||
max-height: 80px;
|
max-height: 80px;
|
||||||
width: auto;
|
width: auto;
|
||||||
}
|
}
|
||||||
|
.quick-report-mobile {
|
||||||
|
background-color: #ff9800;
|
||||||
|
}
|
||||||
|
.quick-report-desktop {
|
||||||
|
background-color: #ffefd5;
|
||||||
|
border-left: 4px solid #ff9800;
|
||||||
|
}
|
||||||
{{end}}
|
{{end}}
|
||||||
{{define "content"}}
|
{{define "content"}}
|
||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
|
|
@ -48,6 +55,19 @@
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Quick Report for Mobile - Only visible on small screens -->
|
||||||
|
<section class="py-3 quick-report-mobile d-md-none">
|
||||||
|
<div class="container">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12 text-center">
|
||||||
|
<h4 class="mb-2">On the go?</h4>
|
||||||
|
<a href="/service-request-quick" class="btn btn-dark btn-lg">Make a Quick Report</a>
|
||||||
|
<p class="mb-0 mt-2"><small>Report mosquito issues in under 60 seconds</small></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<!-- Services Section -->
|
<!-- Services Section -->
|
||||||
<section class="py-5">
|
<section class="py-5">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
@ -101,6 +121,25 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Quick Report for Desktop - Only visible on medium screens and up -->
|
||||||
|
<div class="row mt-4 d-none d-md-block">
|
||||||
|
<div class="col-12">
|
||||||
|
<div class="card quick-report-desktop">
|
||||||
|
<div class="card-body py-3">
|
||||||
|
<div class="row align-items-center">
|
||||||
|
<div class="col-md-8">
|
||||||
|
<h5 class="mb-1">Need to make a quick report?</h5>
|
||||||
|
<p class="mb-0">Use our streamlined form to report mosquito issues in under 60 seconds</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-md-4 text-md-end mt-3 mt-md-0">
|
||||||
|
<a href="/service-request-quick" class="btn btn-warning">Quick Report</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
|
|
@ -118,4 +157,5 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue