Skip to content

Peak Design – Printable Orders by whitespace

Details

Authorwhitespace

LicenseNo License

Categorypeakdesign.com

Created

Updated

Size2.1 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Proper print style for orders from peakdesign.com

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name           Peak Design – Printable Orders
@namespace      github.com/openstyles/stylus
@version        1.1.0
@description    Proper print style for orders from peakdesign.com
@author         whitespace
@license        NO-REDISTRIBUTION
@version        20220829.14.30
==/UserStyle== */
/**
 * Peak Design – Printable Orders
 * 
 * Proper print style for orders from peakdesign.com
 *
 * @author https://github.com/whytspace
 */
@-moz-document url-prefix("https://www.peakdesign.com/account/orders/") {
    @media print {
        /* hide unnecessary stuff */
        .orderstatus hr,
        .orderstatus > *:is(h2, p, hr),
        .tone_tap_to_text,
        .tone_tap_to_text_tooltip,
        #shopify-section-global-footer,
        header.navbar {
            display: none;
        }

        /* remove whitespace */
        .content-wrapper {
            padding-top: 0 !important;
        }
        .container-1200 {
            margin-block: 0;
            width: 100%;
        }
        .container-900 {
            width: 100%
        }
        .order-addresses {
            display: flex;
            /* for unknown reasons, the section generates additional whitespace on top in print mode */
            margin-top: -2em;
        }

        .data-table :is(td, th) {
            padding: 8px 10px;
        }
        .order-subtotals :is(td, th) {
            padding-block: 5px;
        }

        .padding-bot-30 {
            padding-bottom: 0;
        }

        /* reduce font sizes */
        body {
            font-size: 14px;
            line-height: 1.5;
        }

        h2 {
            font-size: 20px;
            margin-top: 0;
        }

        .order-addresses,
        .order-status,
        p,
        p.product-copy-sm,
        .table {
            font-size: inherit;
            line-height: inherit;
        }

        /* readability */
        h2.order-status {
            margin-bottom: 1em
        }

        .data-table {
            text-align: left;
        }
        .data-table .text-right {
            white-space: nowrap;
        }
    }
}

Reviews

No reviews yet.