@extends('layouts.app')

@section('head')
@endsection

@section('styles')

@endsection

@section('content')

@include('components.notification')

<main class="grid gap-y-4 p-3 py-20">
    {{--STATS--}}
    @include('partials.stats')

    <div class="grid grid-cols-2 gap-2">
        <!-- ALIŞVERİŞ LİSTESİ -->
        <x-main-button name="LİSTESİ" count="" route="{{ route('shopping-lists.index') }}" icon="checklist" color="sky"
            unit="ALIŞVERİŞ" data="ALIŞVERİŞ LİSTENİZİ OLUŞTURUN ve DÜZENLEYİN" class='' />
        <!-- TÜM HARCAMALAR -->
        <x-main-button name="HARCAMALAR" count="" route="#" icon="mintmark" color="amber" unit="TÜM"
            data="HARCAMA GEÇMİŞİNE GÖZ ATIN" class='' />
        <!-- AYLARA GÖRE HARCAMALAR -->
        <x-main-button name="AYLARA GÖRE" count="" route="" icon="calendar_month" color="stone" unit="HARCAMALAR"
            data="ALIŞVERİŞ LİSTENİZİ OLUŞTURUN ve DÜZENLEYİN" class='' />
        <!-- KATEGORİLERE GÖRE HARCAMALAR -->
        <x-main-button name="KATEGORİLERİ" count="" route="#" icon="category" color="stone" unit="HARCAMA"
            data="HARCAMA GEÇMİŞİNE GÖZ ATIN" class='' />
    </div>

    {{--MOVEMENTS--}}
    @include('partials.movements')
</main>

@endsection

@section('scripts')

@endsection