diff options
| -rw-r--r-- | scss/_print.scss | 141 | ||||
| -rw-r--r-- | scss/_variables.scss | 7 | ||||
| -rw-r--r-- | scss/bootstrap.scss | 1 | ||||
| -rw-r--r-- | scss/utilities/_display.scss | 9 | ||||
| -rw-r--r-- | site/content/docs/4.3/components/navbar.md | 1 | ||||
| -rw-r--r-- | site/content/docs/4.3/getting-started/browsers-devices.md | 14 | ||||
| -rw-r--r-- | site/content/docs/4.3/getting-started/theming.md | 1 | ||||
| -rw-r--r-- | site/content/docs/4.3/migration.md | 1 |
8 files changed, 1 insertions, 174 deletions
diff --git a/scss/_print.scss b/scss/_print.scss deleted file mode 100644 index 883b782e7..000000000 --- a/scss/_print.scss +++ /dev/null @@ -1,141 +0,0 @@ -// stylelint-disable declaration-no-important, selector-no-qualifying-type - -// Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css - -// ========================================================================== -// Print styles. -// Inlined to avoid the additional HTTP request: -// https://www.phpied.com/delay-loading-your-print-css/ -// ========================================================================== - -@if $enable-print-styles { - @media print { - *, - *::before, - *::after { - // Bootstrap specific; comment out `color` and `background` - //color: $black !important; // Black prints faster - text-shadow: none !important; - //background: transparent !important; - box-shadow: none !important; - } - - a { - &:not(.btn) { - text-decoration: underline; - } - } - - // Bootstrap specific; comment the following selector out - //a[href]::after { - // content: " (" attr(href) ")"; - //} - - abbr[title]::after { - content: " (" attr(title) ")"; - } - - // Bootstrap specific; comment the following selector out - // - // Don't show links that are fragment identifiers, - // or use the `javascript:` pseudo protocol - // - - //a[href^="#"]::after, - //a[href^="javascript:"]::after { - // content: ""; - //} - - pre { - white-space: pre-wrap !important; - } - pre, - blockquote { - border: $border-width solid $gray-500; // Bootstrap custom code; using `$border-width` instead of 1px - page-break-inside: avoid; - } - - // - // Printing Tables: - // https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables - // - - thead { - display: table-header-group; - } - - tr, - img { - page-break-inside: avoid; - } - - p, - h2, - h3 { - orphans: 3; - widows: 3; - } - - h2, - h3 { - page-break-after: avoid; - } - - // Bootstrap specific changes start - - // Specify a size and min-width to make printing closer across browsers. - // We don't set margin here because it breaks `size` in Chrome. We also - // don't use `!important` on `size` as it breaks in Chrome. - @page { - size: $print-page-size; - } - body { - min-width: $print-body-min-width !important; - } - .container { - min-width: $print-body-min-width !important; - } - - // Bootstrap components - .navbar { - display: none; - } - .badge { - border: $border-width solid $black; - } - - .table { - border-collapse: collapse !important; - - td, - th { - background-color: $white !important; - } - } - - .table-bordered { - th, - td { - border: 1px solid $gray-300 !important; - } - } - - .table-dark { - color: inherit; - - th, - td, - thead th, - tbody + tbody { - border-color: $table-border-color; - } - } - - .table .thead-dark th { - color: inherit; - border-color: $table-border-color; - } - - // Bootstrap specific changes end - } -} diff --git a/scss/_variables.scss b/scss/_variables.scss index 9d3f69c15..45b1f1dca 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -114,7 +114,6 @@ $enable-transitions: true !default; $enable-prefers-reduced-motion-media-query: true !default; $enable-grid-classes: true !default; $enable-pointer-cursor-for-buttons: true !default; -$enable-print-styles: true !default; $enable-responsive-font-sizes: false !default; $enable-validation-icons: true !default; $enable-deprecation-messages: true !default; @@ -1126,9 +1125,3 @@ $pre-scrollable-max-height: 340px !default; $displays: none, inline, inline-block, block, table, table-row, table-cell, flex, inline-flex !default; $overflows: auto, hidden !default; $positions: static, relative, absolute, fixed, sticky !default; - - -// Printing - -$print-page-size: a3 !default; -$print-body-min-width: map-get($grid-breakpoints, "lg") !default; diff --git a/scss/bootstrap.scss b/scss/bootstrap.scss index 112e28af8..5ba0ac151 100644 --- a/scss/bootstrap.scss +++ b/scss/bootstrap.scss @@ -40,4 +40,3 @@ @import "carousel"; @import "spinners"; @import "utilities"; -@import "print"; diff --git a/scss/utilities/_display.scss b/scss/utilities/_display.scss index 130367998..217672998 100644 --- a/scss/utilities/_display.scss +++ b/scss/utilities/_display.scss @@ -1,9 +1,5 @@ // stylelint-disable declaration-no-important -// -// Utilities for common `display` values -// - @each $breakpoint in map-keys($grid-breakpoints) { @include media-breakpoint-up($breakpoint) { $infix: breakpoint-infix($breakpoint, $grid-breakpoints); @@ -14,11 +10,6 @@ } } - -// -// Utilities for toggling `display` in print -// - @media print { @each $value in $displays { .d-print-#{$value} { display: $value !important; } diff --git a/site/content/docs/4.3/components/navbar.md b/site/content/docs/4.3/components/navbar.md index 3ed738616..66a70c7a2 100644 --- a/site/content/docs/4.3/components/navbar.md +++ b/site/content/docs/4.3/components/navbar.md @@ -14,7 +14,6 @@ Here's what you need to know before getting started with the navbar: - Navbars and their contents are fluid by default. Use [optional containers](#containers) to limit their horizontal width. - Use our [spacing]({{< docsref "/utilities/spacing" >}}) and [flex]({{< docsref "/utilities/flex" >}}) utility classes for controlling spacing and alignment within navbars. - Navbars are responsive by default, but you can easily modify them to change that. Responsive behavior depends on our Collapse JavaScript plugin. -- Navbars are hidden by default when printing. Force them to be printed by adding `.d-print` to the `.navbar`. See the [display]({{< docsref "/utilities/display" >}}) utility class. - Ensure accessibility by using a `<nav>` element or, if using a more generic element such as a `<div>`, add a `role="navigation"` to every navbar to explicitly identify it as a landmark region for users of assistive technologies. {{< callout info >}} diff --git a/site/content/docs/4.3/getting-started/browsers-devices.md b/site/content/docs/4.3/getting-started/browsers-devices.md index c1d9fdf89..3b6c05ee8 100644 --- a/site/content/docs/4.3/getting-started/browsers-devices.md +++ b/site/content/docs/4.3/getting-started/browsers-devices.md @@ -129,20 +129,6 @@ The `.dropdown-backdrop` element isn't used on iOS in the nav because of the com Page zooming inevitably presents rendering artifacts in some components, both in Bootstrap and the rest of the web. Depending on the issue, we may be able to fix it (search first and then open an issue if need be). However, we tend to ignore these as they often have no direct solution other than hacky workarounds. -## Printing - -Even in some modern browsers, printing can be quirky. - -As of Safari v8.0, use of the fixed-width `.container` class can cause Safari to use an unusually small font size when printing. See [issue #14868]({{< param repo >}}/issues/14868) and [WebKit bug #138192](https://bugs.webkit.org/show_bug.cgi?id=138192) for more details. One potential workaround is the following CSS: - -{{< highlight css >}} -@media print { - .container { - width: auto; - } -} -{{< /highlight >}} - ## Android stock browser Out of the box, Android 4.1 (and even some newer releases apparently) ship with the Browser app as the default web browser of choice (as opposed to Chrome). Unfortunately, the Browser app has lots of bugs and inconsistencies with CSS in general. diff --git a/site/content/docs/4.3/getting-started/theming.md b/site/content/docs/4.3/getting-started/theming.md index f1428d289..aa94a31dd 100644 --- a/site/content/docs/4.3/getting-started/theming.md +++ b/site/content/docs/4.3/getting-started/theming.md @@ -241,7 +241,6 @@ You can find and customize these variables for key global options in Bootstrap's | `$enable-grid-classes` | `true` (default) or `false` | Enables the generation of CSS classes for the grid system (e.g., `.container`, `.row`, `.col-md-1`, etc.). | | `$enable-caret` | `true` (default) or `false` | Enables pseudo element caret on `.dropdown-toggle`. | | `$enable-pointer-cursor-for-buttons` | `true` (default) or `false` | Add "hand" cursor to non-disabled button elements. | -| `$enable-print-styles` | `true` (default) or `false` | Enables styles for optimizing printing. | | `$enable-responsive-font-sizes` | `true` or `false` (default) | Enables [responsive font sizes]({{< docsref "/content/typography#responsive-font-sizes" >}}). | | `$enable-validation-icons` | `true` (default) or `false` | Enables `background-image` icons within textual inputs and some custom forms for validation states. | | `$enable-deprecation-messages` | `true` or `false` (default) | Set to `true` to show warnings when using any of the deprecated mixins and functions that are planned to be removed in `v5`. | diff --git a/site/content/docs/4.3/migration.md b/site/content/docs/4.3/migration.md index 2d72b893d..cfff87b48 100644 --- a/site/content/docs/4.3/migration.md +++ b/site/content/docs/4.3/migration.md @@ -32,6 +32,7 @@ Changes to our source Sass files and compiled CSS. - **Todo:** New variables? - **Todo:** Rearrange forms source files (under `scss/forms/`) - **Todo:** Rearrange grid source files (under `scss/grid/`) +- Removed print styles and `$enable-print-styles` variable. Print display classes, however, have remained intact. [See #28339](https://github.com/twbs/bootstrap/pull/28339). ## JavaScript |