# Can we use \`.gjs\` for route templates?

**URL:** <https://meta.discourse.org/t/can-we-use-gjs-for-route-templates/357046>\
**Category:** Development\
**Created:** [March 12, 2025, 11:39pm UTC](https://meta.discourse.org/t/can-we-use-gjs-for-route-templates/357046 "2025-03-12T23:39:40Z")\
**Posts on this page:** 1\
**Showing post:** 6

<div class="post-metadata">

**Author:** ![Alteras](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/alteras/32/582398_2.png) [@Alteras](https://meta.discourse.org/u/Alteras)\
**Post date:** [March 14, 2025, 3:07am UTC](https://meta.discourse.org/t/can-we-use-gjs-for-route-templates/357046/6 "2025-03-14T03:07:06Z")

</div>

If its just styling for an actually printed page, and you don’t mind the navbar and extra stuff when viewing the page, you can use `@media print` CSS selector to change the styling when printing. Discourse already hides a lot of things during print ([discourse/app/assets/stylesheets/common/printer-friendly.scss at main · discourse/discourse · GitHub](https://github.com/discourse/discourse/blob/main/app/assets/stylesheets/common/printer-friendly.scss)). You can preview the page using `print media simulation` mode in firefox’s inspect mode. There should be an equivalent feature in chrome’s inspect mode.

 ![A developer is using an Inspect element tool in a web browser to examine the HTML code of the Dev Tourism website, with the "Can we use" website's dropdown menu displayed on the top-right. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/0/c/7/0c77d030c0162c9ac07d7e4494f770b01d46ec30.png)

If you need a complete blank canvas to work with, not just in the print mode but also in normal web browsing, you can use a bit of CSS trickery.  
Suppose your glimmer component has a root div with `id="print-component__root"`, we can let CSS check for its existence with a `:has()` selector (or just add/remove a class to body from the glimmer component lifecycle), and selectively apply styling.

```scss
body:has(#print-component__root) {
  header,
  .avatar,
  .sidebar-wrapper,
  ... {
    all: unset !important; // all: unset might be a bit too aggressive
    display: none !important;
  }
}

#print-component__root {
  // normal styling
}

```

There might be a better, cleaner way that would actually remove the DOM elements, but the CSS is a good workaround to reset everything.

---

_[View the full topic](https://meta.discourse.org/t/can-we-use-gjs-for-route-templates/357046)._