@extends('layouts.app')

@section('content')

<div id="wrapper">

        <section>
            <div class="container text-center mx-auto">
            
                @foreach($business as $businessInfo)
                <div class="qr-main text-center">

                    <!-- QR Image -->

                    <div class="qr-image text-center">
                        <img src="{{$businessInfo->qr_code}}" alt="">
                        <h5>Scan to Share Card</h5>
                    </div>

                    <div class="qr-profile">

                        <!-- Logo -->

                        <div class="profile-avatar mx-auto">
                            <a href="">
                                <img src="/{{$businessInfo->logo}}">
                            </a>
                        </div>

                        <!-- Info -->

                        <div class="profile-info">
                            <h6>{{$businessInfo->name}} </h6>
                            <span>{{$businessInfo->description}} </span>
                        </div>

                        <!-- Links -->

                        <div class="profile-tabs">
                            <div class="profile-links d-flex gap-3">
                                <a class="text-dark text-decoration-none" href="{{$businessInfo->website_url}}">Visit Our Website</a>
                                <a class="text-dark text-decoration-none" href="tel:{{$businessInfo->phone}}">Call Us</a>
                                <a class="text-dark text-decoration-none" href="sms:{{$businessInfo->phone}}">Text Us</a>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
        </section>
    </div>

@endsection