API usage blade file example

api_usage.blade.php

<div class="flex flex-col mt-3">
    <div class="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
        <div class="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
            <div class="shadow overflow-hidden border-b border-gray-200 sm:rounded-lg">
                <h2 class="font-semibold text-xl text-gray-800 leading-tight m-4">
                    My API usage
                </h2>
                <div class="bg-gray-200 flex items-center justify-center px-5 py-5">
                    <div class="w-full max-w-3xl">
                        <div class="-mx-2 md:flex">
                            <div class="w-full md:w-1/3 px-2">
                                <div class="rounded-lg shadow-sm mb-4">
                                    <div class="rounded-lg bg-white shadow-lg md:shadow-xl relative overflow-hidden">
                                        <div class="px-3 pt-8 pb-10 text-center relative z-10">
                                            <h4 class="text-sm uppercase text-gray-500 leading-tight">
                                                Requests today
                                            </h4>
                                            <h3 class="text-3xl text-gray-700 font-semibold leading-tight my-3">
                                                {{collect($requests)->where('date', '>=', today())->where('date', '<=', today()->add(1, 'day'))->count()}}
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="w-full md:w-1/3 px-2">
                                <div class="rounded-lg shadow-sm mb-4">
                                    <div class="rounded-lg bg-white shadow-lg md:shadow-xl relative overflow-hidden">
                                        <div class="px-3 pt-8 pb-10 text-center relative z-10">
                                            <h4 class="text-sm uppercase text-gray-500 leading-tight">
                                                Requests this month
                                            </h4>
                                            <h3 class="text-3xl text-gray-700 font-semibold leading-tight my-3">
                                                {{collect($requests)->where('date', '>=', today()->firstOfMonth())->where('date', '<=', today()->lastOfMonth())->count()}}
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="w-full md:w-1/3 px-2">
                                <div class="rounded-lg shadow-sm mb-4">
                                    <div class="rounded-lg bg-white shadow-lg md:shadow-xl relative overflow-hidden">
                                        <div class="px-3 pt-8 pb-10 text-center relative z-10">
                                            <h4 class="text-sm uppercase text-gray-500 leading-tight">
                                                Lifetime requests
                                            </h4>
                                            <h3 class="text-3xl text-gray-700 font-semibold leading-tight my-3">
                                                {{$requests->count()}}
                                            </h3>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>