Okay
  Public Ticket #838041
individual titles in portfolio
Closed

Comments

  • William started the conversation
    July 21, 2016 at 7:43pm

    I’m keen to create two styles for tiles in my portfolio. 
    – I want to remove the title/tags on all “lightbox” tiles 
    – I want to keep just the title on any other type of portfolio item.

    Page to look at (first tile is the only one without lightbox)http://www.ad09c782d196db2528052074a-12913.sites.k-hosting.co.uk/portfolio/#jessica-mccormack

    I had a crack, but no luck: 

    .portfolio-item.portfolio-item-type-3 .portfolio-holder .thumb .hover-state .info{ display: none; }

    Many thanks, Will

  •  1,558
    Laborator replied
    July 22, 2016 at 11:25am

    Hi William,

    I couldn't understand the second question, how do you want to keep just the tittle on any other type of portfolio item when you want to hide them?

    Anyway, here is the code for your first question:

    .portfolio-holder .thumb .hover-state.position-bottom-right .info {
    display: none; 
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  • William replied
    July 22, 2016 at 11:40am

    Hey Art,

    This isn't quite the solution I'm after. I want to remove the titles only if they are lightbox portfolio items. 

    portfolio-item-type-6 are lightbox tiles. 

  •  1,558
    Laborator replied
    July 22, 2016 at 11:54am

    Hi William,

    Sorry, I didn't understand your question, use the code below and it should work:

    .portfolio-holder .portfolio-item-type-6 .thumb .hover-state.position-bottom-right .info  {
        display: none;
    }

    And this to hide the tags and keep only the titles on the other types of items:

    .portfolio-holder .thumb .hover-state .info p {
    display: none;
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  • William replied
    July 22, 2016 at 1:32pm

    Excellent. This solved it. Cheers

  • William replied
    July 22, 2016 at 3:55pm

    Art, 1 more thing. I'm hoping to make the tiles grayscale on hover... 

    Which elements do I need to target to achieve this? Code is below.

    img.grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
  filter: gray; /* IE6-9 */
  -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

img.grayscale:hover {
  filter: none;
  -webkit-filter: grayscale(0%);
}
  • William replied
    July 22, 2016 at 4:01pm

    I've worked it out. Thanks

  •  1,558
    Laborator replied
    July 25, 2016 at 11:57am

    Glad to hear that William, and sorry for the delay cause we were not available in weekend.

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group