DEV Community

loading...

Discussion on: Building an A4 resume to add to your website (and making it printable)

Collapse
khrome83 profile image
Zane Milakovic

What a great example of grid, to use html to create a page layout.

Nice work!

You can also have your print query hide your header and adjust margins to make it so the only thing on the print is the resume itself.

Collapse
coopercodes profile image
๐Ÿงธ ๐Ÿณ๏ธโ€๐ŸŒˆ cooper-codes ๐Ÿ’ป ๐ŸŽฎ Author

That was what I originally tried to do when I put it in my Svelte app, but as Svelte is structured differently and changes names I couldnโ€™t target those parts to ignore.
So after struggling with that for a while I found you can target things you only want to print.
And it fixed my conundrum

Collapse
khrome83 profile image
Zane Milakovic

You should be able to โ€œdisplay:noneโ€ items in a print media query.

You just need to have a class on those items. I have not see this with svelte.

Honestly though, I typically write a print style sheet outside of svelte and just attach it globally.

Thread Thread
coopercodes profile image
๐Ÿงธ ๐Ÿณ๏ธโ€๐ŸŒˆ cooper-codes ๐Ÿ’ป ๐ŸŽฎ Author

Yeah, it worked fine as a simple HTML and SCSS page, but I couldn't target higher up the tree in svelte I think because they are components and they just weren't being picked up.
So I went the other way and just targeted what I needed to... ended up being less code than the other way too.