UI.X

UI.X 1.5.22.0

No permission to download
I think we have the flickering issue of the sticky nav fixed (safari and chrome). Was anyone else experiencing this?

What's the possibility of having the sidebar scroll affixed as an option?

It is something we are working on. The problem is that our framework supports multiple sticky elements and we want it to work with all our other settings too. So, we are still working on a perfect solution. But it'll be available soon.
 
Can I stop the navigation bar from activating its drop-downs? When someone clicks the nav bar, I want it to just jump to the URL, not force them to click a second time (e.g. right now if you are at "home" and you click "forums" it gives you a drop down, and you have to click forums again to move to the forum section).
 
That's not normal behavior, (that I'm aware of) at least not when the drop down arrows are enabled. Not entirely sure how this framework/style works when the drop down arrows are disabled in the UI.X options.
 
That's not normal behavior, (that I'm aware of) at least not when the drop down arrows are enabled. Not entirely sure how this framework/style works when the drop down arrows are disabled in the UI.X options.

I wish I could "like" this more than once. I just enabled the drop down arrows and it fixed the issue. Thank you - it's been an irritant to me during the whole test cycle.
 
I guess this is feedback for the UI.X guys... @Audentio This:

Enable Navigation Drop-Down Arrows
Always show navigation tabs' arrow icons, indicating a drop-down menu.

Is not clear that it actually changes the functionality of the navigation bar. It looks like a visual tweak (display arrows vs. hide arrows), but it's actually a functional tweak - if the arrows are hidden, it causes the entire navigation tab to become a drop down. I would actually prefer to both hide the arrows and disable the drop down but this will suffice for now.
 
How can I remove the padding on the top above the header? I think it's padding on the wrapper.

Yes, can you send me a screenshot or a link so I know what code to create?

I guess this is feedback for the UI.X guys... @Audentio This:

Is not clear that it actually changes the functionality of the navigation bar. It looks like a visual tweak (display arrows vs. hide arrows), but it's actually a functional tweak - if the arrows are hidden, it causes the entire navigation tab to become a drop down. I would actually prefer to both hide the arrows and disable the drop down but this will suffice for now.

It isn't supposed to. But let me explain whats happening:

So, you are going to click on 'Forums' to take you to the forum index. But you are on the members tab so Forums is a drop-down. As soon as you hover on (that is to say, with this setting the whole thing becomes the dropdown trigger as opposed to just the arrow icon), the dropdown begins to, well, drop. So in that split second of you hovering and the other split second that the dropdown begins to move, you cannot actually click on the link because you are clicking on something moving, something probably not the link. I know exactly what you are talking about and I'm honestly not sure how to fix it. It is something that, yes, just disabling the setting fixes but until I can figure out why

We take the code for this from the account tab. See how it does it there too? So technically you can argue its a XenForo menu bug :/
 
It isn't supposed to. But let me explain whats happening:

So, you are going to click on 'Forums' to take you to the forum index. But you are on the members tab so Forums is a drop-down. As soon as you hover on (that is to say, with this setting the whole thing becomes the dropdown trigger as opposed to just the arrow icon), the dropdown begins to, well, drop.

That's actually not happening on my site. When I'm on a tab and I hover over another tab that has a drop down, nothing drops - the tab has its hover state activate (it changes color) but it does not drop down. It's not until I click the tab that I get the drop down. I'm PM'ing you shortly with a link to the beta site so you can at least see what I mean.

Like I said, not a big deal, especially since it's fixed now - just letting you know it might help to give clarity for that checkbox.
 
That's actually not happening on my site. When I'm on a tab and I hover over another tab that has a drop down, nothing drops - the tab has its hover state activate (it changes color) but it does not drop down. It's not until I click the tab that I get the drop down. I'm PM'ing you shortly with a link to the beta site so you can at least see what I mean.

Like I said, not a big deal, especially since it's fixed now - just letting you know it might help to give clarity for that checkbox.
Are you on mobile? That is expected behavior then. I appreciate you letting me know and am interested in you showing me the issue if you'd like.
 
It is late and I'm tired of messing with it so I'm just going to ask... how do I remove the border radius on the top breadcrumb box (I did a fun navigation change for my site)? I tried adding noBorderRadiusBottom noBorderRadiusTop but that seems to have taken no effect.

And the top radius on the main container?
 
It is late and I'm tired of messing with it so I'm just going to ask... how do I remove the border radius on the top breadcrumb box (I did a fun navigation change for my site)? I tried adding noBorderRadiusBottom noBorderRadiusTop but that seems to have taken no effect.

And the top radius on the main container?

Right, so there are a ton of settings as you can see. In earlier versions of UI.X we handled border-radius case by case. Then, we looked at our CSS file and realized it was 100,000 characters. So I wrote a method that I dont think Ive ever seen done anywhere else on the internet, but it calculates the border radius based on, well, position to other elements. So say the footer menu and the footer columns (extended footer) are touching each other, that means they have no margins, and thus the bottom of .footer, and the top of the extended footer should not have a border radius. Thats the general idea and it works surprisingly well. Our CSS is now 27k characters (well we optimized more than just border-radius) and most of it is for unique settings.

I will say this, there needs to be more tools for border-radius. Of all the issue with UI.X, that one is the most annoying and time consuming :p. Im not sure if flexbox supports anything special or any methods but I wont be using flexbox until it is more widely supported of course.

Anyways all in all Ill need a link or a screenshot at least. Breadcrumbs (.breadBoxTop and/or .breadBoxBottom) are not in this javascript function because I only want to run the function as few times as possible. That said I should add a generic class that can be used as a selector, but for now I can give you the manual code.

ETA: The divs that are in the function are:
  • #header .pageContent
  • #userBar .pageContent
  • #logoBlock .pageContent
  • #navigation .pageContent
  • #content .pageContent
  • .footer .pageContent
  • #uix_footer_columns .pageContent
  • .footerLegal .pageContent
  • and Ill be adding a generic .checkRadius class in 1.3.2.3 or 1.4.0.0 whichever comes first
 
I have a (hopefully quick) question about a particular quirk of the responsive layout.

When you get to the narrowest pageview (say, on a phone) specifically in the Forum View, the "Watch Forum Selected Threads: #" section jumps from the right, to the left and attached to the same line as the page numbering. I assume they're supposed to be on separate lines. See attached.
funky_uix_wrapping.webp


Also, the page numbers wrap faster than they need to - they've got a whole line to take up, is there a reason why they don't fill out the line rather than leaving blank space on the left in the narrowest layout?

uix_number_indent.webp
 
Can the sticky nav be coded to behave like on this site - http://www.espnfc.com/index

Basically they appear only when the user is scrolling up. Seems more usable as it gives a full screen to read content. Also solves the problem of hiding content under the nav when loading an anchor text link.

That is technically the exact same behavior as the Chrome browser on iOS mobile devices.. Would love to see this implemented as an option..
 
Back
Top Bottom