Remove inline style codes that clutter the code

  • Resolved themedically

    (@themedically)


    5 years, 1 month ago

    Hello.

    I started using the plugin few days ago and it works almost flawlessly. The big issue, after looking at the website’s code is that it has a lot of inline styling that clutters the code.

    Is there any way I can remove this?

    Here is the code in question:

    <style>

    /* Settings Panel Structure

    Button: Color Name
    ———————–
    – Color

    – Background
    — Background Hover

    – Border Color
    — Border Color Hover

    */

    /* =======================================
    Button: Primary
    ======================================== */
    /* Color */
    /*#directorist.atbd_wrapper .btn-outline-primary{
    color: #ffffff !important;
    }*/

    /* Background */
    .pricing .price_action .price_action–btn, #directorist.atbd_wrapper .btn-primary, .default-ad-search .submit_btn .btn-default, /*#directorist.atbd_wrapper .btn-outline-primary:hover,*/ .atbd_content_active #directorist.atbd_wrapper.dashboard_area .user_pro_img_area .user_img .choose_btn #upload_pro_pic, #directorist.atbd_wrapper .at-modal .at-modal-close, .atbdp_login_form_shortcode #loginform p input[type=”submit”], .atbd_manage_fees_wrapper .table tr .action p .btn-block:hover, #directorist.atbd_wrapper #atbdp-checkout-form #atbdp_checkout_submit_btn{
    background: #444752 !important;
    color: #ffffff !important;
    }

    /* Hover Background */
    .pricing .price_action .price_action–btn:hover, #directorist.atbd_wrapper .btn-primary:hover, #directorist.atbd_wrapper .at-modal .at-modal-close:hover, .default-ad-search .submit_btn .btn-default:hover, .atbd_content_active #directorist.atbd_wrapper.dashboard_area .user_pro_img_area .user_img .choose_btn #upload_pro_pic:hover, .atbdp_login_form_shortcode #loginform p input[type=”submit”]:hover{
    background: #222222 !important;
    color: #ffffff !important;
    }

    /* Border Color */
    #directorist.atbd_wrapper .btn-primary, .default-ad-search .submit_btn .btn-default, /*#directorist.atbd_wrapper .btn-outline-primary, #directorist.atbd_wrapper .btn-outline-primary:hover,*/ .atbdp_login_form_shortcode #loginform p input[type=”submit”]{
    border-color: #444752 !important;
    }

    /* Hover Border Color */
    #directorist.atbd_wrapper .btn-primary:hover, .default-ad-search .submit_btn .btn-default:hover, .atbdp_login_form_shortcode #loginform p input[type=”submit”]:hover{
    border-color: #222222 !important;
    }

    /* =======================================
    Button: Secondary
    ======================================== */
    /* Color */

    /* Background */
    /*#directorist.atbd_wrapper .btn-secondary {
    background: #122069 !important;
    }

    !* Hover Background *!
    #directorist.atbd_wrapper .btn-secondary:hover{
    background: #131469 !important;
    }

    !* Border Color *!
    #directorist.atbd_wrapper .btn-secondary {
    border-color: #122069 !important;
    }

    !* Hover Border Color *!
    #directorist.atbd_wrapper .btn-secondary:hover{
    border-color: #122069 !important;
    }*/

    /* =======================================
    Button: Danger
    ======================================== */
    /* Color*/
    #directorist.atbd_wrapper .btn-outline-danger{
    color: #e23636 !important;
    }

    /* Background */
    #directorist.atbd_wrapper .btn-danger, #directorist.atbd_wrapper .btn-outline-danger:hover, .atbd_content_active #directorist.atbd_wrapper.dashboard_area .user_pro_img_area .user_img #remove_pro_pic{
    background: #e23636 !important;
    }

    /* Hover Background */
    #directorist.atbd_wrapper .btn-danger:hover, .atbd_content_active #directorist.atbd_wrapper.dashboard_area .user_pro_img_area .user_img #remove_pro_pic:hover{
    background: #c5001e !important;
    }

    /* Border Color */
    #directorist.atbd_wrapper .btn-danger, #directorist.atbd_wrapper .btn-outline-danger{
    border-color: #e23636 !important;
    }

    /* Hover Border Color */
    #directorist.atbd_wrapper .btn-danger:hover{
    border-color: #c5001e !important;
    }

    /* =======================================
    Button: Success
    ======================================== */
    /* Color */

    /* Background */
    #directorist.atbd_wrapper .btn-success{
    background: #32cc6f !important;
    }

    /* Hover Background */
    #directorist.atbd_wrapper .btn-success:hover{
    background: #2ba251 !important;
    }

    /* Border Color */
    #directorist.atbd_wrapper .btn-success{
    border-color: #32cc6f !important;
    }

    /* Hover Border Color */
    #directorist.atbd_wrapper .btn-success:hover{
    border-color: #2ba251 !important;
    }

    /*
    Badge Colors
    – Badge Open
    – Badge Closed
    – Badge Featured
    – Badge Popular
    – Badge New
    */
    /* Badge Open */
    .atbd_bg-success, .atbd_content_active #directorist.atbd_wrapper .atbd_badge.atbd_badge_open, .atbd_content_active .widget.atbd_widget[id^=’bd’] .atbd_badge.atbd_badge_open, .atbd_content_active .widget.atbd_widget[id^=’dcl’] .atbd_badge.atbd_badge_open, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbd_badge.atbd_badge_open{
    background: #32cc6f !important;
    }

    /* Badge Closed */
    .atbd_bg-danger, .atbd_content_active #directorist.atbd_wrapper .atbd_give_review_area #atbd_up_preview .atbd_up_prev .rmrf:hover, .atbd_content_active #directorist.atbd_wrapper .atbd_badge.atbd_badge_close, .atbd_content_active .widget.atbd_widget[id^=’bd’] .atbd_badge.atbd_badge_close, .atbd_content_active .widget.atbd_widget[id^=’dcl’] .atbd_badge.atbd_badge_close, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbd_badge.atbd_badge_close {
    background: #e23636 !important;
    }

    /* Badge Featured */
    .atbd_bg-badge-feature, .atbd_content_active #directorist.atbd_wrapper .atbd_badge.atbd_badge_featured, .atbd_content_active .widget.atbd_widget[id^=’bd’] .atbd_badge.atbd_badge_featured, .atbd_content_active .widget.atbd_widget[id^=’dcl’] .atbd_badge.atbd_badge_featured, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbd_badge.atbd_badge_featured {
    background: #fa8b0c !important;
    }

    /* Badge Popular */
    .atbd_bg-badge-popular, .atbd_content_active #directorist.atbd_wrapper .atbd_badge.atbd_badge_popular, .atbd_content_active .widget.atbd_widget[id^=’bd’] .atbd_badge.atbd_badge_popular, .atbd_content_active .widget.atbd_widget[id^=’dcl’] .atbd_badge.atbd_badge_popular, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbd_badge.atbd_badge_popular {
    background: #f51957 !important;
    }

    /* Badge New */
    .atbd_content_active #directorist.atbd_wrapper .atbd_badge.atbd_badge_new {
    background: #122069 !important;
    }

    /*
    Change default primary dark background
    */
    .ads-advanced .price-frequency .pf-btn input:checked + span, .btn-checkbox label input:checked + span, .atbdpr-range .ui-slider-horizontal .ui-slider-range, .custom-control .custom-control-input:checked ~ .check–select, .atbd_content_active #directorist.atbd_wrapper .atbd_listing_meta .atbd_listing_rating, .atbd_content_active #directorist.atbd_wrapper .atbd_listing_meta .atbd_listing_price, #directorist.atbd_wrapper .pagination .nav-links .current, .atbd_content_active #directorist.atbd_wrapper .atbd_contact_information_module .atbd_director_social_wrap a, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbdp-widget-categories > ul.atbdp_parent_category > li:hover > a span, .atbd_content_active #directorist.atbd_wrapper .widget.atbd_widget .atbdp.atbdp-widget-tags ul li a:hover{
    background: #444752 !important;
    }

    /*
    Change default primary dark border
    */
    .ads-advanced .price-frequency .pf-btn input:checked + span, .btn-checkbox label input:checked + span, .atbdpr-range .ui-slider-horizontal .ui-slider-handle, .custom-control .custom-control-input:checked ~ .check–select, .custom-control .custom-control-input:checked ~ .radio–select, #atpp-plan-change-modal .atm-contents-inner .dcl_pricing_plan input:checked + label:before, #dwpp-plan-renew-modal .atm-contents-inner .dcl_pricing_plan input:checked + label:before{
    border-color: #444752 !important;
    }

    /*
    Map Marker Icon Colors
    */
    /* Marker Shape color */
    .atbd_map_shape{
    background: #444752 !important;
    }
    .atbd_map_shape:before{
    border-top-color: #444752 !important;
    }

    /* Marker icon color */
    .map-icon-label i, .atbd_map_shape > span {
    color: #444752 !important;
    }

    </style><!– start search section –>

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi,
    In recent version of Directorist we added new feature where you can define your own custom CSS style for buttons, map marker and primary color, to apply this custom CSS style to the site we need to add those CSS styles in header of the site. However if you don’t want use Style Settings from Directorist dashboard then you can disable this feature by adding following hook in your functions.php file.

    function atbdp_include_style_settings() { return false; }
add_filter('include_style_settings', 'atbdp_include_style_settings');
    Thread Starter themedically

    (@themedically)

    It worked!

    Thank you for the extra-speedy response and help with solving this issue. It wasn’t a life/death situation, but I’d like to keep my code as clean as possible.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Remove inline style codes that clutter the code’ is closed to new replies.