Archived

This topic is now archived and is closed to further replies.

  • 0

Projects Permanent project name labels

Question

Posted · Report post

Dear Nick, I see the volume and magnitude of your output and always hesitate to trouble you with simple questions for fear of taking up time and standing in the way of progress! But I cannot solve this on my own: Is it possible to keep the name permanently on the featured project image, not just on hover? So that I see all the project tiles with the project name displayed? I am trying to allow schools to find themselves easily - with just the picture that is some work as they need to hover over many projects (now handily filter, though!) before they discover theirs. Is there some CSS magic that could make the name labels permanent? Once again, I appreciate your attention, whether my problem is solvable or not. Greetings and good luck, Jan.

Share this post


Link to post
Share on other sites

4 answers to this question

Posted · Report post

Dear Nick, presto! This worked straight away. I'm happy and much obliged. Yours faithfully, Jan.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Jan,

Yup try something like this, lemme know how it works out for you.

 

#page .ba-projects-figcaption {

bottom:0 !important;

.opacity(100);

&:before {

.opacity(0);

}

}

Share this post


Link to post
Share on other sites

Posted · Report post

Dear Nick, thanks for the swift reply. I put the code into Base Theme's style sheet but the desired effect remains elusive as yet. Should the code have been put elsewhere? Still it puts me in a good mood at the start of the week to think that this can be solved in the end! Greetings, Jan. 

P.S.: The website where I am trying to do this is at www.schuleverrueckt.de/wordpress, if that is of any help in figuring out a way.

Share this post


Link to post
Share on other sites

Posted · Report post

Hmm, seems to be ignoring the .opacity mixin. Weird.

 

Try 

 

#page .ba-projects-figcaption { bottom:0 !important; opacity:100 !important; &:before { opacity:0 !important; } }

1 person likes this

Share this post


Link to post
Share on other sites