How to create a View for screens smaller than X

2

I have a MVC4 site, which is not responsive, and changing its entire implementation just to make it responsive does not seem productive at all because it's a site where many people worked and there's a lot of " give me life

My idea was to create Views from scratch, but these would only appear on mobile devices. This way I built the site in bootstrap, and when I had enough pages I used those views to always appear on any screen (as I plan to bootstrap it will work fine).

I've seen articles that added .Mobile to _Layout.cshtml , getting _Layout.Mobile.cshtml but I do not think it's exactly what I'm looking for.

    
asked by anonymous 25.05.2017 / 21:52

1 answer

1

The simplest way to develop segmenting by screen size is by using CSS:

@media screen and (min-width: 480px) {
    body {
        /* Estilos caso a tela tenha 480px de largura ou mais */
    }
}

Basically, you can use 4 media types:

  • All (all types);
  • Print (print layout);
  • Screen;
  • Speech (a software or speech device).

You can also have MVC identify the User Agent (in this case browser version) and return a specific layout to it, as you specified in your question. Here's a good description complete how to use , but basically just use the following in your Global.asax.cs :

protected void Application_Start()
{
    var displayModes = DisplayModeProvider.Instance.Modes;

    ...
}

This only enables the use of a _Layout.Mobile.cshtml or Views with .Mobile.cshtml , and MVC automatically swaps the layout for you.

    
25.05.2017 / 22:14