spouliot/PowderCoatingLogix
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add smart install prompt for supported browsers

Browse Source
This commit is contained in:
Scott Pouliot
2026-05-06 09:05:00 -04:00
parent f383339465
commit 7e0699d5bd
3 changed files with 156 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/PowderCoating.Web/Views/Shared/_Layout.cshtml
+47
View File
@@ -351,6 +351,17 @@
gap: 1rem;
}
.install-app-btn {
display: inline-flex;
align-items: center;
gap: 0.45rem;
white-space: nowrap;
}
.install-app-btn i {
font-size: 0.95rem;
}
.user-avatar {
width: 40px;
height: 40px;
@@ -627,6 +638,10 @@
.stat-card i {
font-size: 1.25rem !important;
}
.install-app-btn .install-label {
display: none;
}
}
/* Loading States */
@@ -1434,6 +1449,12 @@
</div>
<div class="user-menu">
<button type="button" class="btn btn-outline-primary btn-sm install-app-btn d-none"
id="installAppBtn" aria-label="Install app">
<i class="bi bi-download"></i>
<span class="install-label">Install App</span>
</button>
<!-- Theme toggle -->
<button type="button" class="pcl-theme-toggle"
data-theme-toggle aria-pressed="false" aria-label="Toggle dark mode">
@@ -2140,6 +2161,32 @@
</div>
<script src="~/js/quick-add.js" asp-append-version="true"></script>
<script src="~/js/theme-toggle.js" asp-append-version="true"></script>
<script src="~/js/install-app.js" asp-append-version="true"></script>
<div class="modal fade" id="installHelpModal" tabindex="-1" aria-labelledby="installHelpModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content border-0 shadow-lg">
<div class="modal-header">
<h5 class="modal-title fw-semibold" id="installHelpModalLabel">Install App</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="d-flex gap-3">
<div class="fs-3 text-primary">
<i class="bi bi-phone"></i>
</div>
<div>
<p class="mb-2" id="installHelpMessage"></p>
<div class="small text-muted" id="installHelpSteps"></div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-bs-dismiss="modal">Got It</button>
</div>
</div>
</div>
</div>
<!-- ── Global Confirm Dialog ──────────────────────────────────────────── -->
<div class="modal fade" id="globalConfirmModal" tabindex="-1" aria-hidden="true">