Skip to main content

reports studio

TuxReportPrintSheet

Drop-in print stylesheet engine for any application page that needs a "Print" button to produce a publication-grade paper or PDF output. Renders nothing visible on screen; dynamically injects a <style media="print"> rule with @page dimensions, ink-saver background overrides, and smart link styling. Hides interactive chrome with data-print="hide"; paginates cleanly with data-print-break="before|after|avoid".

Print Engine & Geometry

Print Stylesheet Workbench

Presets:
@page { size: letter; margin: 0.6in; }
Screen-Only UI Chrome (data-print="hide")

This filter toolbar, side navigation, and action strip automatically vanish when printed or exported as PDF.

Hidden in Print

TTI Research Evaluation · FY2026 Q1

Corridor Mobility & Autonomous Transit Operations

Texas A&M Transportation Institute · Project 0-7114 · Austin & San Antonio Corridors

During the continuous 90-day test period on the IH-35 managed lanes, connected vehicle telemetry demonstrated a 14.8% decrease in stop-and-go wave propagation following automated variable speed advisory activations. Cross-sectional detector stations logged 4.2 million discrete vehicle passages with zero lost-time safety events attributable to sensor latency.

Test CorridorMean Travel TimeBuffer IndexIncident Clear Time
IH-35 Segment North22.4 min1.18 (-8.2%)14.1 min
US-290 East Gateway18.1 min1.12 (-12.0%)11.8 min
Page Break Boundary (data-print-break="before")
Sheet 2 begins here

Appendix · Methodological Calibration & Verification

All inductive loop and radar telemetry underwent secondary validation against TxDOT CRIS crash report records. Bootstrap confidence intervals (B = 2,000 resamples) yielded a 95% interval of [12.2%, 17.4%] for travel time reliability enhancements.

Published by Texas A&M Transportation Institute · tti.tamu.edu

Properties Inspector3 configurable knobs
Paper Formatsize
Print Marginsmargin
Simulate Print View On-ScreensimulatePrintMode
false
Dynamic Component Syntax
<!-- Drop into any Nuxt or Vue page requiring clean print output -->
<tux-report-print-sheet />

<!-- Chrome element hidden from paper / PDF print output -->
<aside data-print="hide" class="sidebar">
  ...navigation tabs, filter knobs, and action buttons...
</aside>

<!-- Printable content section 1 -->
<article>
  <header>
    <h1>Corridor Mobility Evaluation — IH-35 Central</h1>
    <p class="eyebrow">Executive Summary · FY2026</p>
  </header>
  <p>During the primary evaluation interval...</p>
</article>

<!-- Force a clean page break before appendix or section 2 -->
<section data-print-break="before">
  <h2>Appendix A · Sensor Telemetry &amp; Confidence Bands</h2>
  <table data-print-break="avoid">
    ...keep table rows unified without breaking across sheets...
  </table>
</section>

attributes

Print Control Data Attributes

TuxReportPrintSheet automatically recognizes and processes standard HTML data attributes on any DOM element without needing component-specific wrappers:

AttributeCSS Rule AppliedBehavior & Purpose
data-print="hide"display: none !important;Hides interactive screen chrome (headers, navigations, filters, buttons) from the printed paper or PDF.
data-print-break="before"page-break-before: always;Forces the browser or PDF printer to start the annotated section on a fresh page sheet.
data-print-break="after"page-break-after: always;Paginates immediately after the target element, pushing subsequent content to the next sheet.
data-print-break="avoid"page-break-inside: avoid;Guarantees that tables, chart exhibits, or callout cards remain intact and do not split across page seams.

architecture

Print Optimization & Ink Savings

Pure White Canvas

Forces background: #fff !important on html, body, and surface cards to avoid consuming printer ink across large tinted surfaces.

Preserved Hyperlinks

Forces authentic Aggie maroon color (#5C0025) and underlines on all link elements so citations and URL references remain distinct and recognizable on printouts.

Zero Runtime Overhead

The component renders a hidden marker in the DOM and uses Nuxt's useHead to attach the stylesheet once to the document head with media="print".