"Post Grid Settings: Portfolio" (#2500853) / ThemeNectar

Comments

1
elgwhoppo started the conversation
August 11, 2020 at 7:15pm
Hi there! How is it that you're able to differentiate "New" items from others in this post grid, is this done via categories/attributes or with extra CSS on the post grid item? I have seen the display categories functionality, but impacts all posts. Would love to a tiny bit of direction on how to put little text inside colored ovals on the post grid items as is possible here. Thanks much!

8,851

Tahir replied

August 12, 2020 at 11:49am

Hey Again,

That's added via this Custom CSS code below.

Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

.portfolio-items .col.nectar-new-item .inner-wrap:before {
    display: block;
    border-radius: 50px;
    background-color: #fd0025 !important;
    padding: 10px 20px;
    position: absolute;
    left: 13px;
    top: 13px;
    color: #fff;
    line-height: 16px;
    font-size: 16px;
    content: 'Add Text Here';
    z-index: 100;
    transform: scale(0.9) translateZ(0);
    backface-visibility: hidden;
    transition: transform 0.3s cubic-bezier(.21, .6, .35, 1);
}

Thanks

ThemeNectar Support Team

1 Like

8,851
Tahir replied
August 12, 2020 at 11:51am
Also, the Particular post is assigned a Category named "Nectar New Item" which then shows up in the Post HTML markup:
Click Image to View Larger.

Thanks

ThemeNectar Support Team
1
elgwhoppo replied
August 19, 2020 at 2:15am
All set! Thanks so much, worked like a charm.
1 Like