Breadcrumb Ribbon Enhancement

Breadcrumb Ribbon Enhancement v1

No permission to download

Shelley

Well-known member
#1
Shelley submitted a new resource:

Breadcrumb Ribbon Enhancement (version v1) - Breadcrumb Ribbon Enhancement


View attachment 31563

Summary: This enhance will transform your breadcrumbs into a Ribbon type visual. I've tested this on a default style and applied it to one other custom style and it appears to display correctly.

Install: Firstly, upload the images via FTP in the archive to your /gradients folder and then log into your AdminCP >> Appearance >>Templates >> and in the...
Read more about this resource...
 

Shelley

Well-known member
#4
I love it, but 1 minor thing:
View attachment 31568

The "Post new Thread" button should also be lowered when using this resource :)

Oh, and is it possible to add some little white arrows?
You could try adding the following in extra.css for arrows.

Code:
.breadcrumb .crust a.crumb:after {
content: ">";
padding-left: 5px;
}
With regards to the button. Yeah, the default button will need lowering which will be easy for users to do.
 

Vincent

Well-known member
#5
The "Post new Thread" issue got solved by changing (in xenforo.css)
Code:
.topCtrl
{
    float: right;
}
to

Code:
.topCtrl
{
    float: right;
    margin-top: 10px;
}
 

Vincent

Well-known member
#6
You could try adding the following in extra.css for arrows.

Code:
.breadcrumb .crust a.crumb:after {
content: ">";
padding-left: 5px;
}
With regards to the button. Yeah, the default button will need lowering which will be easy for users to do.
Thanks, now both my problems are solved :)
 

Shelley

Well-known member
#8
Thanks, now both my problems are solved :)
Just a side note about the placement of the post new button and it'll save you a template edit rather than alter xenforo.css you can/could add the following in EXTRA.css adjusting the margin-top size to your preference.

Code:
.breadBoxTop .topCtrl {
    margin-top: 10px;
}
 

Vincent

Well-known member
#9
Just a side note about the placement of the post new button and it'll save you a template edit rather than alter xenforo.css you can/could add the following in EXTRA.css

Code:
.breadBoxTop .topCtrl {
    margin-top: 10px;
}
Thanks! It doesn't matter though, I use TMS :)
 

Shelley

Well-known member
#15
Thanks!
Just on a side note, I want a professional opinion :D
http://www.hlxbans.net/forum/
Does that look good or not?
I've noticed your not using the two fixed right and left ribbons. I'm assuming that is intentional? If so and your going for a straight bar you can most probably remove the breadcrumb template edit <div class="breadcrumbright"> & <div class="breadcrumbleft"> from the TMS and the associated css and simply just use the repeating breadcrumb-center image. Looks good.
 

Vincent

Well-known member
#16
I've noticed your not using the two fixed right and left ribbons. I'm assuming that is intentional? If so and your going for a straight bar you can most probably remove the breadcrumb template edit <div class="breadcrumbright"> & <div class="breadcrumbleft"> from the TMS and the associated css and simply just use the repeating breadcrumb-center image. Looks good.
Yep, it's intentional. And I had thought of that, but I was lazy :p
It doesn't really matter, does it?
 

Shelley

Well-known member
#17
Yep, it's intentional. And I had thought of that, but I was lazy :p
It doesn't really matter, does it?
It does in a way because your links are shifted to the right when they don't need to be. I would personally remove them if it were me. I'd seriosly remove the other div classes takes a second lazy bones :D
 

Shelley

Well-known member
#18
Yep, it's intentional. And I had thought of that, but I was lazy :p
It doesn't really matter, does it?
Here's what it will look like without the extra two divs and with a css adjustment (below) and adding the 1px right and left 1px border to .breadcrumb.

Code:
.breadcrumb .crust a.crumb {
    padding: 0 10px !important;
}
breadcrumb-fix.png
 

Shelley

Well-known member
#20
Okay, that does indeed look better :)
I'll apply it right away :D
Thanks once again Shelley!
Great stuff. That would have been annoying me had you left it as it was. Would it help if I re-coloured the image closer to the xenforo dark blue for your site? that colour blue variation doesn't quite suit imo but the blue xenforo uses i feel would be better suited. Let us know if you want me to make that colour change.
 
Top