# No more switchable mobile/desktop layouts?

**URL:** https://meta.discourse.org/t/no-more-switchable-mobile-desktop-layouts/397463
**Category:** UX
**Tags:** mobile, ux
**Created:** [March 2, 2026, 7:03pm UTC](https://meta.discourse.org/t/no-more-switchable-mobile-desktop-layouts/397463 "2026-03-02T19:03:21Z")
**Posts on this page:** 1
**Showing post:** 5

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [March 2, 2026, 10:00pm UTC](https://meta.discourse.org/t/no-more-switchable-mobile-desktop-layouts/397463/5 "2026-03-02T22:00:09Z")

</div>

> [@merefield](#):
>
> One of the downsides of this approach is you can’t run device specific logic in an initialiser.

There are limits to doing this that we’ve removed with new methods — determining capabilities on init is fairly inflexible, if something changes we’d have to reload the whole page.

This is useful because devices are less predictable now: phones can unfold into tablets, laptops can convert into tablets, you can plug in a keyboard and mouse to so many things…

It feels different if you’re used to the old way, but anything you were doing in an initializer is likely still possible _and_ more responsive to changing capabilities.

> [@merefield](#):
>
> A classic example is setting a different homepage for mobile vs desktop - you can’t do this now.

You can, now it’s more granular and you conditionally show/hide content within the same template rather than swapping out the whole thing. For example, we have a viewport object in our capabilities service now…

In a template…

```hbs
{{#if this.capabilities.viewport.lg}}
  Content for large screens
{{/if}}

{{#if this.capabilities.viewport.sm}}
  Content for very small screens 
{{/if}}

```

or in JS…

```js
get myContent() {
  if (this.capabilities.viewport.sm) {
    return "short content";
  } else {
    return "the very very long content"
  }
}

```

and then in CSS you can align with the same breakpoints like…

```scss
@use "lib/viewport";

.my-element {
  font-size: 1em;
  @include viewport.until(sm) {
     font-size: 2em;
  } 
}

```

---

_[View the full topic](https://meta.discourse.org/t/no-more-switchable-mobile-desktop-layouts/397463)._