@extends('main')

@section('content')
    <section class="page-section">
        <div class="container">
            <div class="row">
                <div class="col-sm-10 col-sm-offset-1 col-lg-8 col-lg-offset-2">
                   @for($i=0;$i<4;$i++)
                        <div class="expand-section">
                            <h2 class="expand-trigger">
                                Category {{$i}}
                            </h2>
                            <div class="expand-block">
                                <ul>
                                    <li>
                                        <a href="#">Download Link</a>
                                    </li>
                                    <li>
                                        <a href="#">Download Link</a>
                                    </li>
                                    <li>
                                        <a href="#">Download Link</a>
                                    </li>
                                    <li>
                                        <a href="#">Download Link</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    @endfor
                </div>
            </div>
        </div>
    </section>
@stop
@section('footerargs')
    <script>
        jQuery(document).ready(function(){
            $('.expand-trigger').on('click',function(){
                $(this).closest('.expand-section').toggleClass('expanded');
            })
        });
    </script>
@stop