openproject/app/assets/stylesheets/layout/work_packages/_print.sass

//
//***** Media print specific styles for the WP VIEWS *****/
// Since the print view has similarities to the mobile view
// there are further styles defined in the _work_package_mobile.sass
//
@media print
  // -------------------- Work Package views --------------------
  body
    &.controller-work_packages.action-index,
    &.controller-work_packages.action-show,
    &.controller-work_packages.full-create
      #wrapper
        overflow: visible !important

      #main
        top: 0
        padding: 0
        border: none
        overflow: visible !important
        position: relative

        #content-wrapper,
        #content
          margin: 0
          width: 100%
          overflow: visible !important
          position: relative

          .work-packages-list-view--container
            padding-left: 0
            .work-packages-split-view
              overflow: visible

              .work-packages-split-view--tabletimeline-side
                .work-packages-split-view--tabletimeline-content
                  .wp-table--hierarchy-aditional-row,
                  tr.-checked,
                  .row-hovered
                    // Remove highlighting of first and selected rows:
                    background-color: transparent

              .work-packages-tabletimeline--table-side
                contain: initial // For printing in Chrome
                overflow: visible

                &:not(.-timeline-visible)
                  // Only repeat table header when only table visible and no
                  // timelines.
                  thead.-sticky th
                    position: initial

                &.-timeline-visible
                  // Do not show table on timelines print outs.
                  display: none

              .work-packages-tabletimeline--timeline-side
                  contain: initial // For printing in Chrome
                  border-left: none

      .work-package-table--container,
      .generic-table--results-container
        overflow: hidden

  // -------------------- Sepcial Rules for FF --------------------
  html.-browser-firefox
    body
      &.controller-work_packages.action-index,
      &.controller-work_packages.action-show,
      &.controller-work_packages.full-create
        #main
          display: block

          #content-wrapper,
          #content
            .work-packages-list-view--container
              display: block
              .toolbar-container
                display: none
              .work-packages-split-view
                display: block

                .work-packages-split-view--tabletimeline-side
                  display: block
                  .work-packages-split-view--tabletimeline-content
                    display: block
                    .work-packages-split-view--tabletimeline-side
                      display: none
                    .work-packages-tabletimeline--table-side
                      &.-timeline-visible
                        display: initial

                      &.-timeline-visible
                        thead
                          // Undo that hack from above for FF
                          display: table-header-group
                    .work-packages-tabletimeline--timeline-side
                      // As this print is worthless, we remove it for FF
                      display: none !important


  html.-browser-firefox,
  html.-browser-edge
    body.controller-work_packages.action-show,
      .work-packages--show-view,
      .work-packages-full-view--split-container
        display: block

  // ------------------Only WP full screen view ------------------
  body.controller-work_packages.action-show
    // Since there is no toolbar and WP-back button the header can span 100%
    .wp-show--header-container
      flex-basis: 100%
    .work-packages-full-view--split-right
      overflow: visible
      flex-basis: initial !important

    // Ensure left side is not set to overflow: hidden
    .work-packages-full-view--split-left
      overflow: visible

    // decrease padding under subject
    .work-packages--show-view > .toolbar-container
      min-height: 42px
      margin-bottom: 0

    // Overwrite "click to add description" placeholder with a simple dash.
    .wp-edit-field.description.-placeholder
      .read-value--html
        display: none
      &:after
        content: '-'