I have a header in LayoutTopMenu . The userlogin info block overlaps the app name in responsive screen.
Can anyone please suggest how can I put the user info inside sidemenu in responsive screen ?
In desktop view :
Hi Sai kiran Parvatham,
What you are trying to do can be achieved with CSS.Try to take a look in some templates from OutSystems.
Also you can put this UserInfo inside an IF and set its condition to see if it is a Mobile view...
There is an action you can use for this:
This way you can hide it if it is from a Mobile.And show inside the menu with the same condition.
However, If you want to use it in Desktop with the responsive Mobile view I think it will not work.
And you will have to use CSS
There is a class that is applied in a main div, depending on what size you are using, that can help with.
For example:
Tablet have the class tablet:
Small Desktop have the class small and desktop:
This way you can set css to hide this block when is a tablet for example:
.tablet.UserInfoBlockClass
{
display: none;
}
Raphael Ranieri wrote:
Can you please tell the name of the css class to modify to make the userinfo block come inside the side menu in mobile view.
Sai, it will depend on your code.
And you can even add a class for your own...However the OutSystems Themes already have this behavior.
For example, I created a sample app using Dublin Theme, see what happen:
Normal size:
Resized to Mobile:
Try to hit f5 to make sure it refreshed.And dig in the Dublin Theme Css also: https://www.outsystems.com/forge/component-overview/917/dublin-template