@extends('front.layouts.master-auth')
@section('content')
<!-- Start Page Content -->
<section class="page-content userPage">
    <div class="container">
        <div class="user-page-cont">
            <div class="user-relative">
                <div class="user-nav">
                    <div class="client">
                        <div class="user-img">
                            <img src="{{ auth()->user()->avatar_profile_url }}" class="img-fluid" decoding="async" width="100" height="100">
                        </div>
                        <div class="user-text">
                            <h6>
                                {{ auth()->user()->name }}
                            </h6>
                            <div class="rating">
                                    <span class="active">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677"
                                             viewBox="0 0 17.554 16.677">
                                            <path id="Icon_material-star" data-name="Icon material-star"
                                                  d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z"
                                                  transform="translate(-3 -3)" />
                                        </svg>
                                    </span>
                                <span class="active">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677"
                                             viewBox="0 0 17.554 16.677">
                                            <path id="Icon_material-star" data-name="Icon material-star"
                                                  d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z"
                                                  transform="translate(-3 -3)" />
                                        </svg>
                                    </span>
                                <span class="active">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677"
                                             viewBox="0 0 17.554 16.677">
                                            <path id="Icon_material-star" data-name="Icon material-star"
                                                  d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z"
                                                  transform="translate(-3 -3)" />
                                        </svg>
                                    </span>
                                <span class="active">
                                        <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677"
                                             viewBox="0 0 17.554 16.677">
                                            <path id="Icon_material-star" data-name="Icon material-star"
                                                  d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z"
                                                  transform="translate(-3 -3)" />
                                        </svg>
                                    </span>
                                <span>
                                        <svg xmlns="http://www.w3.org/2000/svg" width="17.554" height="16.677"
                                             viewBox="0 0 17.554 16.677">
                                            <path id="Icon_material-star" data-name="Icon material-star"
                                                  d="M11.777,16.4,17.2,19.677l-1.439-6.17,4.792-4.152-6.311-.535L11.777,3,9.311,8.819,3,9.355l4.792,4.152-1.439,6.17Z"
                                                  transform="translate(-3 -3)" />
                                        </svg>
                                    </span>
                            </div>
                        </div>
                    </div>
                    <ul class="list-unstyled">
                        <li><a href="userPage.html">@lang('front.profile')</a></li>
                        <li><a href="userRating.html">@lang('front.reviews')</a></li>
                        <li><a href="userWorks.html" class="active">@lang('front.gallery')</a></li>
                    </ul>
                </div>
            </div>
            <div class="user-info-cont">
                <div class="user-page-head">
                    <h2 class="user-page-title">

                    </h2>
                    @if(auth()->check() && auth()->user()->id == $user->id)
                    <a href="addWork.html" class="head-link">
                        @lang('front.add_new_project')
                    </a>
                    @endif
                </div>
                <div class="works-grid">
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/01.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                مشروع سوشيال ميديا
                            </a>
                        </h3>
                    </div>
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/02.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                تصميم شعار لموقع إلكتروني
                                موقعة في مدينة لندن
                            </a>
                        </h3>
                    </div>
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/03.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                تصميم واجهة المستخدم
                            </a>
                        </h3>
                    </div>
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/04.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                مشروع سوشيال ميديا
                            </a>
                        </h3>
                    </div>
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/05.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                مشروع سوشيال ميديا
                            </a>
                        </h3>
                    </div>
                    <div class="work-item">
                        <a href="userWork.html" class="work-img">
                            <img src="{{asset('front/images/work/06.png')}}" class="img-fluid" loading="lazy" decoding="async">
                        </a>
                        <h3 class="work-name">
                            <a href="userWork.html">
                                مشروع سوشيال ميديا
                            </a>
                        </h3>
                    </div>
                </div>

                <ul class="result-pagination list-unstyled">
                    <li>
                        <a href="#!" class="active">
                            1
                        </a>
                    </li>
                    <li>
                        <a href="#!">
                            2
                        </a>
                    </li>
                    <li>
                        <a href="#!">
                            3
                        </a>
                    </li>
                    <li>
                        <a href="#!">
                            4
                        </a>
                    </li>
                    <li>
                        <a href="#!">
                            5
                        </a>
                    </li>
                    <li>
                        …
                    </li>
                    <li>
                        <a href="#!">
                            10
                        </a>
                    </li>
                </ul>
            </div>
            <div class="user-side-info">
                <div class="user-page-head">
                    <h2 class="user-page-title">
                        المهارات
                    </h2>
                </div>
                <div class="user-main-info tags-items">
                        <span class="tag-item">
                            HTML
                        </span>
                    <span class="tag-item">
                            CSS
                        </span>
                    <span class="tag-item">
                            JS
                        </span>
                    <span class="tag-item">
                            Front End Developement
                        </span>
                </div>
                <div class="user-page-head">
                    <h2 class="user-page-title">
                        سرعة الرد
                    </h2>
                </div>
                <div class="user-main-info reply-items">
                    <span class="reply-item">متوسط سرعة الرد : ساعتين و ٧ دقائق</span>
                    <span class="reply-item">آخر تواجد : منذ دقيقتين</span>
                </div>
                <div class="user-page-head">
                    <h2 class="user-page-title">
                        مشروعات يعمل عليها
                    </h2>
                </div>
                <div class="workingOn">
                    <div class="project-side-item">
                        <a href="projectDetails.html" class="project-name">
                            تطوير موقع قائم واصلاح خصائصه
                        </a>
                        <p>
                            لدي موقع مبني على PHP VUEJS LARAVEL المطلوب اصلاحات وتطوير بعض الخصائص عددهم تقريبا
                            20 تعديل وتطوير سيتم التفصيل فيهم للعرض المناسب هنا نبذة بسيطة : التطوير المراد : -
                            تطوير الاحصائيات بحيث مايلي -ذا كانت الزيارة للموقع بواسطة ios او بواسطة Android
                            يظهر كعدد للاجهزة
                        </p>
                        <span>باقي يومين على تسليمة</span>
                    </div>
                    <div class="project-side-item">
                        <a href="projectDetails.html" class="project-name">
                            تطوير موقع قائم واصلاح خصائصه
                        </a>
                        <p>
                            لدي موقع مبني على PHP VUEJS LARAVEL المطلوب اصلاحات وتطوير بعض الخصائص عددهم تقريبا
                            20 تعديل وتطوير سيتم التفصيل فيهم للعرض المناسب هنا نبذة بسيطة : التطوير المراد : -
                            تطوير الاحصائيات بحيث مايلي -ذا كانت الزيارة للموقع بواسطة ios او بواسطة Android
                            يظهر كعدد للاجهزة
                        </p>
                        <span>باقي يومين على تسليمة</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- End Page Content -->
@endsection