From c1f1eebe36d55746cf95ab5ca1098c1458d893bc Mon Sep 17 00:00:00 2001 From: Maapteh Date: Mon, 29 May 2023 13:56:51 +0200 Subject: [PATCH 01/10] fix: start with some printable containers Signed-off-by: Maapteh --- packages/core-components/src/layout/Page/Page.tsx | 5 +++++ packages/core-components/src/layout/Sidebar/Bar.tsx | 3 +++ .../core-components/src/layout/Sidebar/MobileSidebar.tsx | 3 +++ packages/core-components/src/layout/Sidebar/Page.tsx | 4 ++++ 4 files changed, 15 insertions(+) diff --git a/packages/core-components/src/layout/Page/Page.tsx b/packages/core-components/src/layout/Page/Page.tsx index 00988c475b..e388e0366a 100644 --- a/packages/core-components/src/layout/Page/Page.tsx +++ b/packages/core-components/src/layout/Page/Page.tsx @@ -33,6 +33,11 @@ const useStyles = makeStyles( [theme.breakpoints.down('xs')]: { height: '100%', }, + '@media print': { + display: 'block', + height: 'auto', + overflowY: 'inherit', + }, }, }), { name: 'BackstagePage' }, diff --git a/packages/core-components/src/layout/Sidebar/Bar.tsx b/packages/core-components/src/layout/Sidebar/Bar.tsx index 815d6bc0d6..8cb43ba007 100644 --- a/packages/core-components/src/layout/Sidebar/Bar.tsx +++ b/packages/core-components/src/layout/Sidebar/Bar.tsx @@ -63,6 +63,9 @@ const useStyles = makeStyles( '&::-webkit-scrollbar': { display: 'none', }, + '@media print': { + display: 'none', + }, }, drawerWidth: props => ({ width: props.sidebarConfig.drawerWidthClosed, diff --git a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx index 9000c2f10b..bf96703613 100644 --- a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx +++ b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx @@ -72,6 +72,9 @@ const useStyles = makeStyles( zIndex: theme.zIndex.snackbar, // SidebarDivider color borderTop: '1px solid #383838', + '@media print': { + display: 'none', + }, }, overlay: props => ({ diff --git a/packages/core-components/src/layout/Sidebar/Page.tsx b/packages/core-components/src/layout/Sidebar/Page.tsx index 5f660547d1..09935867b3 100644 --- a/packages/core-components/src/layout/Sidebar/Page.tsx +++ b/packages/core-components/src/layout/Sidebar/Page.tsx @@ -51,6 +51,10 @@ const useStyles = makeStyles< [theme.breakpoints.down('xs')]: { paddingBottom: props => props.sidebarConfig.mobileSidebarHeight, }, + '@media print': { + paddingLeft: '0px !important', + paddingBottom: '0px !important', + }, }, content: { zIndex: 0, From 36bedda8da9a3485d264f70c701ccea664911bb1 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Mon, 29 May 2023 14:22:28 +0200 Subject: [PATCH 02/10] -s fix: each container not breaked in start... Signed-off-by: Maapteh --- packages/core-components/src/layout/InfoCard/InfoCard.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.tsx index 3d8d0f3bb0..3034ce1cf2 100644 --- a/packages/core-components/src/layout/InfoCard/InfoCard.tsx +++ b/packages/core-components/src/layout/InfoCard/InfoCard.tsx @@ -92,6 +92,10 @@ const VARIANT_STYLES = { flexDirection: 'column', height: 'calc(100% - 10px)', // for pages without content header marginBottom: '10px', + breakInside: 'avoid', + '@media print': { + height: 'auto', + }, }, }, cardContent: { From e33beb1f2a8ef53bfc18339630eecf9c2ced45bb Mon Sep 17 00:00:00 2001 From: Maapteh Date: Mon, 29 May 2023 14:40:16 +0200 Subject: [PATCH 03/10] add changelog Signed-off-by: Maapteh --- .changeset/smart-ads-rush.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/smart-ads-rush.md diff --git a/.changeset/smart-ads-rush.md b/.changeset/smart-ads-rush.md new file mode 100644 index 0000000000..4f7cad0d49 --- /dev/null +++ b/.changeset/smart-ads-rush.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Make the documentation pages printable (also handy for exporting to pdf when go-green) From 69db3a7e9427da205342e33d81ef755e5620d730 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Mon, 29 May 2023 20:13:43 +0200 Subject: [PATCH 04/10] review Signed-off-by: Maapteh --- .changeset/smart-ads-rush.md | 2 +- packages/core-components/src/layout/Sidebar/Page.tsx | 3 +-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/.changeset/smart-ads-rush.md b/.changeset/smart-ads-rush.md index 4f7cad0d49..45ed2ff593 100644 --- a/.changeset/smart-ads-rush.md +++ b/.changeset/smart-ads-rush.md @@ -2,4 +2,4 @@ '@backstage/core-components': patch --- -Make the documentation pages printable (also handy for exporting to pdf when go-green) +Make the documentation pages printable (also handy for exporting to PDF) diff --git a/packages/core-components/src/layout/Sidebar/Page.tsx b/packages/core-components/src/layout/Sidebar/Page.tsx index 09935867b3..c0107256e1 100644 --- a/packages/core-components/src/layout/Sidebar/Page.tsx +++ b/packages/core-components/src/layout/Sidebar/Page.tsx @@ -52,8 +52,7 @@ const useStyles = makeStyles< paddingBottom: props => props.sidebarConfig.mobileSidebarHeight, }, '@media print': { - paddingLeft: '0px !important', - paddingBottom: '0px !important', + padding: '0px !important', }, }, content: { From f242762235ac2c0bf27498e7f782a50b3d75a994 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Mon, 29 May 2023 20:16:08 +0200 Subject: [PATCH 05/10] review Signed-off-by: Maapteh --- packages/core-components/src/layout/InfoCard/InfoCard.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core-components/src/layout/InfoCard/InfoCard.tsx b/packages/core-components/src/layout/InfoCard/InfoCard.tsx index 3034ce1cf2..c80e71b609 100644 --- a/packages/core-components/src/layout/InfoCard/InfoCard.tsx +++ b/packages/core-components/src/layout/InfoCard/InfoCard.tsx @@ -92,7 +92,7 @@ const VARIANT_STYLES = { flexDirection: 'column', height: 'calc(100% - 10px)', // for pages without content header marginBottom: '10px', - breakInside: 'avoid', + breakInside: 'avoid-page', '@media print': { height: 'auto', }, From 7493e042757efc83b45a192c8b58eedf530289a3 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Tue, 30 May 2023 17:33:12 +0200 Subject: [PATCH 06/10] can not run techdocs maybe this is it.. Signed-off-by: Maapteh --- .../src/reader/transformers/styles/rules/layout.ts | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts index c5e69e6084..24adabfcec 100644 --- a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts +++ b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts @@ -227,4 +227,14 @@ export default ({ theme, sidebar }: RuleOptions) => ` width: 12.1rem; } } + + +@media print { + .md-sidebar { + display: none; + } + .md-content { + margin: 0; + } +} `; From 4e15516aaf6364ed20592009a4d9636decb746fb Mon Sep 17 00:00:00 2001 From: Maapteh Date: Tue, 30 May 2023 17:38:10 +0200 Subject: [PATCH 07/10] only able to run e2e fixture documentation Signed-off-by: Maapteh --- .../techdocs/src/reader/transformers/styles/rules/layout.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts index 24adabfcec..4ab90e91e1 100644 --- a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts +++ b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts @@ -230,11 +230,14 @@ export default ({ theme, sidebar }: RuleOptions) => ` @media print { - .md-sidebar { + .md-sidebar, + #toggle-sidebar { display: none; } .md-content { margin: 0; + width: 100%; + max-width: 100%; } } `; From c695c3b5eaec1b4b3f3ed22caa755aaf4b310eb3 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Tue, 30 May 2023 17:39:46 +0200 Subject: [PATCH 08/10] only able to run e2e fixture documentation Signed-off-by: Maapteh --- .changeset/smart-ads-rush.md | 1 + 1 file changed, 1 insertion(+) diff --git a/.changeset/smart-ads-rush.md b/.changeset/smart-ads-rush.md index 45ed2ff593..369e5ab25b 100644 --- a/.changeset/smart-ads-rush.md +++ b/.changeset/smart-ads-rush.md @@ -1,5 +1,6 @@ --- '@backstage/core-components': patch +'@backstage/plugin-techdocs': patch --- Make the documentation pages printable (also handy for exporting to PDF) From 42132761151a3d90c588a9cd127838fca2456018 Mon Sep 17 00:00:00 2001 From: Maapteh Date: Tue, 30 May 2023 17:44:05 +0200 Subject: [PATCH 09/10] only able to run e2e fixture documentation Signed-off-by: Maapteh --- .../TechDocsReaderPageContent/TechDocsReaderPageContent.tsx | 3 +++ .../TechDocsReaderPageSubheader.tsx | 3 +++ 2 files changed, 6 insertions(+) diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx index 000a1ba275..1e5459fc9d 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPageContent/TechDocsReaderPageContent.tsx @@ -39,6 +39,9 @@ const useStyles = makeStyles({ width: 'calc(100% - 34.4rem)', margin: '0 auto', }, + '@media print': { + display: 'none', + }, }, }); diff --git a/plugins/techdocs/src/reader/components/TechDocsReaderPageSubheader/TechDocsReaderPageSubheader.tsx b/plugins/techdocs/src/reader/components/TechDocsReaderPageSubheader/TechDocsReaderPageSubheader.tsx index f3612aa46e..85f04655fd 100644 --- a/plugins/techdocs/src/reader/components/TechDocsReaderPageSubheader/TechDocsReaderPageSubheader.tsx +++ b/plugins/techdocs/src/reader/components/TechDocsReaderPageSubheader/TechDocsReaderPageSubheader.tsx @@ -39,6 +39,9 @@ const useStyles = makeStyles(theme => ({ flexDirection: 'column', minHeight: 'auto', padding: theme.spacing(3, 3, 0), + '@media print': { + display: 'none', + }, }, })); From c0806fe2b2e93f335264e411dd5b748fd195828a Mon Sep 17 00:00:00 2001 From: Maapteh Date: Tue, 30 May 2023 17:49:42 +0200 Subject: [PATCH 10/10] only able to run e2e fixture documentation Signed-off-by: Maapteh --- plugins/techdocs/src/reader/transformers/styles/rules/layout.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts index 4ab90e91e1..cce6af7d6f 100644 --- a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts +++ b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts @@ -234,6 +234,7 @@ export default ({ theme, sidebar }: RuleOptions) => ` #toggle-sidebar { display: none; } + .md-content { margin: 0; width: 100%;