Home Forums Particles Support Pricing Table: feature

Viewing 7 posts - 1 through 7 (of 7 total)
  • Avatar
    Fernando Molina
    Subscriber

    I do not see anywhere how to configure “feature” position. It is showing as a horizontal line right bellow features list

    Avatar
    Tony
    Moderator

    Do you mean compare all feature in live demo ?
    If so, they are html module. Check the quickstart package to get the code.

    Avatar
    Fernando Molina
    Subscriber

    I mean that green stripe that cuts the right hand corner of the table right above the title (featured text) with words like “best deal”

    Avatar
    Tony
    Moderator

    The feature badge is static position. You need to custom the css to change the position for it.
    Thanks

    Avatar
    Fernando Molina
    Subscriber

    Is there a hint on how to do that? Would it be too complex to have this functionality in the particle?

    Avatar
    Tony
    Moderator

    “Is there a hint on how to do that?”
    What’s the result you wish to change ??
    “Would it be too complex to have this functionality in the particle?”
    Its a static position, most pricing table using top-right position to present the badge(or highlight text). By default, we added to the top-right position, on RTL layout mode, the position changed to the top-left by using css.
    If you want to assign the badge to custom position, you need to add CUSTOM CSS code for this task.

    Avatar
    Tony
    Moderator

    Default css code for the badge (or highlight text) here

    .tm-price-table_featured-inner {
        text-align: center;
        left: 0;
        width: 200%;
        -webkit-transform: translateY(-50%) translateX(-50%) translateX(35px) rotate(-45deg);
        -ms-transform: translateY(-50%) translateX(-50%) translateX(35px) rotate(-45deg);
        transform: translateY(-50%) translateX(-50%) translateX(35px) rotate(-45deg);
        margin-top: 35px;
        font-size: 14px;
        line-height: 2;
        color: #fff;
    }

    You can modify the custom css code into theme_name/custom/scss/custom.scss file.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

JoomLead Gantry 5 Particles 2.1.3 released See what's new
Sale 30% OFF Cyber Monday. Use the discount code CM2019 during checkout Buy Now