@extends('layouts.master')
@section('content')
    <!-- Main Section Start -->
    <section id="main" class="main" style="margin-top: 200px">

        <!-- Main Section Content Start -->
        <div class="main__content">
            <div class="container-fluid p-0 fullheight-mobile" dir="rtl">
                <div class="row g-0 fullheight-mobile">


                    <section id="main" class="main">

                        <!-- Main Section Content Start -->
                        <div class="main__content">
                            <div class="container-fluid p-0 fullheight-mobile">
                                <div class="row g-0 fullheight-mobile">

                                    <!-- Main Section Intro Start -->
                                    <div class="col-12 col-xl-6 main__intro">

                                        <!-- Intro Content Start -->
                                        <div class="intro__content">

                                            <!-- Headline Start -->
                                            <div id="headline" class="headline column">
                                                <h1 class="headline__animate text-light">Photo Application and how to
                                                    use it for student </h1>
                                                <p class="headline__text text-light-base">Lets go check it
                                                    <img src="{{asset('assets/img/StudentScreenLogo.png')}}" alt="Stundlogo">
                                                </p>
                                                <div class="headline__btnholder">

                                                    <!-- <a href="#" id="notify-trigger" class="btn btn-l btn-light">Notify me</a> -->

                                                </div>

                                            </div>
                                            <!-- Headline End -->

                                        </div>
                                        <!-- Intro Content End -->


                                    </div>
                                    <!-- Main Section Intro End -->

                                    <!-- Main Section Media Start -->
                                    <div class="col-12 col-xl-9 main__media">

                                        <!-- Media Content Start -->
                                        <div class="media__content split">

                                            <!-- Main Section Image & Background Effect Start -->


                                            <!-- Background Effect Start -->
                                            <!-- Main Section Slider Start -->
                                            <div class="main-slider">
                                                <!-- slider main container -->
                                                <div class="swiper-main">
                                                    <!-- additional required wrapper -->
                                                    <div class="swiper-wrapper">
                                                        <!-- slides -->

                                                    </div>
                                                    <!-- navigation buttons -->
                                                    <div class="main-slider-controls">

                                                    </div>
                                                </div>
                                            </div>
                                            <!-- Main Section Slider End -->
                                            <!-- Background Effect End -->

                                            <!-- Color Layer Start -->
                                            <div class="color-layer color-layer-black-04-mobile"></div>
                                            <!-- Color Layer End -->

                                        </div>
                                        <!-- Main Section Image & Background Effect End -->

                                    </div>
                                    <!-- Media Content End -->

                                </div>
                                <!-- Main Section Media End -->

                            </div>
                        </div>
                    </section>
                </div>
                <!-- Main Section Content End -->
            </div>
        </div>
    </section>
    <!-- Main Section End -->
    <!-- Portfolio Section Start -->
    <section id="portfolio" class="inner portfolio">

        <!-- Section Info Start -->
        <div class="inner__info bg-medium">
            <div class="info__wrapper">
                <div class="container-fluid p-0">
                    <div class="row g-0">

                        <!-- Section Title Start -->
                        <div class="col-12 col-lg-1 info__title">
                            <div class="title-content column">
                                <span class="section-title text-light">Student</span>
                            </div>
                        </div>
                        <!-- Section Title End -->

                        <!-- Section Content Start -->
                        <div class="col-12 col-lg-11 info__content">
                            <div class="container-fluid p-0">
                                <div class="row g-0">

                                    <!-- Content Block - Section Text - Start -->
                                    <div class="col-12 col-lg-6 content-block">
                                        <div class="column">
                                            <h2 class="text-light"> طريقة الاستخدام للطالب</h2>
                                            <p class="section-text text-light-base">
                                                Chek It !
                                            </p>
                                        </div>
                                    </div>
                                    <!-- Content Block - Section Text - End -->

                                    <!-- Content Block - Gallery - Start -->
                                    <div class="col-12 content-block">

                                        <!-- Works Gallery Start -->
                                        <div class="container-fluid p-0 works__gallery">
                                            <div class="row g-0 my-gallery" itemscope
                                                 itemtype="http://schema.org/ImageGallery">
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/SendCode.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Log in</small>
                                                            <ol>
                                                                <li><span class="bbb"> إدخال الكود :</span> في البداية
                                                                    تقوم بإدخال الكود الذي تقوم باستلامه من مشرف المعلم
                                                                    او المعلم والذي يكون موحدك ولا تنسي اختيار السنتر
                                                                    الذي يمثلك
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>

                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/notactive.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Not Active</small>
                                                            <ol>
                                                                <li><span class="bbb"> تفعيل الاكونت :</span> لازم
                                                                    المشرف او المدرس يفعلك الاكونت بتاعك الاول علشان
                                                                    تقدر تشوف كل حاجه فى الابليكيشن
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>

                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/Profile.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Profile</small>
                                                            <ol>
                                                                <li><span class="bbb">  الملف الشخصي  :</span> ثم تقوم
                                                                    بالدخول علي الملف الشخصي وعليك ملاحظة ان الارقام
                                                                    التي توجد في الدوائر تمثل الأرقام الكليه في الحضور
                                                                    والامتحانات اي العدد الذي يحدده المعلم من حصص و
                                                                    امتحانات والأرقام الجزئية هيا الارقام التي تمثل
                                                                    حضورك وامتحاناتك من الارقام الكلي
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>

                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/Home.png')}}" class="my-gallery__image"
                                                         itemprop="thumbnail" alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">HomePage</small>
                                                            <ol>
                                                                <li><span class="bbb"> الصفحة الرئيسية :</span> وهيا
                                                                    الصفحة التي يمكن لك من خلالها الوصول الي الامتحانات
                                                                    والفيديوهات التي يقوم بنشرها المعلم وكذالك الإعلانات
                                                                    التي يعلن عنها المعلم
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/idstudent.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">QR Code</small>
                                                            <ol>
                                                                <li>
                                                                    <span class="bbb"> الكود  :</span> في حالة تسجيلك
                                                                    علي التطبيق يقوم التطبيق بإنشاء لك كود خاص بك والذي
                                                                    تقوم بتسجيل الحضور من خلاله عن طريق انك تظهر هذه
                                                                    العلامات للماسح الضوئي (الاسكانر)الموجود تليفون
                                                                    المعلم
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/Menu.PNG')}}" class="my-gallery__image"
                                                         itemprop="thumbnail" alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">menu</small>
                                                            <ol>
                                                                <li><span class="bbb"> القائمة الجانبية :</span> يمكنك
                                                                    التواصل مع فريق العمل من خلال الصغط علي احدي ايقونات
                                                                    التواصل و في حالة انك تريد الوصول الي مدرس اخر علي
                                                                    نفس التطبيق يمكنك النقر علي إضافة كود وإضافة كود
                                                                    المعلم الذي تريده (يعني يا صديقي لو انت بتاخد مع
                                                                    اكتر من مدرس وكلهم معاهم نفس التطبيق تقدر تغير من
                                                                    مدرس لمدرس تاني من خلال الطريقة دي بدل ما تخرج وتخش
                                                                    من اول وجديد)
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/vedio.PNG')}}" class="my-gallery__image"
                                                         itemprop="thumbnail" alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Viedios</small>
                                                            <ol>
                                                                <li><span class="bbb"> مشاهدة الفيديوهات :</span> بص يا
                                                                    صديقي الطالب انت من خلال الصفحة دي تقدر تتفرج علي
                                                                    الفيديوهات الي بينزلها المستر #بديهيات
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>


                                                </figure>
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/codevideo.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Viedios</small>
                                                            <ol>
                                                                <li><span class="bbb"> مشاهدة الفيديوهات :</span> ساعات
                                                                    هتلاقي فيديوهات مقفولة وهنا لما تدوس علي الفيديو
                                                                    عشان يشتغل لازم تدخل الكود وخلي بالك عشان الفيديو
                                                                    بيتفتح مرتين بس ولو فتحت الفيديو وخرجت من الابليكيشن
                                                                    خالص بتتحسب مرة لكن لو فتحت الفيديو وقفلت التليفون
                                                                    وجيت تفتحه هيتفتح علي الفيديو عادي وتقدر تكمل عادي
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>


                                                </figure>
                                                <!-- gallery single item -->
                                                <figure class="col-12 col-sm-6 col-xl-4 column my-gallery__item"
                                                        itemprop="associatedMedia" itemscope
                                                        itemtype="http://schema.org/ImageObject">
                                                    <img src="{{asset('assets/img/ScreenAPP/Student/advertising.png')}}"
                                                         class="my-gallery__image" itemprop="thumbnail"
                                                         alt="Image description"/>

                                                    <figcaption class="my-gallery__description"
                                                                itemprop="caption description">
                                                        <h3 class="text-light">
                                                            <small class="text-light-base">Advertisement</small>
                                                            <ol>
                                                                <li><span class="bbb">الإعلانات   :</span> هنا يا صديقي
                                                                    تقدر تشوف الاعلانات الي بينزلها المستر #بديهيات
                                                                </li>
                                                            </ol>
                                                        </h3>
                                                    </figcaption>
                                                </figure>


                                            </div>
                                        </div>
                                        <!-- Works Gallery End -->

                                    </div>
                                    <!-- Content Block - Gallery - End -->

                                </div>
                            </div>
                        </div>
                        <!-- Section Content End -->

                    </div>
                </div>
            </div>
        </div>
        <!-- Section Info End -->
    </section>

@endsection