Breadcrumb Ribbon Enhancement v1

[Shelley]

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]

Red Breadcrumb ribbon enhancement in this post as i can't upload multiple attachments in a single resource.

 

[Vincent]

Shelley submitted a new resource:

Breadcrumb Ribbon Enhancement (version v1) - Breadcrumb Ribbon Enhancement



Read more about this resource...

I love it, but 1 minor thing:


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

Oh, and is it possible to add some little white arrows?

 

[Shelley]

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.

.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]

The "Post new Thread" issue got solved by changing (in xenforo.css)

.topCtrl
{
    float: right;
}

to

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

 

[Vincent]

You could try adding the following in extra.css for arrows.

.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

 

[Chris D]

I rarely say this about a resource I wouldn't personally use, but:

This is fantastic. Well done

 

[Shelley]

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.

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

 

[Vincent]

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

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

Thanks! It doesn't matter though, I use TMS

 

[Vincent]

Do you think it can be made in Blue too?

 

[Shelley]

Do you think it can be made in Blue too?

Is that a request?

 

[Vincent]

Is that a request?

Yes, indeed, and a failed one too Of course you can..
If you'd have time, can you please do it?

 

[Shelley]

Yes, indeed, and a failed one too Of course you can..
If you'd have time, can you please do it?

lol I didn't mean it to sound like that I wasn't sure whether you wanted a blue ribbon and it was a request. Anyway, sure check attachment.

 

[Vincent]

lol I didn't mean it to sound like that I wasn't sure whether you wanted a blue ribbon and it was a request. Anyway, sure check attachment.

Thanks!
Just on a side note, I want a professional opinion
http://www.hlxbans.net/forum/
Does that look good or not?

 

[Shelley]

Thanks!
Just on a side note, I want a professional opinion
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]

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
It doesn't really matter, does it?

 

[Shelley]

Yep, it's intentional. And I had thought of that, but I was lazy
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

 

[Shelley]

Yep, it's intentional. And I had thought of that, but I was lazy
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.

.breadcrumb .crust a.crumb {
    padding: 0 10px !important;
}

 

[Vincent]

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.

.breadcrumb .crust a.crumb {
    padding: 0 10px !important;
}

View attachment 31597

Okay, that does indeed look better
I'll apply it right away
Thanks once again Shelley!

 

[Shelley]

Okay, that does indeed look better
I'll apply it right away
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.