Implement reset button with styling and export button improvements

Co-authored-by: clayschaad <11883505+clayschaad@users.noreply.github.com>
This commit is contained in:
copilot-swe-agent[bot] 2025-08-18 17:54:10 +00:00
parent fe050182eb
commit c596a21b74
3 changed files with 66 additions and 8 deletions

View file

@ -25,7 +25,11 @@
}
</div>
<div class="export-buttons">
<button class="btn" @onclick="ExportToIcs">Export to ICS</button>
<button class="btn" @onclick="ExportToPdf">Export to PDF</button>
<div class="reset-section">
<button class="reset-btn" @onclick="ResetSchedule">Reset Schedule</button>
</div>
<div class="export-buttons">
<button class="btn export-btn" @onclick="ExportToIcs">Export to ICS</button>
<button class="btn export-btn" @onclick="ExportToPdf">Export to PDF</button>
</div>

View file

@ -107,5 +107,22 @@ namespace ShiftScheduler.Client.Pages
SelectedSchedule = new Dictionary<DateTime, string>();
}
}
private async Task ResetSchedule()
{
// Clear the in-memory schedule
SelectedSchedule.Clear();
// Remove from localStorage
try
{
var storageKey = $"ShiftSchedule_{EditYear}_{EditMonth:D2}";
await JSRuntime.InvokeVoidAsync("localStorage.removeItem", storageKey);
}
catch (Exception)
{
// ignored
}
}
}
}

View file

@ -52,14 +52,51 @@
}
/* Export button */
.export-btn {
margin-top: 20px;
.btn.export-btn {
margin: 5px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
background-color: #28a745;
color: white;
border: none;
background-color: #ADD8E6; /* Light blue */
color: #333;
border: 2px solid #87CEEB; /* Slightly darker blue border */
border-radius: 5px;
transition: background-color 0.2s ease;
}
.btn.export-btn:hover {
background-color: #87CEEB;
border-color: #4682B4;
}
/* Reset button */
.reset-btn {
margin: 5px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
background-color: #FFB6C1; /* Light red/pink */
color: #333;
border: 2px solid #FF91A4; /* Slightly darker red border */
border-radius: 5px;
transition: background-color 0.2s ease;
}
.reset-btn:hover {
background-color: #FF91A4;
border-color: #FF69B4;
}
/* Reset section - separate from export buttons */
.reset-section {
margin: 30px 0 20px 0;
text-align: center;
}
/* Export buttons section */
.export-buttons {
margin: 20px 0;
text-align: center;
}
/* Tooltip container */