Important:
This support area is for Kalium 3 users only. Support for Kalium 4 has moved to our new platform at support.laborator.co. If you’re using Kalium 4, please create a new account there using your email and license key. A password will be sent to you automatically.

Okay
  Public Ticket #844488
On a single page portfolio, how to make the collapsed description smaller, and change the upward arrow icon?
Closed

Comments

  • Brahim Salami started the conversation
    July 28, 2016 at 6:17am

    Hello Laborator Team,

    On a single page portfolio, I have decided to go with the "Fullscreen Portfolio Item Type". 

    I have been trying to reduce the size of the collapsed description info (portfolio-description-container is-collapsed), hiding the title (on collapsed only), and tried to switch the arrow icon to an info icon (like the ones offered from the icon libraries – type icons, linea, font awesome…). 

    I have attached an image for visual reference.

    Could you please help me find a solution?

    Also on the same page I would like my mouse cursor to stay the same instead of a double arrow to navigate the multiple image per project portfolio. I haven't seen an option for that.

    Thank you in advance!

  •  1,561
    Laborator replied
    July 28, 2016 at 12:23pm

    Hi Brahim,

    I built a CSS for you, so pasting this in the Custom CSS should make it work :)

    .single-portfolio-holder.portfolio-type-5 .portfolio-description-container.is-collapsed .portfolio-description-showinfo h3, .single-portfolio-holder.portfolio-type-5 .portfolio-description-container.is-collapsed .portfolio-description-showinfo p {
  display: none;
}

.single-portfolio-holder.portfolio-type-5 .portfolio-description-container .portfolio-description-showinfo .expand-project-info {
    background: url(https://cdn0.iconfinder.com/data/icons/glyphpack/85/info-alt-128.png) no-repeat;
    background-size: 24px; 
    top: 20px;
    left: 40px;
}

.single-portfolio-holder.portfolio-type-5 .portfolio-description-container .portfolio-description-showinfo .expand-project-info svg {
  display: none;
}  

.portfolio-full-bg-slider .image-entry {
  cursor: default !important;
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group

  • Brahim Salami replied
    July 29, 2016 at 3:38am

    Thanks a lot Art ! It looks much better.

    I do have an other request for you. When I try to look on my iPhone I realize that the icon disappear and the white box width increase.

    I have attached an image to see where the problem lies. Could you help me again?

    Thank you Art. 

  •  1,561
    Laborator replied
    July 29, 2016 at 11:29am

    Hi Brahim,

    Paste the following in Custom CSS > Responsive > Extra Small

    .single-portfolio-holder.portfolio-type-5 .portfolio-description-container {
    background: transparent;
}

.single-portfolio-holder.portfolio-type-5 .portfolio-description-container .portfolio-description-showinfo .expand-project-info {
    left: 10px;
    top: 8px;
}

    Best regards,
    Laborator Team

      Documentation         Join Kalium Users Group