Main menu/ mobile user menu

Started by Julius_2000, September 17, 2022, 06:25:49 AM

Previous topic - Next topic

Julius_2000

Hi everyone, I hope this is the correct board to post this in...

I've got two questions regarding the main menu.

  • Where can I find the php file in which I can change,add or re-arrange some elements within the menu? So far, I've almost looked up any file in the default theme folder but wasn't able to find the menu buttons for things like button_admin, button_search etc.
    I would need to address them there directly instead of just using css for formatting.

  • Second question is more directed at the way the mobile menu is behaving:

    At the beginning of my theme modding experience (coding noob here), I noticed that the mobile menu would affect the "regular" menu (because they're are the same) going from potrait mode to landscape mode. So, if I closed the mobile menu in potrait mode and switched to landscape, the menu would disappear. Or likewise, in some smaller size media queries in portrait modes, the menu would already be open and couldn't be closed. I looked at what was happening and it seems that the Javascript code would insert a "style="display: none" line and thus overwrite anything set up in CSS. Would it be possible to let Java just insert an empty style instead (style=""), so that specified display properties in CSS would not be overwritten?
    I sort of circumvented the issue by rewriting some CSS lines using the !important value to at least stop this unwanted behavior but now I have to deal with otherings because of that (e.g. having  two login/ signup menues showing when logged out). I tested this bevavior in the SMF default theme, too, just to rule out it was caused by the theme I'm using.

Any help would be much appreciated.

@rjen

1. Subs.php

There are topics explaining how to change the menu : use the search functionality...
Running SMF 2.1 with latest TinyPortal at www.fjr-club.nl

Julius_2000

#2
Oh dang, I'm sorry. I usually do. My apologies. And thank you!

Hm, I can't seem to find a way to restructure the html layout in sub.php

The dev-tool shows me the menu is structured like that:


Ususally, I can find that very strucutre inside a php file. The sub.php only seems to address the general function of the menu (or am I missing something?).
I would like to reposition the amt-class element because I want to block the textmenu class element. But when I do that in CSS, also the amt class which shows the number-of-report-icon will disappears as well because it's inside of said textmenu element.

Doug Heffernan

Have a look at the setupMenuContext() function in the aforementioned file.

Julius_2000

The pic got too small:


in the index.template.php it only shows this
Quoteecho '
    <div id="main_menu">
    <div id="mobile_user_menu" class="popup_container">
            <div class="popup_window description">
        <div class="popup_heading">', $txt['mobile_user_menu'], '
           <a href="javascript:void(0);" class="main_icons hide_popup"></a>
                            </div>
                      ', template_menu(), '
                    </div></div>
                </div>';
I assume the template_menu() line is doing the structuring?

Kindred

Subs.php defines the menu content (text, links, etc)

index.template.php defines the menu OUTPUT (aka display)

template_menu as a function should be in the same template file (as far as I can remember)
Слaва
Украинi

Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

"Loki is not evil, although he is certainly not a force for good. Loki is... complicated."

Antechinus

Quote from: Julius_2000 on September 17, 2022, 06:25:49 AMHi everyone, I hope this is the correct board to post this in...

I've got two questions regarding the main menu.

  • Second question is more directed at the way the mobile menu is behaving:

    Would it be possible to let Java just insert an empty style instead (style=""), so that specified display properties in CSS would not be overwritten?
Honestly, the javascript for that is so tangled up with the code for other things that the easiest option would be to simply change the ID's on the menu elements, so the javascript didn't catch them, then write you own code to handle the presentation you want.

Julius_2000

Quote from: Antechinus on September 17, 2022, 06:37:07 PM
Quote from: Julius_2000 on September 17, 2022, 06:25:49 AMHi everyone, I hope this is the correct board to post this in...

I've got two questions regarding the main menu.

  • Second question is more directed at the way the mobile menu is behaving:

    Would it be possible to let Java just insert an empty style instead (style=""), so that specified display properties in CSS would not be overwritten?
Honestly, the javascript for that is so tangled up with the code for other things that the easiest option would be to simply change the ID's on the menu elements, so the javascript didn't catch them, then write you own code to handle the presentation you want.

But changing the ID would mean the mobile menues wouldn't work at all anymore. I am just a novice at all of this, so writing Java code would be a bit of a hassle for me.
Has anyone of you experienced the same issues - disappearing menues in landscape when closed in potrait mode & opened menues in potrait mode at certain screen widths (tested via the browser's screen emulation and mobile phones)? I mean, I noticed it while using the default theme going from portrait to landscape and the menu was missing. Is it supposed to work this way?

I feel like having Java only inserting an empty display value instead of a defined "none" value would solve that issue pretty easily (if that's possible to do).

Antechinus

Quote from: Julius_2000 on September 21, 2022, 05:34:09 AMBut changing the ID would mean the mobile menus wouldn't work at all anymore. I am just a novice at all of this, so writing Java code would be a bit of a hassle for me.
I agree that it is probably not a novice-level task as such, although a determined novice could probably do it with enough coaching along the way. However, getting functioning desktop/mobile menus does not actually require any javascript at all. IMO the way it was done in 2.1 is unnecessarily convoluted, which makes tweaking it problematic. :)

Advertisement: