w1cdn/spothole
1
0
Fork 0
mirror of https://git.ianrenton.com/ian/spothole.git synced 2025-10-27 16:59:25 +00:00
Code Issues 11 Packages Projects Releases Wiki Activity

Compare commits

base: w1cdn:1bad16f478d6b2d706129c88f3bde2335177b806
Branches Tags
w1cdn:main w1cdn:44-container-full-width-on-mobile
...
compare: w1cdn:44-container-full-width-on-mobile
Branches Tags
w1cdn:main w1cdn:44-container-full-width-on-mobile

1 Commits
1bad16f478 ... 44-contain

Author SHA1 Message Date
Ian Renton
885b832661 Container full width on mobile attempt 1 #44 2025-10-17 10:52:00 +01:00
8 changed files with 480 additions and 461 deletions
Expand all files Collapse all files

4
views/webpage_about.tpl
View File

@@ -1,6 +1,7 @@
% rebase('webpage_base.tpl')
<div id="info-container" class="mt-4">
<div class="container main-container">
<div id="info-container" class="mt-4">
<h2 class="mt-4 mb-4">About Spothole</h2>
<p>Spothole is a utility to aggregate "spots" from amateur radio DX clusters and xOTA spotting sites, and provide an open JSON API as well as a website to browse the data.</p>
<p>While there are several other web-based interfaces to DX clusters, and sites that aggregate spots from various outdoor activity programmes for amateur radio, Spothole differentiates itself by supporting a large number of data sources, and by being "API first" rather than just providing a web front-end. This allows other software to be built on top of it.</p>
@@ -31,6 +32,7 @@
<p>Settings you select from Spothole's menus are sent to the server, in order to provide the data with the requested filters. They are also stored in your browser's local storage, so that your preferences are remembered between sessions.</p>
<p>There are no trackers, no ads, and no cookies.</p>
<p>Spothole is open source, so you can audit <a href="https://git.ianrenton.com/ian/spothole">the code</a> if you like.</p>
</div>
</div>
<script>$(document).ready(function() { $("#nav-link-about").addClass("active"); }); <!-- highlight active page in nav --></script>

4
views/webpage_alerts.tpl
View File

@@ -1,6 +1,7 @@
% rebase('webpage_base.tpl')
<div class="mt-3">
<div class="container main-container mobile-no-gutters">
<div class="mt-3">
<div class="row">
<div class="col-auto me-auto pt-3">
<p id="timing-container">Loading...</p>
@@ -155,6 +156,7 @@
<div id="table-container"></div>
</div>
</div>
<script src="/js/common.js"></script>

5
views/webpage_apidocs.tpl
View File

@@ -1,5 +1,8 @@
% rebase('webpage_base.tpl')
<redoc spec-url="/apidocs/openapi.yml"></redoc>
<div class="container main-container">
<redoc spec-url="/apidocs/openapi.yml"></redoc>
</div>
<script src="https://cdn.redoc.ly/redoc/latest/bundles/redoc.standalone.js"> </script>
<script>$(document).ready(function() { $("#nav-link-api").addClass("active"); }); <!-- highlight active page in nav --></script>

2
views/webpage_base.tpl
View File

@@ -67,6 +67,7 @@
</div>
</div>
</nav>
</div>
<main>
@@ -74,6 +75,7 @@
</main>
<div class="container">
<div class="hideonmobile hideonmap">
<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
<p class="col-md-4 mb-0 text-body-secondary">Made with love by <a href="https://ianrenton.com" class="text-body-secondary">Ian, MØTRT</a> and other contributors.</p>

4
views/webpage_map.tpl
View File

@@ -1,6 +1,7 @@
% rebase('webpage_base.tpl')
<div id="map">
<div class="container main-container mobile-no-gutters">
<div id="map">
<div class="mt-3 px-3" style="z-index: 1002; position: relative;">
<div class="row">
<div class="col-auto me-auto pt-3"></div>
@@ -119,6 +120,7 @@
</div>
</div>
</div>
</div>
</div>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/leaflet@1.9.4/dist/leaflet.min.css">

12
views/webpage_spots.tpl
View File

@@ -1,13 +1,14 @@
% rebase('webpage_base.tpl')
<div id="intro-box" class="mt-3">
<div class="alert alert-primary alert-dismissible fade show" role="alert">
<div class="container main-container mobile-no-gutters">
<div id="intro-box" class="mt-3">
<div class="alert alert-primary alert-dismissible fade show" role="alert">
<i class="fa-solid fa-circle-info"></i> <strong>What is Spothole?</strong><br/>Spothole is an aggregator of amateur radio spots from DX clusters and outdoor activity programmes. It's free for anyone to use and includes an API that developers can build other applications on. For more information, check out the <a href="/about" class="alert-link">"About" page</a>. If that sounds like nonsense to you, you can visit <a href="/about#faq" class="alert-link">the FAQ section</a> to learn more.
<button type="button" id="intro-box-dismiss" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
</div>
</div>
</div>
<div class="mt-3">
<div class="mt-3">
<div class="row">
<div class="col-auto me-auto pt-3">
<p id="timing-container">Loading...</p>
@@ -235,6 +236,7 @@
<div id="table-container"></div>
</div>
</div>
<script src="/js/common.js"></script>

4
views/webpage_status.tpl
View File

@@ -1,6 +1,8 @@
% rebase('webpage_base.tpl')
<div id="status-container" class="row row-cols-1 row-cols-md-4 g-4 mt-4"></div>
<div class="container main-container">
<div id="status-container" class="row row-cols-1 row-cols-md-4 g-4 mt-4"></div>
</div>
<script src="/js/common.js"></script>
<script src="/js/status.js"></script>

6
webassets/css/style.css
View File

@@ -14,7 +14,7 @@
/* GENERAL PAGE LAYOUT */
div.container {
div.main-container {
display:grid;
grid-template-rows:auto 1fr auto;
grid-template-columns:100%;
@@ -155,6 +155,10 @@ a.leaflet-popup-callsign-link {
.hideonmobile {
display: none !important;
}
.mobile-no-gutters {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
@media (min-width: 992px) {