@extends('layouts/web')

@section('content')

    <div class="container-fluid">
        @include('customer.partials.header')

        <div class="row mx-2">
            <div class="col-12">
                <div class="page-title-box">
                    <h4 class="page-title mt-4" style="border-top: 1px solid #999">{{ __('ALL GAMES') }}</h4>
                </div>
            </div>
        </div>

        <div class="mx-2">
            <a class="d-block text-white p-3 mb-3 bg-opacity-50" style="border: 2px solid #ffffff55; border-radius: 10px; background: url('/images/planets-bg.jpg') top center; background-size: cover" href="{{ route('customer.star-clash.freestyle') }}">
                <div class="row d-flex justify-content-between align-items-center">
                    <div class="col text-wrap">
                        <div style="font-size: calc(1.1rem + 0.1vw);" class="font-orbitron">{{ __('Freestyle') }}</div>
                    </div>
                </div>
            </a>
            <a class="d-block text-white p-3 mb-3 bg-opacity-50" style="border: 2px solid #ffffff55; border-radius: 10px; background: url('/images/championship-bg.jpg') top center; background-size: cover" href="{{ route('customer.star-clash.rolling') }}">
                <div class="row d-flex justify-content-between align-items-center">
                    <div class="col text-wrap">
                        <div style="font-size: calc(1.1rem + 0.1vw);" class="font-orbitron">{{ __('Snatch') }}</div>
                    </div>
                </div>
            </a>
{{--            <a class="d-block text-white p-3 mb-3 bg-opacity-50" style="border: 2px solid #ffffff55; border-radius: 10px; background: url('/images/login_bg.jpg') center center; background-size: cover" href="{{ route('customer.star-clash.reverse') }}">--}}
{{--                <div class="row d-flex justify-content-between align-items-center">--}}
{{--                    <div class="col text-wrap">--}}
{{--                        <div style="font-size: calc(1.1rem + 0.1vw);" class="font-orbitron">{{ __('Reverse') }}</div>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </a>--}}
        </div>
    </div>
@endsection