diff --git a/frontend/src/components/home/AddToHomeScreen.vue b/frontend/src/components/home/AddToHomeScreen.vue index cd41cd8a5..2a5239c45 100644 --- a/frontend/src/components/home/AddToHomeScreen.vue +++ b/frontend/src/components/home/AddToHomeScreen.vue @@ -69,6 +69,10 @@ const shouldShowMessage = computed(() => { @media screen and (min-width: $tablet) { display: none; } + + @media print { + display: none; + } &.has-update-available { bottom: 5rem; diff --git a/frontend/src/components/misc/Modal.vue b/frontend/src/components/misc/Modal.vue index 807a24245..e65724818 100644 --- a/frontend/src/components/misc/Modal.vue +++ b/frontend/src/components/misc/Modal.vue @@ -154,12 +154,15 @@ $modal-width: 1024px; // scrolling-content // used e.g. for .scrolling .modal-content { - max-width: $modal-width; width: 100%; margin: $modal-margin auto; max-height: none; // reset bulma overflow: visible; // reset bulma + + @media not print { + max-width: $modal-width; + } @media screen and (min-width: $tablet) { max-height: none; // reset bulma @@ -167,7 +170,7 @@ $modal-width: 1024px; width: 100%; } - @media screen and (max-width: $desktop) { + @media screen and (max-width: $desktop), print { margin: 0; } } @@ -211,6 +214,28 @@ $modal-width: 1024px; @media screen and (min-width: $tablet) and (max-width: #{$desktop + $close-button-min-space}) { top: .75rem; } + +} + +@media print { + .modal-mask { + position: static; + overflow: visible !important; + } + + .modal-container { + height: auto; + overflow: visible; + } + + .modal-content { + position: static; + } + + .close { + display: none; + } + } @@ -219,4 +244,15 @@ $modal-width: 1024px; .dark .close { color: var(--grey-900); } - \ No newline at end of file + +@media print { + body:has(.modal-mask) { + height: auto; + overflow: visible; + + #app { + display: none; + } + } +} +