doccoli-jekyll 1.1.3 → 1.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 404c28527334403054de5fecb5ee38df9297c217
4
- data.tar.gz: dadb8e0b2184e859811c1dcd683cbdfa091b27b3
3
+ metadata.gz: de67aad988a5ab64b10b209301d92bb588ffb7d4
4
+ data.tar.gz: dcf574938e920a036a174f93b265bf023865d3b9
5
5
  SHA512:
6
- metadata.gz: 7a5dc04c10309e557ab805ea4f883e1a75e6a778fee649d8bfffe5a7643a9dab632e6bb5708cd15c10be59d5c839f7e5e84543485db883b6b7ec26539ee5cb1c
7
- data.tar.gz: ac51c7a78dc28d438cc48184e23c6491ecf171e8c9112948a17796d5e4deac79446ab172c76bd4c3b48fa4c222dccaedd894e4301659c570a729691a48d58f94
6
+ metadata.gz: 32907b23799cceafe603b780811c79dc051bf9cf04cbbd711213656f7548a93c1e9c70d99179bf813f0f377033dd13bbc329bccc1ac6056adc7fac14f0775451
7
+ data.tar.gz: b4cb94ebf6198b105041f95cee61b83c9285947ae1c27385156e7c80427b54b67ac00ac90a834216595e914d54d62067e9efa8b8a46df114d5bb3f471080c77e
data/README.md CHANGED
@@ -1,19 +1,14 @@
1
1
  # doccoli-jekyll
2
2
 
