How to control the size of the viewBox in svg depending on the width of the browser viewport?

Question

css

I have a logo with text like this

.
I hide the text "WordPress" using media queries depending on the width of the viewport (only screen and (max-width: 768px)), but the width of the viewbox does not become smaller. Is it possible to adapt the logo without js and without an additional shortened file?
codepen.io/anon/pen/rywmVq

Answer 1

Use two svgs
and read about viewBox