CSS Color Theming

 avatarJfelizardo
Publica year ago22 Snippets
Search
Language
Sort by
📅 Created Date
Order
Design Template: Masterpiece
/*START - testimonial page icon*/
div.testimonials ul.collection 
{
    .avatar {
        background-color:#7BA4C3;
        height: 154px;
        path{
            fill: #fff;
            fill-opacity: 1;
        }
    }
    .circle {
        fill: TRANSPARENT;
    }
    @media (max-width: 768px){
        .avatar {
            background-color:#7BA4C3;
            height: 135px;
            path{
                fill: #fff;
                fill-opacity: 1;
            }
        }
        .circle {
        fill: TRANSPARENT;
        }
    }
}
/*END - testimonial page icon*/

Testimonial Quotation Theming

plain_texta year ago
Design Template: Masterpiece
/*START - Testimonial section theme (Local)*/
svg path{
    fill: #fffaf5;
    fill-opacity: 1;
}
svg circle{
    fill: rgba(123,164,195,0.8);
    fill-opacity: 1;
}
/*END - Testimonial section theme(Local)*/
Property Details Design Template: Masterpiece

/*START - slick arrow theme*/
div.arrows .lp-arrow.slick-arrow{
    background-color: transparent;
    border: solid 2px #fff;
    &:before{
        border-color:#fff;
    }
    &:hover{
        border: solid 2px #fff;
        background-color:#fff;
        &:before{
            border-color:#203049;
        }
    }
    /*dark version slick arrow for mobile view*/
    @media (max-width:768px){
        background-color: transparent;
        border: solid 2px #203049;
        &:before{
            border-color:#203049;
        }
        &:hover{
            border: solid 2px #203049;
            background-color:#203049;
            &:before{
                border-color:#fff;
            }
        }
    }
}
/*END - slick arrow theme*/
Design Template: Producer
/*START - update card color theme - */
.properties-grid .listing-card__img-wrap .listing-card__label {
        background: #670038 ;
        color: #fff;
        text-transform: uppercase;
    }
.properties-grid .listing-card__info{
        background: #C3BEBE;
        color: #000;
        text-transform: uppercase;
    }
div.listing-card__status>div {
    background-color: #670038;
     color: #fff;
}
/* END */

/*START -  price and living area value slider - */
div.range-slider .irs--round .irs-handle {
    background-color: #fff;
    transition: .3s;
    &:hover{
        border: 1px solid #670038;
        background-color: #670038;
        i{
            background: #fff;
        }
    }

}
/*END*/

/*START Dropdown Theming - */
.filters__grid-item .custom-select-menu .custom-select-item {
    color: #000;
    background-color: #fff;
    &:hover{
        color: #fff;
        background-color: #670038;
    }
}
/*END*/

/*START Slider Line */
div.range-slider .irs--round .irs-bar {
    background-color: #999;
}
div.range-slider .irs--round .irs-line {
    background-color: #670038;
}
/*END*/

/*START Fix Button Mobile*/
.lp-btn {
    border: 2px solid #670038;
    background-color: transparent;
    color: #670038;
        &:hover{
            border: 2px solid #670038;
            background-color: #670038;
            color: #fff;
        }
    }

@media only screen and (max-width: 768px){
.lp-btn {
    border: 2px solid #670038;
    background-color: transparent;
    color: #670038;
        &:hover{
            border: 2px solid #670038;
            background-color: #670038;
            color: #fff;
        }
    }
}
/*END*/
Design Template: Producer

/*START - add theming*/
.lp-input--light {
    color: #000;
    border-color: rgba(0,0,0, 1);
}

.lp-input--light::placeholder {
    color: #000;
}

.lp-input--light:-webkit-autofill{
    border: 1px solid rgba(0,0,0, 1)!important;
    -webkit-text-fill-color: #000;
    -webkit-box-shadow: 0 0 0px 1000px transparent inset!important;
}

.form-inputs-wrap .lp-tcr-message {
    color: #000;
}
/*ENd - add theming*/
  • Total 22 snippets
  • 1
  • 2
  • 3
  • 4
  • 5