SP Simple Portfolio - Personalising colours - Forum | JoomShaper
Solved SP Page Builder

SP Simple Portfolio - Personalising colours

Asked by Dan Ellmore 2 years ago Last activity 2 years ago

I am using Rectangle layout on SP Simple Poftfolio but my client has asked if it is possble to change the grey box and black text underneath the thumbnail image to - a blue box - Blue - #0015FF with orange text - Orange - #FF5F00

Is this possible please?

thanks

Dan

Accepted answer

Marked as the solution
Mehtaz Afsana Borsha Staff

Hi

Are you talking about these hadings?

https://prnt.sc/ZS1bHGUphhty

Then use this CSS

.sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-info h3>a {
    font-size: 18px !important;

16 more replies

Mehtaz Afsana Borsha Staff

Hi

Thanks for contacting us. Could you please give me your site URL and also a screenshot of your issue?

-Regards.

Dan Ellmore Asked this

Hi - this site is currently not live for the public but can be seen here

http://hellolincoln.co.uk/index.php

you can see the Portfilio module on the homepage - and my client wants to change the colours of the heading and grey box under the thumbnail images on the page

thanks

Mehtaz Afsana Borsha Staff

Could you please give me a screenshot of that portion?

Dan Ellmore Asked this

I really hope this will be possible - this will finish off my clients website perfectly.

Mehtaz Afsana Borsha Staff

Hi

Use this CSS in your custom.css file

.sp-simpleportfolio .sp-simpleportfolio-filter>ul>li.active>a {
    background: #0015FF !important;
    color: #FF5F00 !important;
}
Dan Ellmore Asked this

Thank you - this has worked for the 'active button' but the other buttons have remained grey - you can see this here: http://hellolincoln.co.uk/index.php

Is there a way to make all buttons #0115FF with white text and the button that is 'active' selected to go #FF5F00 please?

thanks

Dan

Dan Ellmore Asked this

I have added the code as follws and this has changed the buttons to a new colour

.sp-simpleportfolio .sp-simpleportfolio-filter>ul>lia {
background: #0015FF !important;
color: #FFFFFF !important;
}

I now have blue buttons with an orange active button - http://hellolincoln.co.uk/index.php

On the homepage the listings are shown in a block - my client would like to re-colour the grey underneath them - it is light grey and then goes to dark grey on mouseover - is there a custom code to update this to #0015FF and then #ff5f00 on mouseover please?

Mehtaz Afsana Borsha Staff

Are you talking about this button?

Screenshot 2024-09-11 at 11.37.59 AM.png

Mehtaz Afsana Borsha Staff

Hi

Use this CSS in your custom.css file

.sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-info:hover{
  background: #643535 !important;
}
.sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-btns a:hover{
   background: #643535 !important;
}
Log in to reply.