@c8y/style/styles/base/_print.less

Styles for Cumulocity IoT applications

/**
 * Print Styles - Media query for print layouts
 *
 * Note: Most spacing values use @size-* tokens from the 8px base unit system.
 *
 * Intentionally hardcoded values:
 * - transform: scale(0.97): Scale factor, not spacing
 * - 1px borders: Standard border widths for print
 * - z-index values: Stacking context for print layout
 * - 100vw/99vh: Full viewport dimensions
 * - orphans/widows: Typography print control
 */

@media print {
  body {
    --c8y-elevation-sm: 0 0 0 1px rgba(var(--c8y-elevation-color), 0.1);
    transform: scale(0.97);
  }

  *,
  *:before,
  *:after {
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href^='#']:after,
  a[href^='javascript:']:after {
    content: '';
  }

  pre,
  blockquote {
    border: 1px solid @gray-60;
    page-break-inside: avoid;
  }

  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  img {
    max-width: 100% !important;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }

  // Bootstrap components
  .navbar {
    display: none;
  }

  .btn,
  .dropup > .btn {
    > .caret {
      border-top-color: @black !important;
    }
  }

  .table {
    border-collapse: collapse !important;

    td,
    th {
      background-color: @component-background-default !important;
    }
  }

  .table-bordered {
    th,
    td {
      border: 1px solid @gray-90 !important;
    }
  }

  .navigator,
  .app-main-header {
    display: none !important;
  }

  .c8y-ui-action-bar {
    position: static !important;
  }

  .mcontainer {
    all: unset;
    margin-top: 0;
    margin-left: 0 !important;
    padding: 0 @size-24 !important;

    &:has(.dashboard) {
      padding: 0 !important;
    }

    > .container-fluid {
      padding-bottom: 0;
    }
  }

  .c8y-ui-action-bar {
    top: 0 !important;
    left: 0 !important;
    box-shadow: none !important;
  }

  .dashboard {
    top: 0;
    left: 0;
    z-index: 1085 !important;
    overflow-y: auto;
    margin: 0 !important;
    padding-top: calc(@size-base * 4) !important;
    padding-bottom: @size-24 !important;
    width: 100vw;
    height: 99vh;
    &:extend(.c8y-scrollbar);

    .dashboard {
      padding-bottom: 0 !important;
      all: unset !important;
    }

    .dashboard-container {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
  }

  .page-tabs:not(.c8y-top-drawer--tabs) {
    display: none !important;
  }

  .dashboard, body, html {
    overflow: unset !important;
    min-height: unset !important;
  }
  
}