3
- The `doccoli-jekyll` is the Jekyll theme in use for documentation at [Bubblin Superbooks](https://bubblin.io/docs/). It is a particularly useful theme for products made by solo founders (developers) or a bootstrapped team with very limited resources.
3
+ The `doccoli-jekyll` is the Jekyll theme in use for [documentation](https://bubblin.io/docs/) at Bubblin Superbooks. This theme is particularly useful for solo founders (developers) or small bootstrapped teams with very limited time and resources.
4
4
 
5
- Easily add a responsive "blog-like" implementation for product documentation on your website; something like say on the side of your rails app over a url like this:
5
+ Tack a responsive "blog-like" implementation of SEO-optimized documentation onto your website; it will sit on a url like so, right next to your actual product or website:
6
6
 
7
7
  > https://example.com/docs/
8
8
 
9
+ A tutorial on how to set up documentation using the `doccoli-jekyll` theme alongside a rails app is available [here](https://bubblin.io/blog/).
9
10
 
10
- `doccoli-jekyll` was originally a fork off of [Minima](https://github.com/jekyll/minima)—the default gem-theme of Jekyll-but it has been rewritten completely using the [Toucaan CSS](https://github.com/marvindanig/toucaan) fundamentals for its themed layout.
11
-
12
- A tutorial on how to setup a jekyll blog using the `doccoli-jekyll` theme alongside your rails app is available [here](https://bubblin.io/blog/).
13
-
14
- [Theme preview](https://jekyll.github.io/doccoli-jekyll/)
15
-
16
- ![doccoli-jekyll theme preview](/screenshot.png)
11
+ ![doccoli-jekyll theme preview](/screenshot.jpg)
17
12
 
18
13
  ## Installation
19
14
 
@@ -35,47 +30,6 @@ And then execute:
35
30
 
36
31
  $ bundle
37
32
 
38
- ### Layouts
39
-
40
- Refers to files within the `_layouts` directory, that define the markup for your theme.
41
-
42
- - `default.html` — The base layout that lays the foundation for subsequent layouts. The derived layouts inject their contents into this file at the line that says ` {{ content }} ` and are linked to this file via [FrontMatter](https://jekyllrb.com/docs/frontmatter/) declaration `layout: default`.
43
- - `home.html` — The layout for your landing-page / home-page / index-page.
44
- - `page.html` — The layout for your documents that contain FrontMatter, but are not posts.
45
- - `post.html` — The layout for your posts.
46
-
47
- ### Includes
48
-
49
- Refers to snippets of code within the `_includes` directory that can be inserted in multiple layouts (and another include-file as well) within the same theme-gem.
50
-
51
- - `disqus_comments.html` — Code to markup disqus comment box.
52
- - `footer.html` — Defines the site's footer section.
53
- - `google-analytics.html` — Inserts Google Analytics module (active only in production environment).
54
- - `head.html` &mdash; Code-block that defines the `<head></head>` in *default* layout.
55
- - `header.html` &mdash; Defines the site's main header section. By default, pages with a defined `title` attribute will have links displayed here.
56
- - `icon-* files` &mdash; Inserts github and twitter ids with respective icons.
57
-
58
- ### Sass
59
-
60
- Refers to `.scss` files within the `_sass` directory that define the theme's styles.
61
-
62
- - `doccoli-jekyll.scss` &mdash; The core file imported by preprocessed `main.scss`, it defines the variable defaults for the theme and also further imports sass partials to supplement itself.
63
- - `doccoli-jekyll/_base.scss` &mdash; Resets and defines base styles for various HTML elements.
64
- - `doccoli-jekyll/_layout.scss` &mdash; Defines the visual style for various layouts.
65
- - `doccoli-jekyll/_syntax-highlighting.scss` &mdash; Defines the styles for syntax-highlighting.
66
-
67
- ### Assets
68
-
69
- Refers to various asset files within the `assets` directory.
70
- Contains the `main.scss` that imports sass files from within the `_sass` directory. This `main.scss` is what gets processed into the theme's main stylesheet `main.css` called by `_layouts/default.html` via `_includes/head.html`.
71
-
72
- This directory can include sub-directories to manage assets of similar type, and will be copied over as is, to the final transformed site directory.
73
-
74
- ### Plugins
75
-
76
- doccoli-jekyll comes preinstalled with the [`jekyll-seo-tag`](https://github.com/jekyll/jekyll-seo-tag) plugin to make sure your website gets the most useful meta tags. See [usage](https://github.com/jekyll/jekyll-seo-tag#usage) to know how to set it up.
77
-
78
- ## Usage
79
33
 
80
34
  ### Customization
81
35
 
@@ -11,8 +11,6 @@ layout: default
11
11
 
12
12
  {{ content }}
13
13
 
14
- <h2>Posts</h2>
15
-
16
14
  <ul class="pad-vertically">
17
15
  {% for post in site.posts %}
18
16
  <li>
@@ -2,4 +2,4 @@
2
2
  @import "scss/header";
3
3
  @import "scss/sidebar";
4
4
  @import "scss/syntax-highlighting";
5
- @import "scss/reusable";
5
+ @import "scss/base";
@@ -1,245 +1,566 @@
1
- /**
2
- * Reset some basic elements
3
- */
4
- body, h1, h2, h3, h4, h5, h6,
5
- p, blockquote, pre, hr,
6
- dl, dd, ol, ul, figure {
7
- margin: 0;
8
- padding: 0;
1
+ article,
2
+ aside,
3
+ details,
4
+ footer,
5
+ header,
6
+ hgroup,
7
+ main,
8
+ nav,
9
+ section,
10
+ summary {
11
+ display: block;
9
12
  }
10
13
 
14
+ html {
15
+ font-size: 100%;
16
+ -ms-text-size-adjust: 100%;
17
+ -webkit-text-size-adjust: 100%;
18
+ font-size: 1em;
19
+ line-height: 1.4;
20
+ text-rendering: optimizelegibility;
21
+ -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
22
+ -webkit-backface-visibility: hidden;
23
+ }
11
24
 
12
-
13
- /**
14
- * Basic styling
15
- */
16
25
  body {
17
- font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
18
- color: $text-color;
19
- background-color: $background-color;
20
- -webkit-text-size-adjust: 100%;
21
- -webkit-font-feature-settings: "kern" 1;
22
- -moz-font-feature-settings: "kern" 1;
23
- -o-font-feature-settings: "kern" 1;
24
- font-feature-settings: "kern" 1;
25
- font-kerning: normal;
26
+ color: rgba(0, 0, 0, 0.85);
27
+ background: aliceblue;
28
+ margin: 0;
29
+ font-family: 'EB Garamond', serif;
30
+ font-smooth: always;
31
+ -webkit-font-smoothing: subpixel-antialiased;
32
+ text-rendering: optimizelegibility;
33
+ font-display: swap;
34
+ font-display: optional;
35
+ -moz-osx-font-smoothing: grayscale;
36
+ -webkit-osx-font-smoothing: antialiased;
26
37
  }
27
38
 
28
39
 
40
+ /* Anchors */
29
41
 
30
- /**
31
- * Set `margin-bottom` to maintain vertical rhythm
32
- */
33
- h1, h2, h3, h4, h5, h6,
34
- p, blockquote, pre,
35
- ul, ol, dl, figure,
36
- %vertical-rhythm {
37
- margin-bottom: $spacing-unit / 2;
42
+ a {
43
+ color: #1177FF;
44
+ text-decoration: none;
45
+ text-rendering: optimizelegibility;
46
+ outline: 0;
47
+ &:focus,
48
+ &:active,
49
+ &:hover {
50
+ outline: 0;
51
+ }
38
52
  }
39
53
 
40
54
 
55
+ /* Typography */
41
56
 
42
- /**
43
- * Images
44
- */
45
- img {
46
- max-width: 100%;
47
- vertical-align: middle;
57
+ h1,
58
+ h2,
59
+ h3,
60
+ h4,
61
+ h5,
62
+ h6 {
63
+ margin: 0;
64
+ font-family: 'proxima-nova', Arial, sans-serif;
48
65
  }
49
66
 
67
+ h1 {
68
+ font-size: 280%;
69
+ font-weight: normal;
70
+ }
50
71
 
72
+ h2 {
73
+ font-size: 200%;
74
+ font-weight: normal;
75
+ }
51
76
 
52
- /**
53
- * Figures
54
- */
55
- figure > img {
56
- display: block;
77
+ h3 {
78
+ font-size: 150%;
57
79
  }
58
80
 
59
- figcaption {
60
- font-size: $small-font-size;
81
+ h4 {
82
+ font-size: 125%;
61
83
  }
62
84
 
85
+ h5 {
86
+ font-size: 110%;
87
+ }
63
88
 
89
+ h6 {
90
+ font-size: 100%;
91
+ }
64
92
 
65
- /**
66
- * Lists
67
- */
68
- ul, ol {
69
- margin-left: $spacing-unit;
93
+ b,
94
+ strong {
95
+ font-weight: bold;
70
96
  }
71
97
 
72
- li {
73
- > ul,
74
- > ol {
75
- margin-bottom: 0;
76
- }
98
+ hr {
99
+ -moz-box-sizing: content-box;
100
+ box-sizing: content-box;
101
+ display: block;
102
+ height: 1px;
103
+ border: 0;
104
+ border-top: 2px solid #1177FF;
105
+ margin: 1em 0;
106
+ padding: 0;
77
107
  }
78
108
 
109
+ p {
110
+ margin: .8em 0;
111
+ }
79
112
 
113
+ menu,
114
+ ul,
115
+ ol {
116
+ margin: 0;
117
+ padding: 0;
118
+ }
80
119
 
81
- /**
82
- * Headings
83
- */
84
- h1, h2, h3, h4, h5, h6 {
85
- font-weight: $base-font-weight;
120
+ menu,
121
+ ul {
122
+ list-style-image: none;
123
+ list-style: none;
86
124
  }
87
125
 
126
+ nav ul {
127
+ list-style: none;
128
+ list-style-image: none;
129
+ }
88
130
 
131
+ img {
132
+ border: 0;
133
+ -ms-interpolation-mode: bicubic;
134
+ }
89
135
 
90
- /**
91
- * Links
92
- */
93
- a {
94
- color: $brand-color;
95
- text-decoration: none;
96
136
 
97
- &:visited {
98
- color: darken($brand-color, 15%);
99
- }
137
+ /* Code formatting */
100
138
 
101
- &:hover {
102
- color: $text-color;
103
- text-decoration: none;
104
- }
139
+ pre,
140
+ code {
141
+ border: 1px solid #e8e8e8;
142
+ border-radius: 3px;
143
+ background-color: #eff;
144
+ }
105
145
 
106
- .social-media-list &:hover {
107
- text-decoration: none;
146
+ code {
147
+ padding: 1px 5px;
148
+ }
108
149
 
109
- .username {
110
- text-decoration: none;
150
+ pre {
151
+ padding: 8px 12px;
152
+ overflow-x: auto;
153
+ >code {
154
+ border: 0;
155
+ padding-right: 0;
156
+ padding-left: 0;
111
157
  }
112
- }
113
158
  }
114
159
 
115
-
116
- /**
117
- * Blockquotes
118
- */
119
160
  blockquote {
120
- color: $grey-color;
121
- border-left: 4px solid $grey-color-light;
122
- padding-left: $spacing-unit / 2;
123
- @include relative-font-size(1.125);
124
- letter-spacing: -1px;
125
- font-style: italic;
161
+ color: #333;
162
+ border-left: 10px solid #1177FF;
163
+ letter-spacing: -1px;
164
+ padding: 1em;
165
+ margin: 2em auto;
166
+ font-style: italic;
167
+ background: #fffafa;
168
+ > :last-child {
169
+ margin-bottom: 0;
170
+ }
171
+ }
172
+
173
+
174
+ /*-- Coloring pseudos text selection/inactive state. Sooth! :D --*/
175
+
176
+ * {
177
+ box-sizing: border-box;
178
+ &:after {
179
+ box-sizing: border-box;
180
+ }
181
+ &:before {
182
+ box-sizing: border-box;
183
+ }
184
+ }
126
185
 
127
- > :last-child {
128
- margin-bottom: 0;
129
- }
186
+ ::-moz-selection {
187
+ background: #a7d7ff;
188
+ color: #000;
189
+ text-shadow: none;
130
190
  }
131
191
 
192
+ ::selection {
193
+ background: #a7d7ff;
194
+ color: #000;
195
+ text-shadow: none;
196
+ &:window-inactive {
197
+ background: #eaeaea;
198
+ color: #000;
199
+ }
200
+ }
132
201
 
202
+ input:-webkit-autofill {
203
+ -webkit-box-shadow: 0 0 1000px #FBFBFB inset;
204
+ }
133
205
 
134
- /**
135
- * Code formatting
136
- */
137
- pre,
138
- code {
139
- @include relative-font-size(0.9375);
140
- border: 1px solid $grey-color-light;
141
- border-radius: 3px;
142
- background-color: #eef;
206
+ ::-webkit-input-placeholder {
207
+ color: #05f !important;
208
+ font-size: 13px;
143
209
  }
144
210
 
145
- code {
146
- padding: 1px 5px;
211
+ :-moz-placeholder {
212
+ color: #05f;
213
+ font-size: 13px;
147
214
  }
148
215
 
149
- pre {
150
- padding: 8px 12px;
151
- overflow-x: auto;
216
+ ::-moz-placeholder {
217
+ color: #05f;
218
+ font-size: 13px;
219
+ }
152
220
 
153
- > code {
154
- border: 0;
155
- padding-right: 0;
156
- padding-left: 0;
157
- }
221
+ :-ms-input-placeholder {
222
+ color: #05f;
223
+ font-size: 13px;
224
+ }
225
+
226
+ table {
227
+ border-collapse: collapse;
228
+ border-spacing: 0;
229
+ }
230
+
231
+ td,
232
+ th {
233
+ padding: 1vw;
234
+ vertical-align: top;
158
235
  }
159
236
 
160
237
 
238
+ /* Element Positioning */
239
+
240
+ .container {
241
+ margin: 44px 0 0 0;
242
+ background: white;
243
+ }
161
244
 
162
- /**
163
- * Wrapper
164
- */
165
245
  .wrapper {
166
- max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit} * 2));
167
- max-width: calc(#{$content-width} - (#{$spacing-unit} * 2));
168
- margin-right: auto;
169
- margin-left: auto;
170
- padding-right: $spacing-unit;
171
- padding-left: $spacing-unit;
172
- @extend %clearfix;
246
+ margin: 0 auto;
247
+ }
248
+
249
+ .left {
250
+ float: left;
251
+ left: 0;
252
+ }
173
253
 
174
- @include media-query($on-laptop) {
175
- max-width: -webkit-calc(#{$content-width} - (#{$spacing-unit}));
176
- max-width: calc(#{$content-width} - (#{$spacing-unit}));
177
- padding-right: $spacing-unit / 2;
178
- padding-left: $spacing-unit / 2;
179
- }
254
+ .right {
255
+ float: right;
256
+ right: 0;
180
257
  }
181
258
 
259
+ .center {
260
+ text-align: center;
261
+ margin: 0 auto;
262
+ }
263
+
264
+ .centerize {
265
+ margin: 0 auto;
266
+ }
182
267
 
268
+ .fixed {
269
+ position: fixed;
270
+ will-change: transform;
271
+ transform: translateZ(0);
272
+ }
183
273
 
184
- /**
185
- * Clearfix
186
- */
187
- %clearfix:after {
188
- content: "";
189
- display: table;
190
- clear: both;
274
+ .top {
275
+ top: 0;
191
276
  }
192
277
 
278
+ .bottom {
279
+ bottom: 0px;
280
+ }
193
281
 
282
+ .absolute-center {
283
+ margin: auto;
284
+ position: absolute;
285
+ top: 0;
286
+ left: 0;
287
+ bottom: 0;
288
+ right: 0;
289
+ }
194
290
 
195
- /**
196
- * Icons
197
- */
198
- .icon > svg {
199
- display: inline-block;
200
- vertical-align: middle;
291
+ .flex {
292
+ display: flex;
293
+ flex-wrap: wrap;
294
+ align-items: center;
295
+ justify-content: center;
296
+ }
201
297
 
202
- path {
203
- fill: $grey-color;
204
- }
298
+ .fold {
299
+ min-height: calc(90vh - 45px);
300
+ max-width: 100vw;
301
+ overflow-x: hidden;
302
+ -webkit-overflow-scrolling: touch;
205
303
  }
206
304
 
207
- .social-media-list {
208
- .icon {
209
- padding-right: 5px;
210
- }
211
305
 
212
- li + li {
213
- padding-top: 5px;
214
- }
306
+ /* -- Push aside, out & away ---*/
307
+
308
+ .side-gap {
309
+ margin-right: .5em;
310
+ margin-left: .5em;
215
311
  }
216
312
 
313
+ .top-gap {
314
+ margin-top: .5em;
315
+ }
217
316
 
317
+ .double-top-gap {
318
+ margin-top: 1em;
319
+ }
218
320
 
219
- /**
220
- * Tables
221
- */
222
- table {
223
- margin-bottom: $spacing-unit;
224
- width: 100%;
225
- text-align: $table-text-align;
226
- color: lighten($text-color, 18%);
227
- border-collapse: collapse;
228
- border: 1px solid $grey-color-light;
229
- tr {
230
- &:nth-child(even) {
231
- background-color: lighten($grey-color-light, 6%);
232
- }
233
- }
234
- th, td {
235
- padding: ($spacing-unit / 3) ($spacing-unit / 2);
236
- }
237
- th {
238
- background-color: lighten($grey-color-light, 3%);
239
- border: 1px solid darken($grey-color-light, 4%);
240
- border-bottom-color: darken($grey-color-light, 12%);
241
- }
242
- td {
243
- border: 1px solid $grey-color-light;
244
- }
321
+ .bottom-gap {
322
+ margin-bottom: 1em;
323
+ }
324
+
325
+ .double-bottom-gap {
326
+ margin-bottom: 2em;
327
+ }
328
+
329
+ .pad {
330
+ padding: 0.5em 1em;
331
+ }
332
+
333
+ .pad-vertically {
334
+ padding: 1em 0;
335
+ }
336
+
337
+ .pad-horizontally {
338
+ padding: 0 1em;
339
+ }
340
+
341
+
342
+ /* -- Text --*/
343
+
344
+ .justify {
345
+ text-align: justify;
346
+ }
347
+
348
+ .uppercase {
349
+ text-transform: uppercase;
350
+ }
351
+
352
+ .lowercase {
353
+ text-transform: lowercase;
354
+ }
355
+
356
+ .camelcase {
357
+ text-transform: capitalize;
358
+ }
359
+
360
+ .italics {
361
+ font-style: italic;
362
+ }
363
+
364
+ menu.horizontal-list li,
365
+ ul.horizontal-list li {
366
+ float: left;
367
+ }
368
+
369
+ .will-change {
370
+ will-change: transform;
371
+ transform: translate3d(0, 0, 0);
372
+ }
373
+
374
+ .unpointable {
375
+ pointer-events: none;
376
+ }
377
+
378
+ .pointable {
379
+ pointer-events: auto;
380
+ }
381
+
382
+ .ir {
383
+ background-color: transparent;
384
+ border: 0;
385
+ overflow: hidden;
386
+ *text-indent: -9999px;
387
+ &:before {
388
+ content: "";
389
+ display: block;
390
+ width: 0;
391
+ height: 150%;
392
+ }
393
+ }
394
+
395
+ .hidden {
396
+ display: none !important;
397
+ visibility: hidden;
398
+ }
399
+
400
+ .visuallyhidden {
401
+ border: 0;
402
+ clip: rect(0 0 0 0);
403
+ height: 1px;
404
+ margin: -1px;
405
+ overflow: hidden;
406
+ padding: 0;
407
+ position: absolute;
408
+ width: 1px;
409
+ &.focusable {
410
+ &:active,
411
+ &:focus {
412
+ clip: auto;
413
+ height: auto;
414
+ margin: 0;
415
+ overflow: visible;
416
+ position: static;
417
+ width: auto;
418
+ }
419
+ }
420
+ }
421
+
422
+ .invisible {
423
+ visibility: hidden;
424
+ }
425
+
426
+ .clearfix {
427
+ &:before {
428
+ content: " ";
429
+ display: table;
430
+ }
431
+ &:after {
432
+ content: " ";
433
+ display: table;
434
+ clear: both;
435
+ }
436
+ *zoom: 1;
437
+ }
438
+
439
+ @media (orientation: portrait) {
440
+ body {
441
+ .hide-on-mobiles {
442
+ display: none;
443
+ }
444
+ .display-on-mobiles {
445
+ display: inline-block;
446
+ }
447
+ .divide-in-half {
448
+ width: 90vw;
449
+ }
450
+ .one-half {
451
+ width: 100%;
452
+ }
453
+ .one-third {
454
+ width: 100%;
455
+ }
456
+ .two-third {
457
+ width: 100%;
458
+ }
459
+ .shrink {
460
+ width: 95%;
461
+ }
462
+ .align {
463
+ margin: 0 auto;
464
+ text-align: center;
465
+ }
466
+
467
+ }
468
+ }
469
+
470
+ @media (orientation: landscape) {
471
+ body {
472
+ .hide-on-mobiles {
473
+ display: marker;
474
+ }
475
+ .display-on-mobiles {
476
+ display: none;
477
+ }
478
+ .divide-in-half {
479
+ width: 50vw;
480
+ }
481
+ .one-half {
482
+ width: 50%;
483
+ }
484
+ .one-third {
485
+ width: 33.33333%;
486
+ }
487
+ .two-third {
488
+ width: 66.66666%;
489
+ }
490
+ .shrink {
491
+ width: 90%;
492
+ }
493
+ .align {
494
+ margin: 0 0;
495
+ }
496
+ .container {
497
+ width: calc(100vw - 208px);
498
+ margin-left: 208px;
499
+ }
500
+ }
501
+ }
502
+
503
+ @media print,
504
+ (-o-min-device-pixel-ratio: 5 / 4),
505
+ (-webkit-min-device-pixel-ratio: 1.25),
506
+ (min-resolution: 120dpi) {
507
+ /* Style adjustments for high resolution devices */
508
+ }
509
+
510
+ @media print {
511
+ * {
512
+ background: transparent !important;
513
+ color: #000 !important;
514
+ box-shadow: none !important;
515
+ text-shadow: none !important;
516
+ }
517
+ a {
518
+ text-decoration: underline;
519
+ &:visited {
520
+ text-decoration: underline;
521
+ }
522
+ &[href]:after {
523
+ content: " (" attr(href) ")";
524
+ }
525
+ }
526
+ abbr[title]:after {
527
+ content: " (" attr(title) ")";
528
+ }
529
+ .ir a:after {
530
+ content: "";
531
+ }
532
+ a {
533
+ &[href^="javascript:"]:after,
534
+ &[href^="#"]:after {
535
+ content: "";
536
+ }
537
+ }
538
+ pre,
539
+ blockquote {
540
+ border: 1px solid #999;
541
+ page-break-inside: avoid;
542
+ }
543
+ thead {
544
+ display: table-header-group;
545
+ }
546
+ tr {
547
+ page-break-inside: avoid;
548
+ }
549
+ img {
550
+ page-break-inside: avoid;
551
+ max-width: 100% !important;
552
+ }
553
+ @page {
554
+ margin: 0.5cm;
555
+ }
556
+ p,
557
+ h2,
558
+ h3 {
559
+ orphans: 3;
560
+ widows: 3;
561
+ }
562
+ h2,
563
+ h3 {
564
+ page-break-after: avoid;
565
+ }
245
566
  }