Styling of Pro Sites signup form

Hi!

I think your plugins seems to be great, however I find it really hard to get them to look as I wan't. I have seen that you have customized some css for users here, and I wonder if you maybe could place all of these in the same place somewhere, so it's easier to find. Or even better, include some styling options in your plugins.

Well, I would like to make some modifications on the signup form for prosites, with blog templates. I have included a mocukup of what I am trying to accomplish, but with no success after a few days of work.. :slight_smile:

  • Predrag Dubajic

    Hey Linus,

    Hope you had a nice weekend :slight_smile:

    Our plugins usually have some default styling and get some attributes from theme CSS as well so it's possible that it will not quite fit your needs if you are looking for specific design.

    We don't have a place where all customizations are in one place, pretty much because of what I mentioned above, custom design is usually unique and it requires different CSS code to accomplish it.

    Look you're after would require quite a few CSS changes but here's some that should help you get started:

    #psts_checkout_grid .pblg-checkout-opt {
        min-height: 20px;
        background: #00e7ff;
        border: 0;
        border-radius: 0;
    }
    
    #psts_checkout_grid .pblg-checkout-opt:hover,
    #psts_checkout_grid div.opt-selected,
    #psts_checkout_grid div.opt-selected:hover,
    #psts_checkout_grid div.opt-current:hover {
        background: #00e7ff;
        border: none;
    }
    
    #psts_checkout_grid .pblg-checkout-opt .level-summary {
        display: none;
    }
    
    #psts_checkout_grid tr {
        border: 1px solid #efefef;
    }
    
    .pricing-column.grid-checkout .coupon input {
        border-radius: 0;
        margin: 10px 0 6px 7px;
        display: inline-block;
    }
    
    .pricing-column .apply-coupon-link {
        padding: 8px 20px;
        border: 2px solid #00e7ff;
        top: -2px;
        left: 5px;
    }
    
    .theme-previewer-wrap, .theme-page-showcase-wrap, .theme-screenshot-wrap {
        background: #00e7ff;
    }
    
    #blog_template-selection h3 {
        text-align: center;
        color: #00e7ff;
    }
    
    #nbt-toolbar a {
        background: none;
        color: #676767;
        border: 2px solid #00e7ff;
        border-radius: 0;
    }
    
    #nbt-toolbar .toolbar-item-selected {
        opacity: 1;
        background: #00e7ff;
    }

    Best regards,
    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.