Skip to content

Improve print styling of proposal one-pager

Bunch of changes to try and make one-page proposals actually fit on one page:

  • Remove all ancestor box styling (positioning, widths/heights, margins/padding)
  • Absolutely position the proposal with 100% height/width, zero inset, and overflow:hidden
  • Size all text elements correctly, including <dd> elements (which weren't working correctly before)
  • Set max-line limits on main content area (was unlimited before), after which content truncates with an ellipsis
  • Move video thumbnail to top of sidebar and link it to video page
  • Position competition logo in bottom left of page
Setting wiki-specific text styling in `Common.css`…

Font size and maximum line counts are set using CSS variables, so they can be overridden in a given Common.css this way:

.proposal-one-pager {
  --proposal-one-pager--main--font-size: 10pt;
  --proposal-one-pager--sidebar--font-size: 9pt;

  --proposal-one-pager--main--max-lines: 4; /* Limits each section in the main area to four lines. */
  --proposal-one-pager--sidebar--max-lines: 4; /* Limits each section in the sidebar to four lines. */
  --proposal-one-pager--executive-summary--max-lines: 18; /* Custom limit for the Executive Summary, if desired. */
  --proposal-one-pager--project-description--max-lines: var(--proposal-one-pager--main--max-lines); /* Custom limit for the Project Description, if desired. (Here it's just set to inherit from --proposal-one-pager--main--max-lines.) */
}

Here's an example: OnePagePrintProposal_-_LocalView.pdf

Closes https://code.librehq.com/ots/clients/lfc/torque-tracker/-/issues/113

Edited by Justin Reese

Merge request reports

Loading