@extends('layouts/frontend/layoutFrontend')

@section('title', 'Profil')

@section('page-style')
<!-- Page -->
<link
    href="https://fonts.googleapis.com/css2?family=League+Spartan:wght@100;200;300;400;500;600;700;800;900&display=swap"
    rel="stylesheet">
<link
    href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap"
    rel="stylesheet">
<link rel="stylesheet" href="{{asset('assets/vendor/frontend/css/all.min.css')}}">
<link rel="stylesheet" href="{{asset('assets/vendor/frontend/css/slick.css')}}">
<link rel="stylesheet" href="{{asset('assets/vendor/frontend/css/bootstrap.min.css')}}">
<link rel="stylesheet" href="{{asset('assets/vendor/frontend/css/style.css')}}">
<link rel="stylesheet" href="{{asset('assets/vendor/frontend/css/style.css')}}">

@endsection

@section('page-script')
<script src="{{asset('assets/vendor/frontend/js/jquery.min.js')}}"></script>
<script src="{{asset('assets/vendor/frontend/js/slick.min.js')}}"></script>
<script src="{{asset('assets/vendor/frontend/js/bootstrap.bundle.min.js')}}"></script>
<script src="{{asset('assets/vendor/frontend/js/modal.js')}}"></script>
<script src="{{asset('assets/vendor/frontend/js/custom.js')}}"></script>
@endsection


@section('content')

<div class="site-content">
    <!-- Preloader start -->
    <div class="loader-mask">
        <div class="loader">
        </div>
    </div>
    <!-- Preloader end -->

    <!-- Homescreen content start -->
    <struc id="profile-screen">
        <div class="container">
            <div class="profile-screen-wrap mt-32">
                <div class="profile-first">
                    <div class="profile-edit-img">
                        {!! QrCode::size(100)->backgroundColor(47, 51, 73)->size(150)->color(
                        255,
                        255,
                        255
                        )->generate(Auth::user()->name) !!}
                    </div>
                    <div class="profile-details mt-24">
                        <h1>{{ Auth::user()->name }}</h1>
                    </div>
                </div>
                <!-- <div class="profile-second mt-32">
                    <div class="boder-top-profile"></div>
                    <div class="profile-second-wrap">
                        <div class="profile-follower">
                            <h2>6.3k</h2>
                            <p>Broj bodova</p>
                        </div>
                        <div class="profile-following">
                            <h2>10.5k</h2>
                            <p>Rang lista</p>
                        </div>
                    </div>
                    <div class="boder-bottom-profile"></div>
                </div> -->
                <div class="profile-third">
                    <!--                     <div class="send-instruction-btn mt-32">
                        <a href="check-mail-screen.html">Promjeni lozinku</a>
                    </div> -->
                    <div class="send-instruction-btn mt-32">
                        @if(Auth::check())
                        <a href="{{ route('logout') }}"
                            onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                            <i class='ti ti-logout me-2'></i>
                            <span class="align-middle">Odjavi se</span>
                        </a>
                        <form method="POST" id="logout-form" action="{{ route('logout') }}">
                            @csrf
                        </form>
                        @endif
                    </div>
                </div>
            </div>
        </div>
        <div class="about-us-social-media mt-32">
            <div class="about-us-icon-wrapper">
                <div class="social-detail-about ">
                    <div class="shape facebook-bg">
                        <a href="https://www.facebook.com/nargilabarcarsija.lukavac" target="_blank">
                            <img src="{{ asset('assets/img/socialmedia/facebook.svg') }}" alt="facebook">
                        </a>
                    </div>
                    <div>
                        <p class="about-social-txt">Facebbok</p>
                    </div>
                </div>
                <div class="social-detail-about ">
                    <div class="shape instragram-bg">
                        <a href="https://www.instagram.com/nargilabar_carsijalukavac/" target="_blank">
                            <img src="{{ asset('assets/img/socialmedia/instagram.svg') }}" alt="instagram">
                        </a>
                    </div>
                    <div>
                        <p class="about-social-txt">Instagram</p>
                    </div>
                </div>
                <div class="social-detail-about ">
                    <div class="shape twitter-bg">
                        <a href="https://twitter.com/" target="_blank">
                            <img src="{{ asset('assets/img/socialmedia/twitter.svg') }}" alt="twitter">
                        </a>
                    </div>
                    <div>
                        <p class="about-social-txt">Twitter</p>
                    </div>
                </div>
                <div class="social-detail-about ">
                    <div class="shape youtube-bg">
                        <a href="https://www.youtube.com/" target="_blank">
                            <img src="{{ asset('assets/img/socialmedia/youtube.svg') }}" alt="youtube">
                        </a>
                    </div>
                    <div>
                        <p class="about-social-txt">YouTube</p>
                    </div>
                </div>
            </div>
        </div>
        </section>

        <div class="dark-overlay"></div>
        @endsection