Hey Andy

Re desktop menu:
I added 2 links to show my point (edited screenshots – see private content).
– In the Flashlight menu, part of the menu area is transparent (top and near bottom)
– the Flashlight menu is moved to the right (this is what your code is supposed to do – unfortunately I don’t see any change)

How can I move the menu and create the partial transparency in Enfold?

*******************************************************
Re mobile menu:
Your code reduces the width of the menu, however:
(please check the screenshot from a responsive theme in the private content)
1) the area on the left of the (reduced width) menu should be transparent (remember, my goal is that the menu slider must not hide the entire screen)
2) is there a way to make the width of the menu slider flexible, i.e. self-adapting to the width of the content of the menu, instead of a having a fixed percentage of the fullsize slider (if there are only short items in the menu, the slider should be smaller, when the content includes long words, the menu slider should get wider accordingly). Of course I can check and adjust the width when I add a new menu item, but it would be more elegant if this happened automatically.

Regards,
Bruno

BTW: these desktop design elements were what caught my eye, when I first saw the Flashlight demo, therefore I would like to recreate it in Enfold

Hi

my post starts with the following statements (quote):
– My current site http://www.fotowalther.ch is created with Flashlight (non-responsive).
– I might switch to Enfold, provided there is a solution for the menu as described.
**************
My questions (requirements for switching) are:
1) I want the desktop menu to look the same with Enfold as with Flashlight (see mockup or active homepage)
2) the mobile menu must NOT hide the entire screen (it should be flexible and only take the width required to accomodate the menu as shown in the mockup).

I was then asked to create mockups to show my points.
There must be a fundamental misunderstanding. Why would you like me to show the solution when I am asking to know if it can be done in the first place?
To see how it looks when the mobile menu hides the entire screen please check any of the Enfold demos. I’m asking because I don’t want the menu to look like this. I wonder whether it would be possible with a CSS code or a file modification to achieve what I want.

Regards,
Bruno

Hi Yigit

thanks for the ultrafast reply!
I also appreciate your creating tutorials (I assume this should also help you with redundant questions).
For future reference I’m also trying to create my own database with codes and resources I come across browsing the support forum.

Cheers,

Bruno

Hi Yigit

It seems that I missed the boat.
I have just noticed that the “Enfold shop demo” addresses part of my question.

The only thing I hate about it is that the side menu hides the entire screen of a mobile device.
Is there a workaround in Enfold?
See: https://s.codepen.io/lukejacksonn/fullembedgrid/PwmwWV?type=embed&animations=run# (I would replace the number with text “more”).

Best regards,
Bruno

more examples: https://css-tricks.com/the-priority-navigation-pattern/

• This reply was modified 8 years, 10 months ago by bruwa.