locked
How to design Blazor App for Both DeskTop and Mobile Browser RRS feed

 > 

  • Question

  • Question
    Sign in to vote
    0
    Sign in to vote
    User-1980778524 posted

    Hi NewBie for Blazor. 

    I started playing around with Blazor app using VS2019.  I have this problem which I hope someone can help me.

    1. How  to design the Blazor-based Webpage that can be shown in DeskTop and Mobile Browser in terms of Page design As mobile Page Layout is different from DeskTop?

         Base on the Default App in VS2019,  The Navigation Menu and the Display Pane are on the Same Page.  How this will show in Mobile Phone?

    2. The Landing Page name must be Index.html?

    I see this Tag in Index.html 

    <meta name="viewport" content="width=device-width" />

    but there is no such Tag in Blazor_webpage.razor

    Would appreciate if you can point me to the correct reference to read and to practice.

    Thanks

    Thursday, May 30, 2019 1:56 PM

Answers

  • Question
    Sign in to vote
    0
    Sign in to vote
    User-821857111 posted

    Blazor applications render HTML, so you would use the same approach as any other HTML-based application - either produce different versions for desk top and mobile, or use responsive design to control the layout based on the width of the viewport.

    https://en.wikipedia.org/wiki/Responsive_web_design

    The index.html file houses the Blazor application. You can consider it like a Master or Layout page in that what is placed in it will appear in every page in the Blazor app. The version in the default template already references the most popular responsive UI framework library - Bootstrap. If you want to add any other global script or style assets, you do that in index.html.

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, May 31, 2019 8:31 AM