Fix printing. (#2177)

Fixes printing. The issue is that SPA added an additional `root` div to
the body and all our elements now live inside of that. The following css
stopped working because of that.
```css
body > * {
   display: none;
}
```

For now I just added a rule to hide the `tldraw__editor`, which should
be a relatively safe thing to do.

We should think about improving this down the line:
1. We should allow the user to tell us about the root of where the
tldraw lives and then target elements based on that (or allow users to
customize the `usePrint` and other similar features)
2. We probably should not append stuff directly to the `body` as we
currently do.

Fixes https://github.com/tldraw/tldraw/issues/2147

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Add some shapes to the doc.
2. Use print and check that we only show the shapes / frames in the
print preview. There should be no UI visible.

### Release Notes

- Fixes printing of shapes.
This commit is contained in:
Mitja Bezenšek 2023-11-08 12:47:00 +01:00 committed by GitHub
parent a771b05bf2
commit 0e39c31c6e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -59,6 +59,10 @@ export function usePrint() {
display: none; display: none;
} }
.tldraw__editor {
display: none;
}
.${className} { .${className} {
display: block !important; display: block !important;
background: white; background: white;