Portfolio-Plugin: Filter background color won't change


#1

Hello everyone!

I’m currently working on my site and everything works fine. The Theme is just what I had hoped for and looking great. There’s only one small problem:

I’m using the Portfolio Plugin to display several different kinds of projects on different pages. BUT the filter won’t react to color customization via “appearance” menu. The link background on mouseover stays the default Sydney color. I’ve searched the plugin code and the style.css, but didn’t find anything suspicious.
I didn’t fidget with the original code but did all of my other customization via child theme, but only minor things in style.css and nothing concerning the Portfolio Plugin so far.

Any ideas how to solve this???


#2

It has to be somewhere in this section, right? Has anybody else experienced this problem?
I would be fine with hardcoding the color for the filter background. What would I have to add to my custom css to do this?

/* Lastest Projects
-------------------------------------------------------------- */
	.project-filter {
		margin: 20px 0 50px 0;
		text-align: center;
	}
	.project-filter li  {
		display: inline-block;
	    position: relative;
	    text-align: center;
	    padding: 10px;
	    margin-left: -3px;
	    background-color: #f5f5f5;
		-webkit-transition: background 0.3s;
		   -moz-transition: background 0.3s;
		    -ms-transition: background 0.3s;
		     -o-transition: background 0.3s;
		        transition: background 0.3s;
	}
	.project-filter li a {
	    color: #767676;
	    display: block;
	    font-family: "Raleway",sans-serif;
	    font-size: 13px;
	    font-weight: 600;
	    outline: 0;
	}
	.project-filter li.active a,
	.project-filter li:hover a {
		color: #fff;
	}

#3

Well, I still don’t know why the thing won’t respond to the color change via menu, but finally I found the code snippet in another section of the style.css and added it - with different color - to my child theme’s css. Problem solved.

.project-filter li.active,
	.project-filter li:hover {
		background-color: d65050;
	}

#4

not_a_cylon - Does the above code snippet still work for you? I added to the style.css of my child theme and it didn’t do anything.

If anyone else has a fix, I’d appreciate it!


#5

Hi,

What is not working, try to add !important after the CSS value, for example to this one:

.project-filter li.active,
	.project-filter li:hover {
		background-color: d65050 !important;
	}

and check if it’s working like that.

Best Regards,
Csbaa


#6

Thanks Csbaa.

I added !important after the CSS value but unfortunately the portfolio filter background color on hover still remains the Sydney default.

Do you have any other ideas or know if this code snippet is correct?

I looked at the Sydney style.css file and don’t see any reference to the default filter background color - #d65050.

This is the code referencing the filter. Seems like it should be somewhere in here but don’t see any corresponding code.

.project-filter {
		margin: 20px 0 50px 0;
		text-align: center;
	}
	.project-filter li  {
		display: inline-block;
	    position: relative;
	    text-align: center;
	    padding: 10px;
	    margin-left: -3px;
	    background-color: #f5f5f5;
		-webkit-transition: background 0.3s;
		   -moz-transition: background 0.3s;
		    -ms-transition: background 0.3s;
		     -o-transition: background 0.3s;
		        transition: background 0.3s;
	}
	.project-filter li a {
	    color: #767676;
	    display: block;
	    font-family: "Raleway",sans-serif;
	    font-size: 13px;
	    font-weight: 600;
	    outline: 0;
	}
	.project-filter li.active a,
	.project-filter li:hover a {
		color: #fff;