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 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>
<div style="display: flex; overflow-x: auto; background-color: black; padding: 10px;"> <div class="row">
@foreach (var day in TemperatureDays) <div class="col-10">
{ <div class="d-flex">
var color = GetColorForTemp(day.AvgTemp); <div class="temperature-blanket">
<div style="width: 6px; height: 600px; background-color:@color; margin-right: 1px;" @foreach (var day in TemperatureDays)
title="@day.Date.ToString("MMM dd") - @day.AvgTemp°F (@color)"> {
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>
<div class="col">
<TemperatureRangeEditor TempRanges="@TemperatureRanges" OnRangesChanged="HandleRangesChanged" />
</div> </div>
<TemperatureRangeEditor TempRanges="@TemperatureRanges" OnRangesChanged="HandleRangesChanged" />
</div> </div>
</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 --> <!-- 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"> <div class="card-header mb-3 text-center fw-bold">
Temperature Blanket Colors Temperature Blanket Colors
</div> </div>
@ -76,7 +76,7 @@
</div> </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"> <div class="col-6 text-end pe-2">
<label class="form-label mb-0"> <label class="form-label mb-0">
@TempRanges[i].Min&deg; @TempRanges[i].Max&deg; @TempRanges[i].Min&deg; @TempRanges[i].Max&deg;

View File

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