Change the Color of the Font & Link Colors in Captions - Collage Landscape & Portrait

Darter02 · October 1, 2013

I've been working on a new theme for my wedding galleries. The font & accent colors work well with in the gallery itself, but in the photo captions they are too pale. I use collage style galleries, both portrait & landscape.

I tried using this CSS to change the colors.

/* Change the title font */
.sm-tile-title {
   color: #161714 !important; 
   font-size: 14px; /* Set the font size */
}

/* Change the caption font */
.sm-tile-caption {
   color: #161714 !important; 
   font-size: 14px; 
}

/* Set the caption link color */
.sm-tile-info a {
  color: #898752 !important;  
}

/* Set the caption hover color*/
.sm-tile-info a:hover {
  color: #f3f3b2 !important;
}

No dice. Do I have the wrong CSS ids??

Here's a photo in my testing gallery.

I disabled Right-Click. I also know the watermarks are looking odd. This gallery is of thumbnails snagged off the site, which had one style of thumb and the gallery has a different.

Hikin' Mike · October 1, 2013

Based on your link, I assume you want to change the color of the lightbox title and/or caption. Here is the code:

    /* Lightbox Title and Captions*/
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-title, 
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #000;
    }
.sm-user-ui .sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #111 !important;
    }

leftquark · October 1, 2013

Hikin' Mike wrote: »
Based on your link, I assume you want to change the color of the lightbox title and/or caption. Here is the code:
    /* Lightbox Title and Captions*/
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-title, 
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #000;
    }
.sm-user-ui .sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #111 !important;
    }

If you want the title and caption to have the same color, there's no need for the 2nd statement there. And can be simplified to just:

    /* Lightbox Title and Captions*/
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-title, 
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #000;
    }

If you want the title and caption to have different colors, then the first line has a duplicate entry that can be removed:

    /* Lightbox Title and Captions*/
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-title {
    color: #000;
    }
.sm-lightbox-basic .yui3-widget-ft .sm-lightbox-caption {
    color: #111 !important;
    }

Change the Color of the Font & Link Colors in Captions - Collage Landscape & Portrait

Comments