Pangolin 121 menu weird behaviour

tomowensphoto · 2017-07-08 20:36:07

Afternoon Chaps,
I have noticed something odd going on with my flyout menus on desktop only as obviously they are flat on mobile
menuondesktop
If I try and slide down to the different galleries or indeed the sub-menu off About, the menu disappears. Also note the strange behaviour of it appearing behind content.
This has happened since I updated to 1.2.1. and misbehaves in Firefox 52.2.1 but seems to be OK in Chrome 59.0.3071.115
Any clues?
Thanks.

Last edited by tomowensphoto (2017-07-08 21:42:16)

rod barbee · 2017-07-08 21:41:17

Matt, this looks like that damned Firefox z-index thing rearing it's ugly head again. I'm not seeing this in other browsers on Tom's site.

I can't reproduce it in my own test sites though.

tomowensphoto · 2017-07-08 21:43:38

We just posted simultaneously Rod! I had my lunch and thought about testing in another browser and edited my post. Obviously a Firefox irritation.

Last edited by tomowensphoto (2017-07-08 21:43:56)

jherman · 2017-07-08 21:54:30

Same issue with my site. I was just puzzling through including making sure my FF cache was cleared, etc. Chrome, IE and Edge all work fine. In Firefox the menu is behind the content. Doesn't seem to be a problem if the window is narrow enough that the pallet changes to the mobile menu.

Jim.

rod barbee · 2017-07-08 21:56:16

I'm surprised that it's showing up again, considering the number of times Matt's squashed it.

Wish I could reproduce it though. I've got a Pangolin only test site as well as my original Backlight test site, which is mostly made up of Okapi pages. I have pages with the nav in the header in the Pangolin test site and I also created a Pangolin page in the original Backligth test site with the Nav in the header. Both are working fine.

rod barbee · 2017-07-08 21:59:55

just for testing, can you disable any phplugins or custom css and see what happens?

tomowensphoto · 2017-07-08 22:11:13

Hi Rod,
Disabled both custom css and phplugins, refreshed cache and refreshed Firefox in new instance and still the same. Chrome OK. This is in Windows 10. I will switch over to MAC OS and see what happens.
Regards

tomowensphoto · 2017-07-08 22:26:14

Hi Rod,
Now in the dark side. MAC OS Firefox 54.0.1 64 bit - the Windows version is32 bit. Same result with Css and plugins back on. I turned both off and the same dodgy behaviour.
Menus work fine in Chrome and Safari
CSS and plugins tuned on and OK in Chrome and safari but broken in Firefox.
Regards,

Matthew · 2017-07-08 22:52:57

I think this is happening again because of something I added in an attempt to provide a workaround for issues like jherman was having with his sidebar widget. Obviously, that didn't work out. I think you can use this to put things back as they were previously:

.content { z-index: auto }

z-index is quickly becoming one of my least favorite things in CSS.

tomowensphoto · 2017-07-08 23:10:29

Thanks Matthew,
That fixed it.

Matthew · 2017-07-08 23:23:09

Great. This will hopefully be a nonissue forever more from the next update onward. I've spent the day doing a comprehensive audit of pangolin's CSS, reorganizing, in some places simplifying, in others improving ... now that I've gotten to see what people are trying to do and some of the problems they're encountering, I'm looking to eliminate these things at their source, rather than attempting to patch over them.

I will hopefully be able to rework the top pallet a bit as well, so that the problematic things people have been trying to do with it might cease to be problematic. Still trying to sort that out, though ...

And hopefully if people put Wordpress widgets into their sidebars that for some reason are coded with absurd and unnecessary z-index values, that won't cause problems anymore. This is one of the frustrating things about Wordpress ... you have thousands of people writing plugins, sometimes coding rather irresponsibly, in ways that don't mesh with code written by other people ...

tomowensphoto · 2017-07-08 23:52:45

Thanks Matthew.
That reads like a shed load of work.
On the WP widgets front I did notice a slight formatting issue after the 1.2.1 fixes. I cannot say for certain that it was not like this before the upgrade though.
The standard archive widget is chopping off the bottom of the text slightly.
I hope I have not used dodgy widgets as they are default ones to pick from and my only addition is the Kodak text widget
I have to say that for me the whole upgrade has been the easiest by far which indicates how much effort went into the back end.

