@section('content')
    <div class="main-content">
        <div class="row">
            <div class="col s12">
                <div class="panel flat-mobile">
                    <div id="testingx" class="panel-body">
                        <div class="row" v-for="resource in resources">
                            <div class="col s2">
                                <img :src="resource.image" alt="@{{ resource.image }}" style="max-width: 150px;"/>
                            </div>
                            <div class="col s10" style='min-height: 10px;'>
                                @{{ resource.description }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
<script type="text/javascript">
var sample_img = "https://i1.wp.com/www.bantennews.co.id/wp-content/uploads/2017/12/images-1_1512069116687.jpeg";
new Vue({
    el: '#testingx',
    data: {
      resources: [
        { image: sample_img, description: 'Foo Lorema ipsuma' },
        { image: sample_img, description: 'Bar Lorema ipsuma' }
      ]
    },
    computed: {
    },
    methods: {
    }
});
</script>
@endsection