Breadcrumb Color Change

mrlouie

I did a search, couldn't find anything?

Is there a way to change the color of the breadcrumb BUT ! only the last part you are viewing?

example if i want level being viewed to be orange it follows.

Folder level : Home Icon (grey).. Folder Name (orange)

the going into a gallery : Home Icon (grey) ..Folder Name (grey) .. Gallery name (orange)

I did find some code but it only changed the separator thing -

thanks

louie

Smug Eric

add this to your CSS:

.sm-breadcrumb-item h1 {
color: Red !important;
}

mrlouie

Smug Eric wrote: »

add this to your CSS:

.sm-breadcrumb-item h1 {
color: Red !important;
}

THANK YOU !!!! so much, that was the final touch I needed to match my site & blog. Now I can just work on photos !!!!

TallPhotoGuy

Is it also possible to change the size of the breadcrumb logo, the little house icon

Smug Eric

Use this:

.sm-breadcrumb-item .sm-fonticon-Home {
font-size: 80px !important;
}

That size is rather huge just so I could be sure it was working, you will probably want to make that a more reasonable size. And you can change the color by adding another line like in the last bit of code I gave you. If you were wanting to do that as well.

avman

Is there a way to change the color of the breadcrumb and change to another color when hovering over the specific portion of the breadcrumb? For instance : Home(green Photo Galleries I (green) Airshows (green) and hovering over Airshows (Red) Thank you Tom (avman.smugmug.com)

Hikin' Mike

@avman said:
Is there a way to change the color of the breadcrumb and change to another color when hovering over the specific portion of the breadcrumb? For instance : Home(green Photo Galleries I (green) Airshows (green) and hovering over Airshows (Red) Thank you Tom (avman.smugmug.com)

Add this to your theme's CSS:

.sm-user-ui .sm-page-widget-breadcrumb .sm-breadcrumb, 
.sm-user-ui .sm-page-widget-breadcrumb .sm-breadcrumb > a, 
.sm-user-ui .sm-page-widget-breadcrumb .sm-breadcrumb > a:active, 
.sm-user-ui .sm-page-widget-breadcrumb .sm-breadcrumb > a:visited {
    color: green;
    }   

.sm-user-ui .sm-page-widget-breadcrumb .sm-breadcrumb > a:hover {
    color: #f00;
    }

avman

Thank You Mike! Exactly what I am looking for. Beautiful!
Tom