Skinning In 4.X

[Midnight Modding]

A lot of html just doesn't show up in mobile modes, etc.... despite me having no "hide" ie "show" options in. For instance, a sidebar with links.... In mobile mode, down below the rest of the page, it has the title of the sidebar, then nothing below it, ie no links showing up. There must be more to showing and hiding content in 4.x than those class options?

[Nathan Explosion]

Could you tell me the length of this piece of string that I am holding, please?

No...because you can't see it.

In other words....show your workings if you want help.

[Midnight Modding]

I was more asking in general how is anything disappearing when I have no hide options being used?

But here is what I did. I enabled the sidebar and then in my sidebar template I had the following:

<div id='elSomethingLinks' class='ipsWidget ipsWidget_vertical ipsBox'>
	<h3 class='ipsType_reset ipsWidget_title'>{lang="whatever"}</h3>
		<div class='ipsPad'>
			<div class='ipsSideMenu ipsAreaBackground_reset'>
				<ul class='ipsSideMenu_list'>
					<li>
						<a href='' class='ipsSideMenu_item'><strong class='ipsType_normal'>{lang="link_home"}</strong></a>
					</li>

 ... etc ...

Basically same html I had seen in some other sidebar template in the first party apps. A sidebar of links, but the links disappear when in a mobile mode. The title above the sidebar still shows up, just nothing below it.

[bfarber]

Because .ipsSideMenu_list is hidden on mobile by default. Don't use those CSS classes and the links won't be hidden.

[steve00]

Just now, bfarber said:

Because .ipsSideMenu_list is hidden on mobile by default. Don't use those CSS classes and the links won't be hidden.

Just beat me as found following in menus.css

	/* Non-JS fallback */
	.ipsSideMenu .ipsSideMenu_title,
	.ipsSideMenu .ipsSideMenu_subTitle,
	.ipsSideMenu .ipsSideMenu_list {
		display: none;
	}

 

[Midnight Modding]

Thanks. I've always been so bad with anything to do with design. I never knew where to start. I guess from now on I should just take the innermost class and work my way backwards, looking in css files until I notice something. At least in this case, I would have then noticed.

[Midnight Modding]

Just curious, btw, how did that class use js to begin with? I guess I'm just not seeing it due to my personal usage? This is what sucks about me having to basically just look at other examples and try the html is then it's not clear what each class is doing to affect it and there are so many classes. I can't think of and example of js being used in the side menu, though, or why a list would be good to hide. I guess the list they were hiding wasn't as important of a list as my navigation one.

[bfarber]

I don't really understand your last question. The CSS class is a CSS class. It's not using javascript - it is hidden because there is a responsive CSS definition that sets display:none when the viewport is under a certain width.

[Midnight Modding]

I asked because where stoo quoted the css file it says "non-js fallback", so I assumed that means the class is some backup class, related to whether or not js is enabled.