Gutenberg

by BafS

Modern framework to print the web correctly.                                               

4.3K Stars 141 Forks Last release: about 2 months ago (v0.6.1) MIT License 72 Commits 11 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

Gutenberg

Modern framework to print web pages correctly

npm (scoped) Build Status Maintainability license download

How to use

Simply include the right stylesheet(s) in your html and load it only for a printer. Gutenberg.css is the base stylesheet but there are themes available in the

themes
folder.

Example with Gutenberg and "old style" theme :

 

comparison

Comparison between standard print (left) and Gutenberg (middle, Modern style and right, Old style)

npm

Gutenberg is available on npm

npm install gutenberg-css

(or

yarn add gutenberg-css
for yarn users)

CDN

You can also use the unpkg service as a CDN.


What does the framework do ?

Hide elements

To hide elements to be printed you can simply add the class

no-print
.

Force break page

Gutenberg provides two ways to break a page, the class

break-before
will to break before and
break-after
to break after.

Example:

My title

I will break after this paragraph

I am on a new page

Avoid break inside

To avoid the page to break "inside" an element, you can use the

avoid-break-inside
class.

Example:

I really don't want this part to be cut

Not reformat links or acronym

If you do not want to reformat the links, acronym or abbreviation to show the full url or title, you can use the class

no-reformat
.

Force to print background

To force backgrounds to be printed (can be useful when you "print" a pdf), add this CSS (compatible with Safari and Chrome):

-webkit-print-color-adjust: exact;
        print-color-adjust: exact;

Dev

  • npm i
    to install the dependencies
  • npm run watch
    to "watch" the scss folder and compile to css
  • npm run build
    to compile gutenberg to css

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.