@extends('frontend.layouts.partials.default')
@section('title','Categories')
@section('main')

        <!-- Browse By Category Section -->

        <div class="section">
            <div class="container py-5">
                <div class="row justify-content-center pb-5">
                    <h2>Browse by Category</h2>
                </div>
                <div class="row">
                    @foreach($universal->categories as $category)
                    <div class="col-6 col-md-4 mb-3">
                        <a href="/searchfilter?category={{$category->category_id}}" class="text-dark text-decoration-none">
                            <div class="card border-0">
                            <img src="{{$category->category_image}}" class="card-img-top" alt="{{$category->category_name}}">
                            <div class="card-body p-1">
                                <h5 class="card-title m-0">{{$category->category_name}}</h5>
                            </div>
                            </div>
                        </a>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
<script>
    function onlyOne(checkbox) {
        var checkboxes = document.getElementsByName('license')
        checkboxes.forEach((item) => {
            if (item !== checkbox) item.checked = false
        })
    }
</script>
@endsection