Thanks

Last edited by tomowensphoto (2017-07-09 00:20:20)

jherman · 2017-07-08 23:56:11

Better but sill sits under the Theater presentation.

SunFoxNC · 2017-07-09 00:23:08

"This is one of the frustrating things about Wordpress ... you have thousands of people writing plugins, sometimes coding rather irresponsibly, in ways that don't mesh with code written by other people ..."

Cowboy coding and not even trying to investigate and implement best practices and standards is the bane of any professional programmer's existence...and I'll be the first to admit I've been guilty of it myself from time to time, especially when it comes to the UI which as a back-end programmer has always been my weakest skill. In fact, one of the higher-priority things on my plate for a pro-bono database application I've written over the past 3-4 years is to finally wrangle all of the ad-hoc styling into a real stylesheet.

In over 20 years of driving the keyboard, I've learnt it's not enough to merely accomplish the task at hand...any code monkey with "XXX Language for Dummies" can write code that is worse than any virus can do that.

The mark of a true programming artisan is one who takes pride in the designing and crafting of elegant code that works well and plays well with others and incorporates industry best practices. And then when that is done, they test it thoroughly and document it well before releasing it to the wild.

Of course, there are times where even the most careful programmer has to deal with the fact that customer demands and the odd "execrement happens" are going to require taking extraordinary measures and occasionally that means it's you're Hawkeye Pierce doing some meatball surgery on the code quickly to get the customer running again.

It's what happens afterward that separates the amateur poseurs from the professionals.

