Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-06-09 06:31:55 -07:00
Code Issues Packages Projects Releases Wiki Activity

Fix squashed sky view polar plot and eliminate wasted space

Browse Source 
- Remove align-self: start from .polar-container so the grid row's
  minmax(260px, 340px) height is actually respected
- Switch #polarPlot to aspect-ratio: 1/1 so the canvas is always square
- Fix both draw functions to size canvas from getBoundingClientRect on
  the canvas itself (not parent) using min(width, height) for a square plot
- Remove min-height from .dashboard to prevent empty space below content
  on narrow/mobile screens where stacked panels are shorter than 720px

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
James Smith
2026-03-19 23:17:35 +00:00
parent 72d4fab25e
commit ad4a4db160
2 changed files with 12 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/css/satellite_dashboard.css
+4 -10
View File
@@ -264,7 +264,6 @@ body {
}
/* Main dashboard grid */
/* Header ~52px + Nav 44px = ~96px, using 100px for safety */
.dashboard {
position: relative;
z-index: 10;
@@ -273,7 +272,6 @@ body {
grid-template-rows: minmax(0, 1fr) auto auto;
gap: 12px;
height: auto;
min-height: 720px;
padding: 12px;
}
@@ -740,25 +738,22 @@ body {
/* Polar plot */
.polar-container {
min-height: 0;
max-height: 340px;
align-self: start;
}
.polar-container .panel-content {
display: flex;
align-items: center;
justify-content: center;
padding: 14px;
padding: 8px;
height: auto;
overflow: hidden;
}
#polarPlot {
display: block;
width: 100%;
height: 100%;
max-width: 320px;
max-height: 320px;
min-height: 0;
max-width: 300px;
aspect-ratio: 1 / 1;
}
/* Ground track map */
@@ -1566,7 +1561,6 @@ body {
.dashboard {
grid-template-rows: auto auto auto;
height: auto;
min-height: calc(100vh - 100px);
}
.primary-layout {
templates/satellite_dashboard.html
+8 -6
View File
@@ -2289,9 +2289,10 @@
function drawPolarPlot(pass) {
const canvas = document.getElementById('polarPlot');
const ctx = canvas.getContext('2d');
const rect = canvas.parentElement.getBoundingClientRect();
canvas.width = rect.width;
canvas.height = rect.height - 20;
const rect = canvas.getBoundingClientRect();
const size = Math.round(Math.min(rect.width, rect.height || rect.width));
canvas.width = size;
canvas.height = size;
const cx = canvas.width / 2;
const cy = canvas.height / 2;
@@ -2517,9 +2518,10 @@
function drawPolarPlotWithPosition(az, el, color) {
const canvas = document.getElementById('polarPlot');
const ctx = canvas.getContext('2d');
const rect = canvas.parentElement.getBoundingClientRect();
canvas.width = rect.width;
canvas.height = rect.height - 20;
const rect = canvas.getBoundingClientRect();
const size = Math.round(Math.min(rect.width, rect.height || rect.width));
canvas.width = size;
canvas.height = size;
const cx = canvas.width / 2;
const cy = canvas.height / 2;