Sidebar Navigation - FINAL INSTALLMENT

Showcase Tips and Tricks
21

@tim.young so the default vertical on tadabase can’t be reliable so it’s better to use your method of html menu, right?

22

@tim.young how do I add the user profile photo to the variables? I can’t get it to work on mine…

23

Hi @manuelchhjny,

The user profile picture is an image field in the Users data table.

screenshot-build.tadabase.io-2021.01.29-10_56_38
screenshot-build.tadabase.io-2021.01.29-10_56_381504×860 101 KB

I added the field to the HTML using the “Logged-in User Fields” format

screenshot-build.tadabase.io-2021.01.19-13_21_49

The fields that are from the Logged In User are located in this section of the HTML in my original post :point_down:

<header class="avatar">{loggedInUser.Image}
<h2>{loggedInUser.Name}</h2>
</header>
24

I noticed that mine was oval, do I need to upload square image to achieve perfect circle for the profile image @tim.young?

25

Ah, yes - good catch. My profile image is 512x512

1 Like
26

how do you make the logout link to look as a simple text link - “Tim Young Logout” and not to be included in a scrolldown menu?

27

@tim.young if you set the menu width to 100vw there is no way to close this. Is there a way to create a back button in this to close the menu?

28

Hey @beaugast ,

The height is set to 100vh, not width :grinning:

29

Right. I’m using 100vh and 100vw. To cover the whole screen. Need a way to close the popup menu from within the popup menu.

30

Not an expert opinion here but I would try 2 classes - one for menu_open and one for menu_closed with different widths and toggling these classes via JavaScript.

1 Like