Remove all font-awesome fonts from RMO

This makes it possible to remove that dependency.
This commit is contained in:
Eli Ribble 2026-02-06 15:43:03 +00:00
parent e001d23457
commit a82509bebb
No known key found for this signature in database
6 changed files with 14 additions and 198 deletions

View file

@ -13,7 +13,6 @@ var (
mockNuisanceT = buildTemplate("mock/nuisance", "base")
mockNuisanceSubmitCompleteT = buildTemplate("mock/nuisance-submit-complete", "base")
mockRootT = buildTemplate("mock/root", "base")
mockStatusT = buildTemplate("mock/status", "base")
mockWaterT = buildTemplate("mock/water", "base")
)
@ -29,17 +28,14 @@ func addMockRoutes(r chi.Router) {
r.Get("/district/{slug}", renderMock(mockDistrictRootT))
r.Get("/district/{slug}/nuisance", renderMock(mockNuisanceT))
r.Get("/district/{slug}/nuisance-submit-complete", renderMock(mockNuisanceSubmitCompleteT))
r.Get("/district/{slug}/status", renderMock(mockStatusT))
r.Get("/district/{slug}/water", renderMock(mockWaterT))
r.Get("/nuisance", renderMock(mockNuisanceT))
r.Get("/nuisance-submit-complete", renderMock(mockNuisanceSubmitCompleteT))
r.Get("/status", renderMock(mockStatusT))
}
func makeContentURLMock(slug string) ContentURL {
return ContentURL{
Nuisance: makeURLMock(slug, "nuisance"),
Status: makeURLMock(slug, "status"),
SubmitComplete: makeURLMock(slug, "nuisance-submit-complete"),
Tegola: config.MakeURLTegola("/"),
Water: makeURLMock(slug, "water"),

View file

@ -8,8 +8,6 @@
<link href="/static/css/bootstrap.css" rel="stylesheet">
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<!-- Fontawesome Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<!-- favicon -->
<link rel="icon" href="/static/favicon-rmo.ico" type="image/x-icon"/>
{{block "extraheader" .}} {{end}}

View file

@ -1,178 +0,0 @@
{{template "base.html" .}}
{{define "title"}}Status{{end}}
{{define "extraheader"}}
<script src='https://api.mapbox.com/mapbox-gl-js/v3.17.0-beta.1/mapbox-gl.js'></script>
<script src="/static/js/geocode.js"></script>
<script src="/static/js/location.js"></script>
<script src="/static/js/map-multipoint.js"></script>
<script src="/static/js/report-table.js"></script>
<style>
</style>
<script>
const MAPBOX_ACCESS_TOKEN = '{{.MapboxToken}}';
var markers = [];
// Because features come from tiled vector data, feature geometries may be split
// or duplicated across tile boundaries. As a result, features may appear
// multiple times in query results.
function getUniqueFeatures(features, comparatorProperty) {
const uniqueIds = new Set();
const uniqueFeatures = [];
for (const feature of features) {
const id = feature.properties[comparatorProperty];
if (!uniqueIds.has(id)) {
uniqueIds.add(id);
uniqueFeatures.push(feature);
}
}
return uniqueFeatures;
}
function renderReports(features) {
console.log("render reports", features);
const report_table = document.querySelector('report-table');
let reports = [];
for (const feature of features) {
reports.push({
address: feature.properties.address,
created: feature.properties.created,
id: feature.properties.public_id,
status: feature.properties.status,
type: feature.properties.table_name
});
}
report_table.reports = reports;
}
function onLoad() {
const map = document.querySelector("map-multipoint");
map.addEventListener("load", (event) => {
map.addSource('tegola-mosquito', {
'type': 'vector',
'tiles': [
'{{.URL.Tegola}}maps/mosquito/{z}/{x}/{y}'
]
});
map.addLayer({
'id': 'mosquito',
'source': 'tegola-mosquito',
'source-layer': 'report_location',
'type': 'circle',
'paint': {
'circle-color': '#4264fb',
'circle-radius': 7,
'circle-stroke-width': 2,
'circle-stroke-color': '#ffffff'
}
});
map.on('render', () => {
const features = map.queryRenderedFeatures({target: {layerId: 'mosquito'}});
if (features) {
const uniqueFeatures = getUniqueFeatures(features, 'public_id');
// Populate features for the listing overlay.
renderReports(uniqueFeatures);
}
});
getGeolocation({
enableHighAccuracy: true,
timeout: 10000,
maximumAge: 0
}).then(position => {
map.jumpTo({
center: {
lng: position.coords.longitude,
lat: position.coords.latitude,
},
zoom: 14,
});
}).catch(error => {
console.log("location error", error);
})
});
}
document.addEventListener('DOMContentLoaded', onLoad);
</script>
{{end}}
{{define "content"}}
{{if .District}}
{{template "header" .}}
{{end}}
<div class="container my-4">
<!-- Search Box -->
<div class="card search-box mb-4">
<div class="card-body">
<form class="row g-3 align-items-center">
<div class="col-md-9">
<label for="addressSearch" class="visually-hidden">Search by address</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-search"></i></span>
<input type="text" class="form-control form-control-lg" id="addressSearch"
placeholder="Enter a report ID, address, neighborhood, or zip code">
</div>
</div>
<div class="col-md-3">
<button type="submit" class="btn btn-primary btn-lg w-100">Search</button>
</div>
<div class="col-12">
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="mosquitoNuisance" checked>
<label class="form-check-label" for="mosquitoNuisance">Mosquito Nuisance</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input" type="checkbox" id="stagnantWater" checked>
<label class="form-check-label" for="gWaterreenPool">Stagnant Water</label>
</div>
</div>
</form>
</div>
</div>
<!-- Map Section -->
<div class="card mb-4">
<div class="card-header bg-info text-white">
<h5 class="mb-0"><i class="fas fa-map-marked-alt me-2"></i>Reports Map</h5>
</div>
<div class="card-body p-0">
<map-multipoint
api-key="{{ .MapboxToken }}"
latitude="36.3"
longitude="-119.2"
tegola="{{.URL.Tegola}}"
zoom="9"
/></map-multipoint>
</div>
</div>
<!-- Results Section -->
<div class="card">
<div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
<h5 class="mb-0"><i class="fas fa-list me-2"></i>Reports Near You</h5>
<span class="badge bg-light text-dark">15 Reports Found</span>
</div>
<div class="card-body p-0">
<div class="table-responsive">
<report-table />
</div>
</div>
<!--
<div class="card-footer">
<nav aria-label="Page navigation">
<ul class="pagination justify-content-center mb-0">
<li class="page-item disabled">
<a class="page-link" href="#" tabindex="-1" aria-disabled="true">Previous</a>
</li>
<li class="page-item active"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item">
<a class="page-link" href="#">Next</a>
</li>
</ul>
</nav>
</div>
-->
</div>
</div>
{{end}}

View file

@ -134,7 +134,7 @@ document.addEventListener('DOMContentLoaded', onLoad);
<div class="col-md-9">
<label for="addressSearch" class="visually-hidden">Search by address</label>
<div class="input-group">
<span class="input-group-text"><i class="fas fa-search"></i></span>
<span class="input-group-text"><i class="bi bi-search"></i></span>
<input type="text" class="form-control form-control-lg" id="addressSearch"
placeholder="Enter an address, neighborhood, or zip code">
</div>
@ -163,7 +163,7 @@ document.addEventListener('DOMContentLoaded', onLoad);
<!-- Map Section -->
<div class="card mb-4">
<div class="card-header bg-info text-white">
<h5 class="mb-0"><i class="fas fa-map-marked-alt me-2"></i>Reports Map</h5>
<h5 class="mb-0"><i class="bi bi-pin-map-fill me-2"></i>Reports Map</h5>
</div>
<div class="card-body p-0">
<map-multipoint
@ -179,7 +179,7 @@ document.addEventListener('DOMContentLoaded', onLoad);
<!-- Results Section -->
<div class="card">
<div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
<h5 class="mb-0"><i class="fas fa-list me-2"></i>Reports Near You</h5>
<h5 class="mb-0"><i class="bi bi-list-ol me-2"></i>Reports Near You</h5>
<span class="badge bg-light text-dark">15 Reports Found</span>
</div>
<div class="card-body p-0">
@ -209,14 +209,14 @@ document.addEventListener('DOMContentLoaded', onLoad);
<!-- Create Report Button (Fixed at bottom on mobile) -->
<div class="d-md-none position-fixed bottom-0 start-0 end-0 p-3" style="z-index: 1030;">
<button class="btn btn-primary btn-lg w-100" data-bs-toggle="modal" data-bs-target="#reportModal">
<i class="fas fa-plus-circle me-2"></i>Create New Report
<i class="bi bi-plus-circle-fill me-2"></i>Create New Report
</button>
</div>
<!-- Desktop Create Report Button -->
<div class="d-none d-md-block text-center mt-4">
<button class="btn btn-primary btn-lg" data-bs-toggle="modal" data-bs-target="#reportModal">
<i class="fas fa-plus-circle me-2"></i>Create New Report
<i class="bi bi-plus-circle-fill me-2"></i>Create New Report
</button>
</div>
</div>

View file

@ -71,27 +71,27 @@ document.addEventListener("DOMContentLoaded", onLoad);
<div class="card-body">
<div class="row">
<div class="col-md-4 mb-3">
<strong><i class="fas fa-sync me-2"></i>Type:</strong>
<strong><i class="bi bi-tag me-2"></i>Type:</strong>
<span>{{.Report.Type}}</span>
</div>
<div class="col-md-4 mb-3">
<strong><i class="fas fa-calendar-plus me-2"></i>Created:</strong>
<strong><i class="bi bi-calendar me-2"></i>Created:</strong>
<span>{{.Report.Created|timeSince}}</span>
</div>
<div class="col-md-4 mb-3">
<strong><i class="fas fa-hourglass-half me-2"></i>District:</strong>
<strong><i class="bi bi-crosshair me-2"></i>District:</strong>
<span>{{if (eq .District nil)}}Unknown{{else}}{{.District.Name}}{{end}}</span>
</div>
</div>
<div class="row">
<div class="col-md-12">
<strong><i class="fas fa-map-marked-alt me-2"></i>Location:</strong>
<strong><i class="bi bi-pin-map me-2"></i>Location:</strong>
<span>{{.Report.Address}}</span>
</div>
</div>
<div class="row">
<div class="col-md-12">
<strong><i class="fas fa-images me-2"></i>Images:</strong>
<strong><i class="bi bi-images me-2"></i>Images:</strong>
<span>{{ if gt .Report.ImageCount 0 }}{{.Report.ImageCount}}{{else}}None provided{{end}}</span>
</div>
@ -112,7 +112,7 @@ document.addEventListener("DOMContentLoaded", onLoad);
<!-- Map Section -->
<div class="card mb-4">
<div class="card-header bg-info text-white">
<h5 class="mb-0"><i class="fas fa-map-marked-alt me-2"></i>Location Map</h5>
<h5 class="mb-0"><i class="bi bi-pin-map-fill me-2"></i>Location Map</h5>
</div>
<div class="card-body p-0">
<map-with-markers
@ -124,7 +124,7 @@ document.addEventListener("DOMContentLoaded", onLoad);
<!-- History Timeline -->
<div class="card">
<div class="card-header bg-success text-white">
<h5 class="mb-0"><i class="fas fa-history me-2"></i>Request History</h5>
<h5 class="mb-0"><i class="bi bi-clock-history me-2"></i>Request History</h5>
</div>
<div class="card-body">
<div class="timeline">

View file

@ -201,7 +201,7 @@ document.addEventListener('DOMContentLoaded', onLoad);
<!-- Map Section -->
<div class="card mb-4">
<div class="card-header bg-info text-white">
<h5 class="mb-0"><i class="fas fa-map-marked-alt me-2"></i>Reports Map</h5>
<h5 class="mb-0"><i class="bi bi-pin-map-fill me-2"></i>Reports Map</h5>
</div>
<div class="card-body p-0">
<map-multipoint
@ -217,7 +217,7 @@ document.addEventListener('DOMContentLoaded', onLoad);
<!-- Results Section -->
<div class="card">
<div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
<h5 class="mb-0"><i class="fas fa-list me-2"></i>Reports Near You</h5>
<h5 class="mb-0"><i class="bi bi-geo-fill me-2"></i>Reports Near You</h5>
<span class="badge bg-light text-dark" id="report-count">- Reports Found</span>
</div>
<div class="card-body p-0">