EnlighterJS

jQuery Example

jQuery Code used on this page

jQuery(function(jq){
    // enlight all pre elements with class "toggler"
    jq('#btn-enable').click(function(){
        jq('pre.toggler').enlight({
            theme: 'bootstrap4'
        });
    });

    // remove highlighting from all pre elements with class "toggler"
    jq('#btn-disable').click(function(){
        jq('pre.toggler').enlight(false);
    });
});

Another codeblock

// buttons used in codegroups + toolbar
.enlighter-btn{
    display: inline-block;
    margin: 0px 5px 0px 5px;
    padding: 3px 5px 3px 5px;
    border: solid 1px #333333;
    background-color: #f0f0f0;
    cursor: pointer;
}

// buttons
.enlighter-btn-raw{
    background-image: data-uri('icons/enlighter_code.svg');
}

.enlighter-btn-window{
    background-image: data-uri('icons/enlighter_rawcode.svg');
}

.enlighter-btn-website{
    background-image: data-uri('icons/enlighter_icon_white.svg');
}