STOP BEING ON MASTER. Anyways made the temp blanket visualizer fit in a bootstrap grid :)

This commit is contained in:
Kira Jiroux 2025-06-13 15:27:14 -04:00
parent da30a2b0d5
commit 0b316a3b4b
4 changed files with 29 additions and 15 deletions

View File

@ -9,21 +9,26 @@
else
{
<div class="">
<h3 class="text-xl font-bold mb-4">Temperature Blanket Visualizer</h3>
<h3 class="text-xl font-bold mb-4">Temperature Blanket Visualizer</h3>
<div class="d-flex">
<div style="display: flex; overflow-x: auto; background-color: black; padding: 10px;">
@foreach (var day in TemperatureDays)
{
var color = GetColorForTemp(day.AvgTemp);
<div style="width: 6px; height: 600px; background-color:@color; margin-right: 1px;"
title="@day.Date.ToString("MMM dd") - @day.AvgTemp°F (@color)">
<div>
<div class="row">
<div class="col-10">
<div class="d-flex">
<div class="temperature-blanket">
@foreach (var day in TemperatureDays)
{
var color = GetColorForTemp(day.AvgTemp);
<div style="width: 6px; height: 600px; background-color:@color; margin-right: 1px;"
title="@day.Date.ToString("MMM dd") - @day.AvgTemp°F (@color)">
</div>
}
</div>
}
</div>
</div>
<div class="col">
<TemperatureRangeEditor TempRanges="@TemperatureRanges" OnRangesChanged="HandleRangesChanged" />
</div>
<TemperatureRangeEditor TempRanges="@TemperatureRanges" OnRangesChanged="HandleRangesChanged" />
</div>
</div>
}

View File

@ -0,0 +1,9 @@
body {
}
.temperature-blanket {
display: flex;
overflow-x: auto;
background-color: black;
padding: 10px;
}

View File

@ -22,7 +22,7 @@
} *@
<!-- Color pickers for each range -->
<div class="card rounded-3 w-50 mx-auto">
<div class="card rounded-3">
<div class="card-header mb-3 text-center fw-bold">
Temperature Blanket Colors
</div>
@ -76,7 +76,7 @@
</div>
} *@
<div class="row align-items-center mb-2">
<div class="row align-items-center mb-2 ms-1">
<div class="col-6 text-end pe-2">
<label class="form-label mb-0">
@TempRanges[i].Min&deg; @TempRanges[i].Max&deg;

View File

@ -9,7 +9,7 @@
</head>
<h3 class="text-xl font-bold mb-4">Crochet</h3>
<div class="container">
<div class="">
<TemperatureBlanketVisualizer TemperatureDays="temperatureDays" />
</div>