Quick search icon dislocated in responsive mode

#1
Hi,

I use a floating nav bar (only nav bar, no sub-nav or moderator bar). By default, the Quick Search Location is set to "2, Navigation Tab". This makes the floating nav bar look quite strange, with the quick search field "attached" to it while scrolling. So I changed the Quick Search Location to "1, Navigation Area". Much better! Only issue now: when I resize the screen into responsive mode, the search icon in the nav bar is dislocated. It is not in the nav bar, but almost outside the screen on top of the moderator bar.

This does not happen when the quick search location setting is reversed to 2.

See screenshot.

Cheers
 

Attachments

Russ

Pixel Exit Staff
#2
Sorry for the late response on this.

This is somewhat.... as-designed. Techncially if you set the search position to 1 it's no longer inside the navigation area therefore really shouldn't float with the navigation.

Setting it to option 2 does place it in the navigation area specifically in the sub-nav however since you're not floating the sub-nav you have two options:

Hide it when floating nav is actually floating:
Code:
.navFloatwrapper.fixed #QuickSearchPlaceholder {
display: none;
}
Or add some sort of background to to which may look awkward. as you'll have the block scrolling with with.
 

AlexT

Registered
#3
Hi Russ,

Not sure we are talking about the same thing. :eek: I was referring to the odd behavior when the skin's responsiveness kicks in. In the screenshot, do you see the arrow pointing to the top right? It's pointing to a fragment of the Font Awesome search icon. it's like the search icon "jumped" out of the navigation out of the screen as I resized the window and narrowed the width.
 

Russ

Pixel Exit Staff
#4
Hi Russ,

Not sure we are talking about the same thing. :eek: I was referring to the odd behavior when the skin's responsiveness kicks in. In the screenshot, do you see the arrow pointing to the top right? It's pointing to a fragment of the Font Awesome search icon. it's like the search icon "jumped" out of the navigation out of the screen as I resized the window and narrowed the width.
I see now :), I think you've put the logo back on top of the navigation. We need to find a better way of positioning it... but it may come down to manual adjustments as we have far too many options to get a global solution.
 

AlexT

Registered
#5
I see now :), I think you've put the logo back on top of the navigation. We need to find a better way of positioning it... but it may come down to manual adjustments as we have far too many options to get a global solution.
Hmmm. I only have "Enable logo in navigation" enabled. See attached screenshot (and also now better visible the misplaced search icon).
 

Attachments

Russ

Pixel Exit Staff
#6
Hmmm. I only have "Enable logo in navigation" enabled. See attached screenshot (and also now better visible the misplaced search icon).
Ya that would do it too, part of the we have a lot of options haha, does it with swap logo with navigation unchecked as well(default core setup), I'm working on some manual fixes to help with general things, but it will probably still come down to manual adjustments, I'll grab one for you in a bit.
 

Russ

Pixel Exit Staff
#7
I applied a few various fixes in regards to it, but it's definitely not a one-trick pony and more than likely depending on how much customization you've done an adjustment may need to be made.
 

Pre-Sale Questions

If you have any questions or concerns you want to ask before you make a purchase don't hesitate to use one of our multiple support channels for your convenience.