Introduce a dedicated /qr route for QR code preview via query params. Add PaymentRequest model for payment data and validation, replacing the old inline model. Extract QR code generation to PaymentQrCodeService for reuse. Refactor Home.razor to use new model/service and improve validation/UI. Add EmptyLayout for minimal layout needs. Update .gitignore and _Imports.razor for new structure.
47 lines
805 B
CSS
47 lines
805 B
CSS
.qr-route-page {
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 24px;
|
|
background: #ffffff;
|
|
}
|
|
|
|
.qr-route-image {
|
|
display: block;
|
|
width: min(92vw, 420px);
|
|
height: auto;
|
|
aspect-ratio: 1;
|
|
}
|
|
|
|
.qr-route-error {
|
|
max-width: 420px;
|
|
padding: 24px;
|
|
border: 1px solid #fecaca;
|
|
border-radius: 16px;
|
|
background: #fef2f2;
|
|
color: #991b1b;
|
|
text-align: left;
|
|
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
|
|
}
|
|
|
|
.qr-route-error p {
|
|
margin: 0 0 8px;
|
|
}
|
|
|
|
.qr-route-error p:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.visually-hidden {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border: 0;
|
|
}
|