Professionals will take the time after the immediate crisis is sorted to go back and clean up the hacks (or document them if they've got to stay) and update the test suite to test these new test cases. Professionals will go back and refactor code to make it easier to reuse and prune out the dead code. Professionals are constantly keeping up with the moving target that is the industry standards and new technologies that can be brought to bear on a problem. All of which doesn't necessarily show up in the budget or the schedule but still need to be done which is why a professional programmer's week is rarely only 40 hours...we're often doing these things on our own time and dime because whilst management will rarely see the value in these activities...you do when you have to debug and support that code two years down the road!

But most importantly, a true professional programmer is at their heart a creative individual and an artist which is something they have as much of a passion for as they do reading the latest technical journals or playing with the newest technology. Invariably the best programmers I've ever recommended for hire were the ones who were photographers or poets or writers or painters...you've got to have a creative mind to truly allow yourself to see all of the possible solutions to a problem...some of which may not be at all obvious to the casual observer.

There are plenty of industries where "Ratatouille" Chef Auguste Gusteau's adage that "anyone can cook!" works well...but professional programming ain't one of them!

rod barbee · 2017-07-09 00:38:43

Matthew wrote:

Great. This will hopefully be a nonissue forever more from the next update onward....

That won't bite you in the butt....

Ben · 2017-07-09 06:46:22

We do our best, but such lofty ideals aren't always achievable in a world of 168 hour weeks filled with customer support, day jobs, family and other commitments.

Ben · 2017-07-09 07:29:04

I do agree that there's so much crap out there. 'Everybody can code' translates to a mess. My personal bane is the world of JavaScript. Sites with JS stacks of dozens of dependencies, code that gets compiled to other code, layers of build tools, source code trees of hundreds of megabytes, when all that is warranted is a few dozen lines of hand-codes JS. This didn't come about from developers who cared about simplicity or elegance.

We should strive to be much closer to the ideal that you outlined. We're in a good position at TTG to control our own destiny in this regard.

tomowensphoto · 2017-07-10 18:12:58

Hi Matthew & Ben,
The menu problem persists if clicking on the Galleries menu whilst playing my Theater album. This behaviour only in Firefox and is correcte3d on other pages.

Thought I had better mention it, sorry.

Matthew · 2017-07-10 20:42:11

tomowensphoto wrote:

Thought I had better mention it, sorry.

No worries, I'm already on it.

While I'm here, does anyone in this thread want to help beta test the next update, i.e. the one that's supposed to fix everything to do with this, and more? If so, shoot me an email.

michilge · 2017-07-20 07:31:28

Maybe I found another z-index related thing which I like the way it is, but I'm not sure if it is intended like this.

I have a secondary masthead in a template. The menu button floats above the content of my main column, while the social media icons from the top pallet stay behind it.

edit: for some reason inserting my image doesn't seem to work with https.
It is here: https://www.michilge.de/extfiles/z-index-sample.jpg

Again: I like it the way it is. The menu button is important and should stay on top, while the social media icons may well fall into the background.

Last edited by michilge (2017-07-20 07:37:30)

michilge · 2017-07-23 10:02:39

Oops. I was to quick to say, I like it the way it is.
When the page is viewed on a phone or in a narrow window on the desktop, the social media icons in the top pallet are covered by the spinal column an are not reachable anymore.

Matthew · 2017-07-23 13:19:36

I'm not able to reproduce this. What browser are you using, and what type of page are we on (album, page, etc.), with what type of content (theater vegas, album single-image, etc.)?

michilge · 2017-07-23 14:38:26

Blog post: https://fotos.michilge.de/blog/kleine-gartenbastelei/

Albumset: https://fotos.michilge.de/galleries/TSG … son_16-17/

Album: https://fotos.michilge.de/galleries/TSG … rwe_rueck/

Matthew · 2017-07-23 16:48:34

Thanks. This should fix:

@media screen and ( max-width: 1024px ) {
.page__body > .page__pallet__top { z-index: 1 ;}
}

Replace the 1024 with your own breakpoint value, from the Layout section of your template configuration.

michilge · 2017-07-24 01:27:47

I put that into my custom.css and it works out fine.

Community @ The Turning Gate

#1 2017-07-08 20:36:07

Pangolin 121 menu weird behaviour

#2 2017-07-08 21:41:17

Re: Pangolin 121 menu weird behaviour

#3 2017-07-08 21:43:38

Re: Pangolin 121 menu weird behaviour

#4 2017-07-08 21:54:30

Re: Pangolin 121 menu weird behaviour

#5 2017-07-08 21:56:16

Re: Pangolin 121 menu weird behaviour

#6 2017-07-08 21:59:55

Re: Pangolin 121 menu weird behaviour

#7 2017-07-08 22:11:13

Re: Pangolin 121 menu weird behaviour

#8 2017-07-08 22:26:14

Re: Pangolin 121 menu weird behaviour

#9 2017-07-08 22:52:57

Re: Pangolin 121 menu weird behaviour

#10 2017-07-08 23:10:29

Re: Pangolin 121 menu weird behaviour

#11 2017-07-08 23:23:09

Re: Pangolin 121 menu weird behaviour

#12 2017-07-08 23:52:45

Re: Pangolin 121 menu weird behaviour

#13 2017-07-08 23:56:11

Re: Pangolin 121 menu weird behaviour

#14 2017-07-09 00:23:08

Re: Pangolin 121 menu weird behaviour

#15 2017-07-09 00:38:43

Re: Pangolin 121 menu weird behaviour

#16 2017-07-09 06:46:22

Re: Pangolin 121 menu weird behaviour

#17 2017-07-09 07:29:04

Re: Pangolin 121 menu weird behaviour

#18 2017-07-10 18:12:58

Re: Pangolin 121 menu weird behaviour

#19 2017-07-10 20:42:11

Re: Pangolin 121 menu weird behaviour

#20 2017-07-20 07:31:28

Re: Pangolin 121 menu weird behaviour

#21 2017-07-23 10:02:39

Re: Pangolin 121 menu weird behaviour

#22 2017-07-23 13:19:36

Re: Pangolin 121 menu weird behaviour

#23 2017-07-23 14:38:26

Re: Pangolin 121 menu weird behaviour

#24 2017-07-23 16:48:34

Re: Pangolin 121 menu weird behaviour

#25 2017-07-24 01:27:47

Re: Pangolin 121 menu weird behaviour

Board footer