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

    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,558
    Laborator replied

    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

    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,558
    Laborator replied

    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