diff --git a/css/pages/_guide.css b/css/pages/_guide.css index 7073fbb8..740554bf 100644 --- a/css/pages/_guide.css +++ b/css/pages/_guide.css @@ -867,25 +867,27 @@ } /* ---------- Personal route results page ---------- */ -.route-report-page { max-width: 860px; margin: 40px auto; padding: 0 24px; } +.route-report-page { max-width: 820px; margin: 56px auto 64px; padding: 0 24px; } .route-report { background: #fff; border: 1px solid #EAECF0; border-radius: 18px; - padding: 34px; + padding: 34px 38px; box-shadow: 0 10px 30px rgba(16, 24, 40, .06); } .route-report-head { display: flex; + flex-direction: column; align-items: center; - gap: 16px; - padding-bottom: 18px; - margin-bottom: 18px; + text-align: center; + gap: 12px; + padding-bottom: 20px; + margin-bottom: 22px; border-bottom: 2px solid #F2F4F7; } -.route-report-logo { height: 52px; width: auto; } -.route-report h1 { font-size: 24px; margin: 0; color: #101828; } -.route-report-date { margin: 4px 0 0; font-size: 13px; color: #98A2B3; } +.route-report-logo { height: 46px; width: auto; } +.route-report h1 { font-size: 27px; font-weight: 800; letter-spacing: -.02em; margin: 0; color: #101828; } +.route-report-date { margin: 6px 0 0; font-size: 13px; color: #98A2B3; } .route-report-intro { color: #475467; line-height: 25px; margin: 0 0 8px; } .route-report h2 { font-size: 17px; color: #101828; margin: 24px 0 10px; } .route-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 6px; } @@ -965,7 +967,9 @@ } .route-actions { display: flex; gap: 12px; flex-wrap: wrap; } +@page { margin: 0; } @media print { + html, body { background: #fff; } body * { visibility: hidden; } .route-report, .route-report * { visibility: visible; } .route-report-page { margin: 0; padding: 0; max-width: none; } @@ -974,10 +978,28 @@ left: 0; top: 0; width: 100%; + box-sizing: border-box; + padding: 12mm 14mm; border: none; border-radius: 0; box-shadow: none; - padding: 0; + font-size: 10.5px; } - .no-print { display: none !important; } + .no-print, .route-links-block { display: none !important; } + /* Compact header as a row to save vertical space */ + .route-report-head { flex-direction: row; align-items: center; text-align: left; gap: 12px; padding-bottom: 8px; margin-bottom: 10px; } + .route-report-logo { height: 34px; } + .route-report h1 { font-size: 17px; } + .route-report-date { font-size: 9px; margin-top: 2px; } + .route-report-intro { font-size: 10.5px; line-height: 15px; margin: 0 0 4px; } + .route-report h2 { font-size: 12px; margin: 11px 0 5px; page-break-after: avoid; } + .route-chips { gap: 5px; margin: 3px 0; page-break-inside: avoid; } + .route-chip { min-width: 0; padding: 4px 8px; } + .route-chip span { font-size: 7.5px; } + .route-chip strong { font-size: 10px; } + .route-steps li { padding: 5px 0 5px 26px; line-height: 14px; page-break-inside: avoid; } + .route-steps li::before { width: 18px; height: 18px; font-size: 9px; top: 5px; } + .route-focus li { padding: 3px 0 3px 16px; line-height: 14px; page-break-inside: avoid; } + .route-focus li::before { top: 10px; } + .route-disclaimer { margin: 11px 0 0; padding: 8px 10px; font-size: 9px; line-height: 13px; page-break-inside: avoid; } } diff --git a/my-route.js b/my-route.js index 539d8333..776c2f0e 100644 --- a/my-route.js +++ b/my-route.js @@ -213,8 +213,8 @@ '