UI.X 1.5.22.0

[BassMan]

My collapsible nodes are not working right, I guess. If I close them all, go to some subpage and come back to forum home page, nodes don't always stay collapsed or open. Is this normal behaviour?

I thought nodes will stay collapsed till I change them to open or delete cookies.

 

[BassMan]

Another question:

I'm using fixed navigation. Is it possible to have QuickSearch in Navigation, but when scrolling down it shows up in TabLinks when fixed navigation shows up?

 

[Emerald™]

OK, Just bought the theme, How do I change the background to a image?

Thanks!

 

[BassMan]

OK, Just bought the theme, How do I change the background to a image?

Thanks!

This is how I've done.

Add in EXTRA.css:

/* START - Background image on forum */
@media (min-width: 1025px) {
html {
  background: url(/@imagePath/xenforo/background/your_image.png) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
}
}

@media (max-width: 1025px) {
#header {
  background-color: @primaryDarker !important;
}
}
/* END - Background image on forum */

I wanted not to show background image on my mobile, that's why there's a part of code for responsive. You can remove this if you want.

Then go to Style Properties -> General -> Body and Clear value for background colour.

 

[BassMan]

I think it is better to remove bold font for social login buttons.

With bold font in google.css:

Without bold font in google.css:

Same goes for twitter and facebook button. Well at least on my site doesn't look good. Tested on Firefox and Chrome.

 

[BassMan]

If I set to open Login in Modal box, the font colour for Facebook login isn't light, so it's hard to read:

I'm searching and searching, but can't find it where to change.

I know I need to remove colour here (inspect element):

But I'm stuck now. Hope someone can help.

 

[Dad.]

It is at http://film-students.net.

The simplest solution (and this will work with you removing your fix attempts as well), is to just do in extra.css:

#content .pageContent {border-top-left-radius: 0; border-top-right-radius: 0;}
.breadBoxTop, .breadBoxTop .breadcrumb {border-radius: 0 0 0 0;}

That said, UI.X can handle this elegantly too without extra CSS, but it won't work until the next release. In which you will only have to add checkRadius as a class to .breadBoxTop and then you can remove the above CSS. Does this suffice?

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.
View attachment 75809


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?

View attachment 75811

Would you mind creating a ticket at audentio.com with a link so I can check this out? I cannot replicate this issue. Ill get it fixed.

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.

So, UI.X can actually handle this. In the new version, we have implemented off-canvas navigation. The only thing it cannot do is decide at what width the responsive navigation ends up showing up. This might be tricky but Ill see if I can come up with something.

My collapsible nodes are not working right, I guess. If I close them all, go to some subpage and come back to forum home page, nodes don't always stay collapsed or open. Is this normal behaviour?

I thought nodes will stay collapsed till I change them to open or delete cookies.

This is not normal behavior, create a ticket and Ill see why the cookie isn't saving.

Another question:

I'm using fixed navigation. Is it possible to have QuickSearch in Navigation, but when scrolling down it shows up in TabLinks when fixed navigation shows up?

Not easily, no. We were working on a system to allow you to move the search wherever you wanted when the current search position's parent element became sticky/fixed, BUT it was proving to be a bit of an undertaking. It is something we want to do, but Ill have to revisit it.

OK, Just bought the theme, How do I change the background to a image?

Thanks!

Almost everything you want to do can be done via Style Properties, so I would recommend checking that area out. You can change absolutely any color, any width, and property almost whatsever. Start with Style Properties > Color Palette and also UI.X Global Settings as well as just General.

I think it is better to remove bold font for social login buttons.

With bold font in google.css:

Without bold font in google.css:

Same goes for twitter and facebook button. Well at least on my site doesn't look good. Tested on Firefox and Chrome.

I can agree with that, but its something XenForo does.

If I set to open Login in Modal box, the font colour for Facebook login isn't light, so it's hard to read:

I'm searching and searching, but can't find it where to change.

I know I need to remove colour here (inspect element):

But I'm stuck now. Hope someone can help.

Also something Ill fix in the next release thank you for reporting.

 

[BassMan]

Regarding this post: http://xenforo.com/community/threads/ui-x-paid.57944/page-90#post-780525

It's ok on default XF style! I need to remove bold only for UI.X.

Ok, I'll create a ticket for collapsible nodes right now.

 

[BassMan]

Ok, I'll create a ticket for collapsible nodes right now.

Ticket created. Hope for a fix!

 

[BassMan]

My collapsible nodes are not working right, I guess. If I close them all, go to some subpage and come back to forum home page, nodes don't always stay collapsed or open. Is this normal behaviour?

I thought nodes will stay collapsed till I change them to open or delete cookies.

Ignore that. I just deleted all cookies for my site and now it works like a charm.

Sorry for not doing this before. Using UI.X for one day now. And I'm really satisfied with it, although I need to do some custom changes.

 

[Jeremy]

The simplest solution (and this will work with you removing your fix attempts as well), is to just do in extra.css:

#content .pageContent {border-top-left-radius: 0; border-top-right-radius: 0;}
.breadBoxTop, .breadBoxTop .breadcrumb {border-radius: 0 0 0 0;}

