From ee081038645b97f4b31d3d233c0b7f6bae172964 Mon Sep 17 00:00:00 2001 From: tolking Date: Tue, 21 Jul 2020 22:05:49 +0800 Subject: [PATCH 1/7] feat: add print media --- .../core/lib/client/components/OutboundLink.vue | 5 +++++ .../theme-default/components/Navbar.vue | 4 ++++ .../theme-default/components/PageEdit.vue | 3 +++ .../theme-default/components/Sidebar.vue | 4 ++++ .../@vuepress/theme-default/styles/code.styl | 17 ++++++++++++++++- .../theme-default/styles/custom-blocks.styl | 6 ++++++ .../@vuepress/theme-default/styles/index.styl | 17 +++++++++++++++++ 7 files changed, 55 insertions(+), 1 deletion(-) diff --git a/packages/@vuepress/core/lib/client/components/OutboundLink.vue b/packages/@vuepress/core/lib/client/components/OutboundLink.vue index 06f8ba08b0..ab5e146368 100644 --- a/packages/@vuepress/core/lib/client/components/OutboundLink.vue +++ b/packages/@vuepress/core/lib/client/components/OutboundLink.vue @@ -28,4 +28,9 @@ position: relative; top: -1px; } +@media print { + .icon.outbound { + display: none; + } +} diff --git a/packages/@vuepress/theme-default/components/Navbar.vue b/packages/@vuepress/theme-default/components/Navbar.vue index f8dd49ca68..afad0cfd35 100644 --- a/packages/@vuepress/theme-default/components/Navbar.vue +++ b/packages/@vuepress/theme-default/components/Navbar.vue @@ -137,4 +137,8 @@ $navbar-horizontal-padding = 1.5rem overflow hidden white-space nowrap text-overflow ellipsis + +@media print + .navbar + display none diff --git a/packages/@vuepress/theme-default/components/PageEdit.vue b/packages/@vuepress/theme-default/components/PageEdit.vue index e1ac3ca096..ea1a5594e8 100644 --- a/packages/@vuepress/theme-default/components/PageEdit.vue +++ b/packages/@vuepress/theme-default/components/PageEdit.vue @@ -140,4 +140,7 @@ export default { float none text-align left +@media print + .page-edit + display none diff --git a/packages/@vuepress/theme-default/components/Sidebar.vue b/packages/@vuepress/theme-default/components/Sidebar.vue index e70e33367a..89c6612969 100644 --- a/packages/@vuepress/theme-default/components/Sidebar.vue +++ b/packages/@vuepress/theme-default/components/Sidebar.vue @@ -61,4 +61,8 @@ export default { top calc(1rem - 2px) & > .sidebar-links padding 1rem 0 + +@media print + .sidebar + display none diff --git a/packages/@vuepress/theme-default/styles/code.styl b/packages/@vuepress/theme-default/styles/code.styl index 9d3aa9a541..e77b0cdd57 100644 --- a/packages/@vuepress/theme-default/styles/code.styl +++ b/packages/@vuepress/theme-default/styles/code.styl @@ -57,7 +57,7 @@ div[class*="language-"] &.line-numbers-mode .highlight-lines .highlighted position relative - &:before + &::before content ' ' position absolute z-index 3 @@ -134,4 +134,19 @@ div[class~="language-bash"]:before div[class~="language-php"]:before content "php" +@media print + {$contentClass} pre code, {$contentClass} pre[class*="language-"] code + color #000 + page-break-inside avoid + + code, pre, div[class*="language-"], div[class*="language-"] .highlight-lines .highlighted + background-color #fff + page-break-inside avoid + + div[class*="language-"].line-numbers-mode .highlight-lines + .highlighted::before + &::after + background-color #fff + page-break-inside avoid + @import '~prismjs/themes/prism-tomorrow.css' diff --git a/packages/@vuepress/theme-default/styles/custom-blocks.styl b/packages/@vuepress/theme-default/styles/custom-blocks.styl index 5b868166a4..578b256ed9 100644 --- a/packages/@vuepress/theme-default/styles/custom-blocks.styl +++ b/packages/@vuepress/theme-default/styles/custom-blocks.styl @@ -42,3 +42,9 @@ summary outline none cursor pointer + +@media print + .custom-block .custom-block-title + &.tip, &.warning, &.danger, &.details + background-color #fff + \ No newline at end of file diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 976bfb0447..0b3de9fb15 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -198,4 +198,21 @@ th, td .page padding-left 0 +@media print + body + color #000 + + h1, h2, h3, h4, h5 + page-break-after avoid + page-break-before avoid + + img, table + page-break-inside avoid + + h2+p + page-break-before avoid + + a[href^="http://"]::after, a[href^="https://"]::after + content " [" attr(href) "] " + @require 'mobile.styl' From 6467a2da23f17503c2ca5003c6fe3cdbadfb584e Mon Sep 17 00:00:00 2001 From: tolking Date: Wed, 22 Jul 2020 16:37:53 +0800 Subject: [PATCH 2/7] fix: print media on Firefox --- packages/@vuepress/theme-default/styles/code.styl | 1 + packages/@vuepress/theme-default/styles/index.styl | 7 +++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/@vuepress/theme-default/styles/code.styl b/packages/@vuepress/theme-default/styles/code.styl index e77b0cdd57..75546a2a03 100644 --- a/packages/@vuepress/theme-default/styles/code.styl +++ b/packages/@vuepress/theme-default/styles/code.styl @@ -137,6 +137,7 @@ div[class~="language-php"]:before @media print {$contentClass} pre code, {$contentClass} pre[class*="language-"] code color #000 + white-space pre-wrap page-break-inside avoid code, pre, div[class*="language-"], div[class*="language-"] .highlight-lines .highlighted diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 0b3de9fb15..8db3172d76 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -198,6 +198,8 @@ th, td .page padding-left 0 +@require 'mobile.styl' + @media print body color #000 @@ -206,7 +208,7 @@ th, td page-break-after avoid page-break-before avoid - img, table + img page-break-inside avoid h2+p @@ -215,4 +217,5 @@ th, td a[href^="http://"]::after, a[href^="https://"]::after content " [" attr(href) "] " -@require 'mobile.styl' + .page + padding-left 0 From 35d10b0cf01e5fc21ad5a5bfd22b0767758e8983 Mon Sep 17 00:00:00 2001 From: tolking Date: Wed, 22 Jul 2020 16:53:52 +0800 Subject: [PATCH 3/7] fix: styles on table --- packages/@vuepress/theme-default/styles/index.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 8db3172d76..39d57166aa 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -208,7 +208,7 @@ th, td page-break-after avoid page-break-before avoid - img + img, table page-break-inside avoid h2+p From a97267cd7506f4cf1060090f2329c9ed09059bfd Mon Sep 17 00:00:00 2001 From: tolking Date: Tue, 21 Jul 2020 22:05:49 +0800 Subject: [PATCH 4/7] feat: add print media --- .../core/lib/client/components/OutboundLink.vue | 5 +++++ .../theme-default/components/Navbar.vue | 4 ++++ .../theme-default/components/PageEdit.vue | 3 +++ .../theme-default/components/Sidebar.vue | 4 ++++ .../@vuepress/theme-default/styles/code.styl | 17 ++++++++++++++++- .../theme-default/styles/custom-blocks.styl | 6 ++++++ .../@vuepress/theme-default/styles/index.styl | 17 +++++++++++++++++ 7 files changed, 55 insertions(+), 1 deletion(-) diff --git a/packages/@vuepress/core/lib/client/components/OutboundLink.vue b/packages/@vuepress/core/lib/client/components/OutboundLink.vue index 06f8ba08b0..ab5e146368 100644 --- a/packages/@vuepress/core/lib/client/components/OutboundLink.vue +++ b/packages/@vuepress/core/lib/client/components/OutboundLink.vue @@ -28,4 +28,9 @@ position: relative; top: -1px; } +@media print { + .icon.outbound { + display: none; + } +} diff --git a/packages/@vuepress/theme-default/components/Navbar.vue b/packages/@vuepress/theme-default/components/Navbar.vue index f8dd49ca68..afad0cfd35 100644 --- a/packages/@vuepress/theme-default/components/Navbar.vue +++ b/packages/@vuepress/theme-default/components/Navbar.vue @@ -137,4 +137,8 @@ $navbar-horizontal-padding = 1.5rem overflow hidden white-space nowrap text-overflow ellipsis + +@media print + .navbar + display none diff --git a/packages/@vuepress/theme-default/components/PageEdit.vue b/packages/@vuepress/theme-default/components/PageEdit.vue index e1ac3ca096..ea1a5594e8 100644 --- a/packages/@vuepress/theme-default/components/PageEdit.vue +++ b/packages/@vuepress/theme-default/components/PageEdit.vue @@ -140,4 +140,7 @@ export default { float none text-align left +@media print + .page-edit + display none diff --git a/packages/@vuepress/theme-default/components/Sidebar.vue b/packages/@vuepress/theme-default/components/Sidebar.vue index e70e33367a..89c6612969 100644 --- a/packages/@vuepress/theme-default/components/Sidebar.vue +++ b/packages/@vuepress/theme-default/components/Sidebar.vue @@ -61,4 +61,8 @@ export default { top calc(1rem - 2px) & > .sidebar-links padding 1rem 0 + +@media print + .sidebar + display none diff --git a/packages/@vuepress/theme-default/styles/code.styl b/packages/@vuepress/theme-default/styles/code.styl index 9d3aa9a541..e77b0cdd57 100644 --- a/packages/@vuepress/theme-default/styles/code.styl +++ b/packages/@vuepress/theme-default/styles/code.styl @@ -57,7 +57,7 @@ div[class*="language-"] &.line-numbers-mode .highlight-lines .highlighted position relative - &:before + &::before content ' ' position absolute z-index 3 @@ -134,4 +134,19 @@ div[class~="language-bash"]:before div[class~="language-php"]:before content "php" +@media print + {$contentClass} pre code, {$contentClass} pre[class*="language-"] code + color #000 + page-break-inside avoid + + code, pre, div[class*="language-"], div[class*="language-"] .highlight-lines .highlighted + background-color #fff + page-break-inside avoid + + div[class*="language-"].line-numbers-mode .highlight-lines + .highlighted::before + &::after + background-color #fff + page-break-inside avoid + @import '~prismjs/themes/prism-tomorrow.css' diff --git a/packages/@vuepress/theme-default/styles/custom-blocks.styl b/packages/@vuepress/theme-default/styles/custom-blocks.styl index 5b868166a4..578b256ed9 100644 --- a/packages/@vuepress/theme-default/styles/custom-blocks.styl +++ b/packages/@vuepress/theme-default/styles/custom-blocks.styl @@ -42,3 +42,9 @@ summary outline none cursor pointer + +@media print + .custom-block .custom-block-title + &.tip, &.warning, &.danger, &.details + background-color #fff + \ No newline at end of file diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 976bfb0447..0b3de9fb15 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -198,4 +198,21 @@ th, td .page padding-left 0 +@media print + body + color #000 + + h1, h2, h3, h4, h5 + page-break-after avoid + page-break-before avoid + + img, table + page-break-inside avoid + + h2+p + page-break-before avoid + + a[href^="http://"]::after, a[href^="https://"]::after + content " [" attr(href) "] " + @require 'mobile.styl' From a008a7ca11aead72eee790ede03f8e5c1d1ba1a4 Mon Sep 17 00:00:00 2001 From: tolking Date: Wed, 22 Jul 2020 16:37:53 +0800 Subject: [PATCH 5/7] fix: print media on Firefox --- packages/@vuepress/theme-default/styles/code.styl | 1 + packages/@vuepress/theme-default/styles/index.styl | 7 +++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/@vuepress/theme-default/styles/code.styl b/packages/@vuepress/theme-default/styles/code.styl index e77b0cdd57..75546a2a03 100644 --- a/packages/@vuepress/theme-default/styles/code.styl +++ b/packages/@vuepress/theme-default/styles/code.styl @@ -137,6 +137,7 @@ div[class~="language-php"]:before @media print {$contentClass} pre code, {$contentClass} pre[class*="language-"] code color #000 + white-space pre-wrap page-break-inside avoid code, pre, div[class*="language-"], div[class*="language-"] .highlight-lines .highlighted diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 0b3de9fb15..8db3172d76 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -198,6 +198,8 @@ th, td .page padding-left 0 +@require 'mobile.styl' + @media print body color #000 @@ -206,7 +208,7 @@ th, td page-break-after avoid page-break-before avoid - img, table + img page-break-inside avoid h2+p @@ -215,4 +217,5 @@ th, td a[href^="http://"]::after, a[href^="https://"]::after content " [" attr(href) "] " -@require 'mobile.styl' + .page + padding-left 0 From bed09a73c85e476079609d296d6c9e2d525e051b Mon Sep 17 00:00:00 2001 From: tolking Date: Wed, 22 Jul 2020 16:53:52 +0800 Subject: [PATCH 6/7] fix: styles on table --- packages/@vuepress/theme-default/styles/index.styl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/@vuepress/theme-default/styles/index.styl b/packages/@vuepress/theme-default/styles/index.styl index 8db3172d76..39d57166aa 100644 --- a/packages/@vuepress/theme-default/styles/index.styl +++ b/packages/@vuepress/theme-default/styles/index.styl @@ -208,7 +208,7 @@ th, td page-break-after avoid page-break-before avoid - img + img, table page-break-inside avoid h2+p From 0b9ae0ab623a8c9c3a4633479c6e1f6e811366e3 Mon Sep 17 00:00:00 2001 From: tolking Date: Sat, 25 Jul 2020 10:46:22 +0800 Subject: [PATCH 7/7] chore: optimize the order --- packages/@vuepress/theme-default/styles/code.styl | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/@vuepress/theme-default/styles/code.styl b/packages/@vuepress/theme-default/styles/code.styl index 75546a2a03..e3c4b75cae 100644 --- a/packages/@vuepress/theme-default/styles/code.styl +++ b/packages/@vuepress/theme-default/styles/code.styl @@ -134,6 +134,8 @@ div[class~="language-bash"]:before div[class~="language-php"]:before content "php" +@import '~prismjs/themes/prism-tomorrow.css' + @media print {$contentClass} pre code, {$contentClass} pre[class*="language-"] code color #000 @@ -149,5 +151,3 @@ div[class~="language-php"]:before &::after background-color #fff page-break-inside avoid - -@import '~prismjs/themes/prism-tomorrow.css'