Update root RMO to use banner and new colored icon
This commit is contained in:
parent
40028744ba
commit
7fb02f4788
5 changed files with 47 additions and 112 deletions
|
|
@ -2,40 +2,6 @@
|
|||
|
||||
{{define "title"}}Main{{end}}
|
||||
{{define "extraheader"}}
|
||||
<style>
|
||||
.service-card {
|
||||
transition: transform 0.3s;
|
||||
height: 100%;
|
||||
}
|
||||
.service-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 10px 20px rgba(0,0,0,0.1);
|
||||
}
|
||||
.district-logo {
|
||||
max-height: 80px;
|
||||
width: auto;
|
||||
}
|
||||
.quick-report-mobile {
|
||||
background-color: #ff9800;
|
||||
}
|
||||
.quick-report-desktop {
|
||||
background-color: #ffefd5;
|
||||
border-left: 4px solid #ff9800;
|
||||
}
|
||||
|
||||
.banner-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background-color: #F76436;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.banner-image {
|
||||
display: block;
|
||||
/* width as needed */
|
||||
}
|
||||
|
||||
</style>
|
||||
{{end}}
|
||||
{{define "content"}}
|
||||
<!-- Main Content -->
|
||||
|
|
|
|||
|
|
@ -2,57 +2,14 @@
|
|||
|
||||
{{define "title"}}Main{{end}}
|
||||
{{define "extraheader"}}
|
||||
<style>
|
||||
.service-card {
|
||||
transition: transform 0.3s;
|
||||
height: 100%;
|
||||
}
|
||||
.service-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 10px 20px rgba(0,0,0,0.1);
|
||||
}
|
||||
.district-logo {
|
||||
max-height: 80px;
|
||||
width: auto;
|
||||
}
|
||||
.quick-report-mobile {
|
||||
background-color: #ff9800;
|
||||
}
|
||||
.quick-report-desktop {
|
||||
background-color: #ffefd5;
|
||||
border-left: 4px solid #ff9800;
|
||||
}
|
||||
</style>
|
||||
{{end}}
|
||||
{{define "content"}}
|
||||
<!-- Main Content -->
|
||||
<main>
|
||||
<!-- Introduction Section -->
|
||||
<section class="py-5 bg-primary text-white">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-10">
|
||||
<h2 class="text-center mb-4">Report Mosquitoes Online</h2>
|
||||
<p class="lead text-center">
|
||||
We are dedicated to protecting public health and improving quality of life by reducing
|
||||
mosquito populations and the diseases they can carry. Our districts provide comprehensive
|
||||
mosquito surveillance, control, and education services to our community.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</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="/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 class="banner-container">
|
||||
<img class="banner-image" src="/static/img/rmo/banner.jpg"/>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
@ -61,67 +18,45 @@
|
|||
<div class="container">
|
||||
<h3 class="text-center mb-4">How Can We Help You Today?</h3>
|
||||
<div class="row g-4">
|
||||
<!-- Service Option 1 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card service-card h-100">
|
||||
<div class="card-body text-center">
|
||||
<div class="mb-3">
|
||||
{{ template "mosquito.svg" }}
|
||||
{{ template "mosquito-color.svg" }}
|
||||
</div>
|
||||
<h4 class="card-title">Follow-up or Check Status</h4>
|
||||
<p class="card-text">Check on a previous request or view current mosquito activity in your area.</p>
|
||||
<a href="/status" class="btn btn-primary mt-3">Get Status</a>
|
||||
<h4 class="card-title">Report Mosquito Nuisance</h4>
|
||||
<p class="card-text">Report areas with high adult mosquito activity causing discomfort or concern.</p>
|
||||
<a href="{{ .URL.Nuisance }}" class="btn btn-primary mt-3">Report Problem</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Service Option 2 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card service-card h-100">
|
||||
<div class="card-body text-center">
|
||||
<div class="mb-3">
|
||||
{{ template "pond.svg" }}
|
||||
</div>
|
||||
<h4 class="card-title">Report a Green Pool</h4>
|
||||
<p class="card-text">Report stagnant water sources like abandoned pools that may breed mosquitoes.</p>
|
||||
<a href="/pool" class="btn btn-primary mt-3">Report Source</a>
|
||||
<h4 class="card-title">Report Standing Water</h4>
|
||||
<p class="card-text">Report any water that has been sitting for several days, where mosquitoes can live.</p>
|
||||
<a href="{{ .URL.Water }}" class="btn btn-primary mt-3">Report Source</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Service Option 3 -->
|
||||
<div class="col-md-4">
|
||||
<div class="card service-card h-100">
|
||||
<div class="card-body text-center">
|
||||
<div class="mb-3">
|
||||
{{ template "check-report.svg" }}
|
||||
</div>
|
||||
<h4 class="card-title">Report Mosquito Nuisance</h4>
|
||||
<p class="card-text">Report areas with high adult mosquito activity causing discomfort or concern.</p>
|
||||
<a href="/nuisance" class="btn btn-primary mt-3">Report Problem</a>
|
||||
<h4 class="card-title">Follow-up or Check Status</h4>
|
||||
<p class="card-text">Check on a previous request or view current mosquito activity in your area.</p>
|
||||
<a href="{{ .URL.Status }}" class="btn btn-primary mt-3">Get Status</a>
|
||||
</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="/quick" class="btn btn-warning">Quick Report</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
|
|
|||
1
rmo/template/svg/mosquito-color.svg
Normal file
1
rmo/template/svg/mosquito-color.svg
Normal file
|
|
@ -0,0 +1 @@
|
|||
<svg height="48" viewBox="0 0 512.003 512.003" width="48" xmlns="http://www.w3.org/2000/svg"><g fill="#5e240d"><path d="M256.001 7.501a7.5 7.5 0 0 0-7.5 7.5v108.071h15V15.001c0-4.143-3.357-7.5-7.5-7.5m228.355 453.863c-36.728-18.363-67.156-48.534-85.854-85.081v-73.211c0-1.989-.79-3.896-2.196-5.304l-105-105-10.607 10.607 102.804 102.803v71.894c0 1.164.271 2.313.792 3.354 20.066 40.133 53.221 73.287 93.354 93.354a7.502 7.502 0 1 0 6.707-13.416"/><path d="M439.356 497.793c-36.727-18.363-67.155-48.534-85.854-85.081v-88.211a7.5 7.5 0 0 0-1.267-4.17l-63.522-94.961-12.467 8.34 62.256 93.068v87.723c0 1.164.271 2.313.792 3.354 20.067 40.134 53.221 73.287 93.354 93.354a7.502 7.502 0 0 0 6.708-13.416M420.667 4.146A7.5 7.5 0 0 0 410.604.792c-31.179 15.589-55.838 40.188-71.312 71.135a7.5 7.5 0 0 0-.792 3.354v59.684l-57.804 57.803 10.607 10.607 60-60a7.5 7.5 0 0 0 2.196-5.304V77.076c14.054-27.29 36.085-49.003 63.813-62.867a7.5 7.5 0 0 0 3.355-10.063M27.647 461.364c36.728-18.363 67.156-48.534 85.854-85.081v-73.211c0-1.989.79-3.896 2.196-5.304l105-105 10.607 10.607-102.803 102.803v71.894a7.5 7.5 0 0 1-.792 3.354c-20.066 40.133-53.221 73.287-93.354 93.354a7.502 7.502 0 0 1-6.708-13.416"/><path d="M72.647 497.793c36.727-18.363 67.155-48.534 85.854-85.081v-88.211a7.5 7.5 0 0 1 1.267-4.17l63.522-94.961 12.467 8.34-62.256 93.068v87.723a7.5 7.5 0 0 1-.792 3.354c-20.067 40.134-53.221 73.287-93.354 93.354a7.502 7.502 0 0 1-6.708-13.416M91.335 4.146A7.5 7.5 0 0 1 101.398.792c31.179 15.589 55.838 40.188 71.312 71.135a7.5 7.5 0 0 1 .792 3.354v59.684l57.804 57.803-10.607 10.607-60-60a7.5 7.5 0 0 1-2.196-5.304V77.076c-14.054-27.29-36.085-49.003-63.813-62.867a7.5 7.5 0 0 1-3.355-10.063"/></g><path d="m285.897 124.489-29.896-23.917-7.5 75 24.738-15c11.19 0 20.262-9.071 20.262-20.261a20.26 20.26 0 0 0-7.604-15.822" fill="#7d3214"/><path d="M263.501 140.31c0-6.155-.56-11.977-1.521-15.822l-5.979-23.917-29.896 23.917a20.26 20.26 0 0 0-7.604 15.822c0 11.19 9.072 20.262 20.262 20.262l9.738 15 10.948-15c2.238 0 4.052-9.071 4.052-20.262" fill="#963e1c"/><path d="M30.001 183.072c-12.426 0-22.5 10.074-22.5 22.5s10.074 22.5 22.5 22.5h100.327c8.756 0 17.485-.958 26.032-2.857l54.641-12.143 30-30z" fill="#b6f1fb"/><path d="M482.001 183.072h-30v45h30c12.426 0 22.5-10.073 22.5-22.5s-10.074-22.5-22.5-22.5" fill="#6ee2f6"/><path d="M474.501 205.572c0-12.426-10.074-22.5-22.5-22.5h-196l45 30 54.641 12.143a120 120 0 0 0 26.032 2.857h70.327c12.426 0 22.5-10.074 22.5-22.5" fill="#b6f1fb"/><path d="M278.501 369.501v22.5c0 12.43-10.07 22.5-22.5 22.5s-22.5-10.07-22.5-22.5v-22.5l22.5-15z" fill="#ff9a42"/><path d="M278.501 339.501v30h-45v-30l22.5-15z" fill="#ffd185"/><path d="M278.501 309.501v30h-45v-30l22.5-15z" fill="#ff9a42"/><path d="M233.501 259.451h45v50.05h-45z" fill="#ffd185"/><path d="M278.501 160.572h-30l6.903 118.925c25.126.326 45.597-19.944 45.597-44.996v-51.429c0-12.426-10.074-22.5-22.5-22.5" fill="#963e1c"/><path d="M271.001 234.501v-51.429c0-12.426-10.074-22.5-22.5-22.5h-15c-12.426 0-22.5 10.074-22.5 22.5v50.758c0 24.731 19.673 45.346 44.403 45.667 8.595.326 15.597-19.945 15.597-44.996" fill="#c24623"/></svg>
|
||||
|
After Width: | Height: | Size: 3 KiB |
Loading…
Add table
Add a link
Reference in a new issue