Styles

Printing Style Modules (styles)

Defines the map of printing-specific SCSS style modules for the theme. The existing value is a map of styles that are loaded first for the theme and set defaults for the presentation.

You can add new keys or replace the values for existing ones. You don’t need to keep the full list of all styles in your own configuration file. Only specify the values you want to add or replace.

For more information on authoring SCSS style modules, see the SCSS documentation.

JSON Schema

Definition
{
  "$id": "https://platen.io/schemas/platen/site/theme/printing/styles/schema.json",
  "$schema": "https://json-schema.org/draft/2020-12/schema",
  "description": "Defines the map of printing-specific SCSS style modules for the theme.\n\nhttps://platen.io/schemas/platen/site/theme/printing/styles/",
  "properties": {
    "basic": {
      "description": "Defines default styling when a site visitor prints a page.\n\nhttps://platen.io/schemas/platen/site/theme/printing/styles/#basic",
      "title": "Basic Printing Style Module",
      "type": "object"
    }
  },
  "title": "Printing Style Modules",
  "type": "object"
}

Basic Printing Style Module (basic)

Defines default styling when a site visitor prints a page. By default, the only setting for this property is enabled, which defaults to true. If you set enabled to false, this style isn’t applied to the site.

With enabled set to true, Platen applies the following style to the site:

@media print {
  .platen-menu,
  .platen-footer,
  .platen-toc {
    display: none;
  }

  .platen-header,
  .platen-header aside {
    display: block;
  }

  main {
    // Fix for https://bugzilla.mozilla.org/show_bug.cgi?id=939897
    display: block !important;
  }
}

This applies when a site visitor uses the print function while on a page, normally to export the page as PDF or print it immediately.

It hides the site menu, footer, and page table of contents and ensures the header and body content are visible.

You can overwrite this definition for your own site or theme by creating the file styles/printing/_basic.scss in your assets folder, which defaults to assets in your project root.

Careful!

Note that if you create this file, it entirely overwrites the default from the theme.

For more information on authoring SCSS, see the learning guide.

Edit this page