Okay
  Public Ticket #3597022
Filter Styling
Closed

Comments

  • Goldstar started the conversation
    March 2, 2024 at 5:56am

    Hi Vibe, 

    We want to make the Members Directory filter on https://goldstareducation.com/home-tuition/try-to-search-manually/ like the one attached. As per conversation in the email, this can be achieved by using CSS. 

    Could you pls help us make it?

    Let me know. 

    Thanks,
    GSE

    Attached files:  image.png

  • [deleted] replied
    March 2, 2024 at 4:43pm

    Please try adding this custom css in your wp-admin-> appearance-> customize -> custom css : 


    .vibebp_members_directory_wrapper .vibebp_members_directory_filters>.vibebp_members_directory_filter {
    margin:0 !important;
    border-radius: 0 !important;
}
.vibebp_members_directory_wrapper .vibebp_members_directory_filters>.vibebp_members_directory_filter>span{
    margin: 1rem -1rem;padding:1rem;margin-top:-1rem;
    background:aliceblue;
}
.checkbox>input[type=checkbox]+label[for="field_2429"]:before,.checkbox>input[type=checkbox]+label[for="field_2433"]:before{
    display:none !important;
    
}
.checkbox>input[type=checkbox]+label[for="field_2429"],.checkbox>input[type=checkbox]+label[for="field_2433"]{
    text-align:center !important;
    display:block;
    align-items:center;
    margin: 1rem -1rem;padding:1rem;
    background:aliceblue;
    
}
label {
    touch-action:none;
    pointer-events:none;
    
}