<div class="container code_container" ng-init="highCodeInit()">

<!--CSS-->
<!--<div ng-include="'partials/code/css-snippets.html'"></div>-->
<!--JS-->
<!--<div ng-include="'partials/code/js-snippets.html'"></div>-->

<!--</div>-->

<!--PHP-->
<!--<div ng-include="'partials/code/php-snippets.html'"></div>-->


    <!--<pre><code class="language-css">p { color: red }</code></pre>-->


    <input type="text" ng-model="codeSearch" ng-change="testing(this)" style="display: none;">

    <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
    <aside class="accordion accordion1">
        <h1>Javascript</h1>
            <div class="opened-on" ng-include="'partials/code/js-snippets.html'"></div>
    </aside>
    </div>
    <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
    <aside class="accordion accordion2">
        <h1>CSS</h1>
            <div class="opened-on" ng-include="'partials/code/css-snippets.html'"></div>
    </aside>
    </div>

    <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
    <aside class="accordion accordion3">
        <h1 >Miscellaneous</h1>
        <div>
            <h2>Misc. #1</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

            <h2>Misc. #2</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

            <h2>Misc. #3</h2>
            <div>
                <h3>Misc. Item #1a</h3>
                <div>
                    <h4>Misc. Subitem 1</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

                    <h4>Misc. Subitem 2</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

                    <h4>Misc. Subitem 3</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                </div>
                <h3>Misc. Item #2a</h3>
                <div>
                    <h4>Misc. Subitem 1</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>

                    <h4>Misc. Subitem 2</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                </div>
            </div>
        </div>





    </aside>
    </div>
</div>









</div>







<script>

    $(document).ready(function() {
//        $('pre code').each(function(i, block) {
//            hljs.highlightBlock(block);
//        });

        var headers = ["H1","H2","H3","H4","H5","H6"];

        $(".accordion1").click(function(e) {
            var target = e.target,
                name = target.nodeName.toUpperCase();

            if($.inArray(name,headers) > -1) {
                var subItem = $(target).next();

                //slideUp all elements (except target) at current depth or greater
                var depth = $(subItem).parents().length;
                var allAtDepth = $(".accordion1 p, .accordion1 div").filter(function() {
                    if($(this).parents().length >= depth && this !== subItem.get(0)) {
                        return true;
                    }
                });
                $(allAtDepth).slideUp("fast");

                //slideToggle target content and adjust bottom border if necessary
                subItem.slideToggle("fast",function() {
                    $(".accordion1 :visible:last").css("border-radius","0 0 10px 10px");
                });
                $(target).css({"border-bottom-right-radius":"0", "border-bottom-left-radius":"0"});
            }
        });


        $(".accordion2").click(function(e) {
            var target = e.target,
                name = target.nodeName.toUpperCase();

            if($.inArray(name,headers) > -1) {
                var subItem = $(target).next();

                //slideUp all elements (except target) at current depth or greater
                var depth = $(subItem).parents().length;
                var allAtDepth = $(".accordion2 p, .accordion2 div").filter(function() {
                    if($(this).parents().length >= depth && this !== subItem.get(0)) {
                        return true;
                    }
                });
                $(allAtDepth).slideUp("fast");

                //slideToggle target content and adjust bottom border if necessary
                subItem.slideToggle("fast",function() {
                    $(".accordion2 :visible:last").css("border-radius","0 0 10px 10px");
                });
                $(target).css({"border-bottom-right-radius":"0", "border-bottom-left-radius":"0"});
            }
        });


        $(".accordion3").click(function(e) {
            var target = e.target,
                name = target.nodeName.toUpperCase();

            if($.inArray(name,headers) > -1) {
                var subItem = $(target).next();

                //slideUp all elements (except target) at current depth or greater
                var depth = $(subItem).parents().length;
                var allAtDepth = $(".accordion3 p, .accordion3 div").filter(function() {
                    if($(this).parents().length >= depth && this !== subItem.get(0)) {
                        return true;
                    }
                });
                $(allAtDepth).slideUp("fast");

                //slideToggle target content and adjust bottom border if necessary
                subItem.slideToggle("fast",function() {
                    $(".accordion3 :visible:last").css("border-radius","0 0 10px 10px");
                });
                $(target).css({"border-bottom-right-radius":"0", "border-bottom-left-radius":"0"});
            }
        });

    });

</script>