That said, UI.X can handle this elegantly too without extra CSS, but it won't work until the next release. In which you will only have to add checkRadius as a class to .breadBoxTop and then you can remove the above CSS. Does this suffice?

Gah! I swear I tried that. But yes, that did work. One last tiny question (and I'm mostly asking because I'm at work and don't have time to fidget). The CTA button for New Thread, etc.? How can I remove the border radius on that? And then I'm super content with the header of my UI.X installation for now.

 

[Dad.]

Gah! I swear I tried that. But yes, that did work. One last tiny question (and I'm mostly asking because I'm at work and don't have time to fidget). The CTA button for New Thread, etc.? How can I remove the border radius on that? And then I'm super content with the header of my UI.X installation for now.

Its no trouble!

I suppose I would go to Style Properties > Breadcrumb > Call-to-Action button (@breadBoxTopCtrl) and just add 0 in the top border-radius field.

 

[BassMan]

Ignore that. I just deleted all cookies for my site and now it works like a charm.

Sorry for not doing this before. Using UI.X for one day now. And I'm really satisfied with it, although I need to do some custom changes.

Sorry, something is still not right. Sometimes it works, sometimes not.

If I look at the cookie it strangely stores my catergory id's:

219.57.75.210.136.21218.21
-----

21218 is not my category id. I think periods are not given right. @Audentio, can you check once again, please?

EDIT: the problem starts when expanding categories again. The periods after category id's just don't show right any more.

Example: I've expanded all my categories now, but in that number stays in cookie:
21211. (or any other number)

Maybe it's because of category ID's? Dunno...


EDIT2:

Found an issue: I have ID 211. When I collapse it stores the number in cookie ( 211. ). Then I collapse ID 1, so it's suspected to store like this: 211.1

But it don't! It stores like: 21.

I think that's not right!

 

[Emerald™]

This is how I've done.

Add in EXTRA.css:

/* START - Background image on forum */
@media (min-width: 1025px) {
html {
  background: url(/@imagePath/xenforo/background/your_image.png) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
}
}

@media (max-width: 1025px) {
#header {
  background-color: @primaryDarker !important;
}
}
/* END - Background image on forum */

I wanted not to show background image on my mobile, that's why there's a part of code for responsive. You can remove this if you want.

Then go to Style Properties -> General -> Body and Clear value for background colour.

Worked thanks alot.

 

[BassMan]

I've edited my post several times: http://xenforo.com/community/threads/ui-x-paid.57944/page-90#post-780599

Check....

 

[Jeremy]

Its no trouble!

I suppose I would go to Style Properties > Breadcrumb > Call-to-Action button (@breadBoxTopCtrl) and just add 0 in the top border-radius field.

Unless I did it wrong that didn't work (its been a long day, wouldn't be surprised if I did it wrong. lol). Since I am currently on lunch I messed and got EXTRA.css to work for it (Im' OK adding CSS. lol).

Now I have the look I want:

 

[Dad.]

Sorry, something is still not right. Sometimes it works, sometimes not.

If I look at the cookie it strangely stores my catergory id's:

219.57.75.210.136.21218.21
-----

21218 is not my category id. I think periods are not given right. @Audentio, can you check once again, please?

EDIT: the problem starts when expanding categories again. The periods after category id's just don't show right any more.

Example: I've expanded all my categories now, but in that number stays in cookie:
21211. (or any other number)

Maybe it's because of category ID's? Dunno...


EDIT2:

Found an issue: I have ID 211. When I collapse it stores the number in cookie ( 211. ). Then I collapse ID 1, so it's suspected to store like this: 211.1

But it don't! It stores like: 21.

I think that's not right!

If it is indeed behaving like this its incorrect. But like I said in your ticket, you have a cookie related issue not related to UI.X.

 

[Dad.]

Unless I did it wrong that didn't work (its been a long day, wouldn't be surprised if I did it wrong. lol). Since I am currently on lunch I messed and got EXTRA.css to work for it (Im' OK adding CSS. lol).

Now I have the look I want:
View attachment 75898
View attachment 75899

Wait, so what is the top one and the bottom one doing differently?

 

[Jeremy]

Nothing. Those are the "final" versions of what I was attempting to achieve. Just one with a CTA button and one without. I don't use a logo on my site right now and condensed it so the header/navigation was "contained" to the content and separated by the breadcrumbs.

My CSS skills are horrendous, so I can only do small tweaks. lol

 

[Dad.]

Nothing. Those are the "final" versions of what I was attempting to achieve. Just one with a CTA button and one without. I don't use a logo on my site right now and condensed it so the header/navigation was "contained" to the content and separated by the breadcrumbs.

My CSS skills are horrendous, so I can only do small tweaks. lol

Ah OK. Hope the framework is helping you with your customizations. And I'd rather be proficient at PHP than CSS So I envy you in that right. But yeh glad you got it

You may want to experiment with navigation styles. Nav style 3 adds the logo inside the navigation bar. So you can still have a logo but also save the space.