@extends('layouts/menu_et_footer')


@section('title')
	Paramètres | {{config('app.name')}}
@endsection


@section('container-fluid')
    <script type="text/javascript">
        var p=document.getElementById('menu_parametres');
        p.parentNode.removeChild(p);
        p=document.getElementById('separator_sous_parametres');
        p.parentNode.removeChild(p);
    </script>
    <style type="text/css">
		.btn-circle.btn-xl {
			width: 100px;
			height: 100px;
			padding: 13px 18px;
			border-radius: 60px;
			font-size: 25px;
			text-align: center;
		}
        .profil-avatar{ 
           display: flex;
           justify-content: center;
           align-items: center;
        }

        .profil-avatar:hover{

        }
        .profil-avatar-image{
            width: 180px;
            height: 180px;
            border-radius: 50%;
            background: #2cabe3;
            padding: 3px;
        }
       
	</style>

    <div class="container-fluid">
        <div class="row bg-title">
            <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
            <h4 class="page-title">Paramètres</h4>
        </div>
        {{-- <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
            <button class="right-side-toggle waves-effect waves-light btn-info btn-circle pull-right m-l-20"><i class="ti-settings text-white"></i></button>
            <a target="_blank" class="btn btn-danger pull-right m-l-20 hidden-xs hidden-sm waves-effect waves-light">GestSurvey</a>
        </div> --}}
        </div>
            <!-- /.row -->
            <!-- .row -->
        @php
            $img = "../../../plugins/images/users/default.png";
            if ($auth['avatar']!=null) {
                $img = $auth['avatar'];
            }
        @endphp
        <div class="row">
            {{-- <div class="col-md-4 col-xs-12">
                <div class="white-box">
                    <div class="user-bg"> <img width="100%" alt="" src="">
                        <div class="overlay-box">
                            <div class="user-content">
                                <form class="form-horizontal form-material" id="loginform" data-toggle="validator" method="POST" action="{{route('mise_a_jour_parametres')}}" enctype="multipart/form-data">
                                    @csrf
                                    <input type="file" name="avatar" accept="image/*">
                                    <button type="submit">Télécharger</button>     
                                </form>
                                @if(Auth::user()->avatar)
                                <img src="{{ asset('storage/avatars/'.Auth::user()->avatar) }}" alt="Photo de profil" class="avatar btn btn-light btn-circle btn-xl">
                                @else
                                <div class="avatar btn btn-light btn-circle btn-xl">{{ strtoupper(substr(Auth::user()->name, 0, 1) . substr(Auth::user()->last_name, 0, 1)) }}</div>
                                @endif
                                <h4 class="text-white">{{$auth['firstname'].' '.$auth['lastname']}}</h4>
                                <h5 class="text-white">{{$auth['email']}}</h5> 
                            </div>
                        </div>
                    </div>
                    <div class="user-btm-box">
                        <div class="col-md-4 col-sm-4 text-center">
                         </div>
                        <div class="col-md-4 col-sm-4 text-center">
                         </div>
                        <div class="col-md-4 col-sm-4 text-center">
                         </div>
                    </div>
                </div>
            </div> --}}
            <div class="col-xs-12">
                <div class="white-box">
                    <ul class="nav nav-tabs tabs customtab">
                        <li class="tab active">
                            <a href="#settings" data-toggle="tab" aria-expanded="false">
                                <span class="visible-xs">
                                    <i class="fa fa-cog"></i>
                                </span>
                                <span class="hidden-xs">Mon Profil</span>
                            </a>
                        </li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane active" id="settings">
                            <div class="white-box">
                                
                                {{-- @if(Auth::user()->avatar)
                                    <div class="profil-avatar align-self-center">
                                        <label for="photo-upload">
                                            <img src="{{ asset('storage/avatars/'.Auth::user()->avatar) }}" alt="Photo de profil" class="profil-avatar-image" >
                                            <p><i class="fa fa-camera" title="ajouter une photo" aria-hidden="true"></i></p>
                                        </label>
                                    </div>
                                @else
                                <div class="profil-avatar align-self-center">
                                    <label for="photo-upload">
                                        <div class="avatar btn btn-dark .text-secondary btn-circle btn-xl text-center db profil-avatar-image">{{ strtoupper(substr(Auth::user()->firstname, 0, 1) . substr(Auth::user()->lastname, 0, 1)) }}</div>
                                        <p><i class="fa fa-camera"  title="ajouter une photo" aria-hidden="true"></i></p>
                                    </label>
                                </div>
                                   
                                @endif --}}
                                @if(Auth::user()->avatar)
                                <div class="profil-avatar align-self-center">
                                    <label for="photo-upload">
                                        <img src="{{ asset('storage/avatars/'.Auth::user()->avatar) }}" alt="Photo de profil"  class="profil-avatar-image">
                                        <p><i class="fa fa-camera" title="ajouter une photo" aria-hidden="true"></i></p>
                                    </label>
                                </div>
                            @else