famous-home.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>قسيمة | حساب مشهور</title>

    <link rel="shortcut icon" href="assets/img/favicon.svg" type="image/x-icon">
    <link rel="stylesheet" href="assets/css/main.css">
</head>

<body>

    <header>
        <nav class="navbar navbar-expand-lg navbar-light bg-light">
            <div class="container">

                <!--Start logo -->
                <a class="navbar-brand" href="index.html">
                    <div class="nav-logo"><img loading="lazy" src="assets/img/main-logo.png" alt="image"></div>
                </a>
                <!--End Logo -->

                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarScroll"
                    aria-controls="navbarScroll" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>
                <div class="collapse navbar-collapse" id="navbarScroll">
                    <ul class="navbar-nav mx-auto my-2 my-lg-0 p-0 navbar-nav-scroll">

                        <!-- Start Nav Links -->
                        <li class="nav-item">
                            <a class="nav-link" href="index.html">الرئيسية</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="marketer.html">المسوقين</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="about-us.html">من نحن</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="contact-us.html">تواصل معنا</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="terms-conditions.html">الشروط و الاحكام</a>
                        </li>
                        <!-- End Nav Links -->

                    </ul>

                    <!-- Start My Account Button -->

                    <div class="nav-btn">

                        <div class="btn-group">
                            <button type="button" class="my-acc btn btn-secondary dropdown-toggle"
                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> <span><img
                                        src="assets/img/my-acc.svg" alt=""></span> حسابي </button>
                            <div class="dropdown-menu dropdown-menu-right text-right">
                                <a class="dropdown-item" href="#"><span><img src="assets/img/info.svg" alt=""></span> البيانات</a>
                                <a class="dropdown-item" href="#"><span><img src="assets/img/discount.svg" alt=""></span> القسائم</a>
                                <a class="dropdown-item" href="#"><span><img src="assets/img/money.svg" alt=""></span> التعاملات المالية</a>
                                <a class="dropdown-item" href="layouts/terms-famous-sections.html"><span><img src="assets/img/terms.svg" alt=""></span> الشروط والاحكام</a>
                                <a class="dropdown-item" href="#"><span><img src="assets/img/logout.svg" alt=""></span> تسجيل الخروج</a>
                            </div>
                        </div>

                    </div>

                    <!-- End My Account Button -->
                </div>
            </div>
        </nav>
    </header>

    <main class="famous-home">

        <!-- deals tab For Buy Now Page -->

        <div class="tabs-sec">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <ul class="nav nav-pills" id="pills-tab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <a class="nav-link ln-h3" id="info-tab" data-toggle="pill" href="#info-tab-content" role="tab"
                                    aria-controls="info" aria-selected="true">البيانات</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link active" id="qsimh-tab" data-toggle="pill" href="#qsimh-tab-content"
                                    role="tab" aria-controls="qsimh" aria-selected="false">القسائم</a>
                            </li>
                            <li class="nav-item" role="presentation">
                                <a class="nav-link" id="deals-tab" data-toggle="pill" href="#deals-tab-content"
                                    role="tab" aria-controls="deals" aria-selected="false">التعاملات المالية</a>
                            </li>
                        </ul>

                        <div class="tab-content" id="pills-tabContent">

                            <!-- Info -->
                            <div class="info-tab tab-pane fade" id="info-tab-content" role="tabpanel"
                                aria-labelledby="info-tab">

                                <div class="container">
                                    <div class="row">
                                        <div class="col-lg-2"></div>
                                        <div class="col-lg-8">
                                            <form class="was-validated" action="post">
                                                <div class='row'>
                                                    <div class="col-lg-6">

                                                        <div class="box">
                                                            <label for="famous-name">الاسم</label>
                                                            <input name="famous-name"
                                                                class="form-rtl is-invalid form-control"
                                                                placeholder="مثال : علي" type="text" required>
                                                        </div>

                                                        <div class="box">
                                                            <label for="famous-name">اسم الشركة</label>
                                                            <input name="famous-name"
                                                                class="form-rtl is-invalid form-control"
                                                                placeholder="مثال : شركة الاندلس للرحلات" type="text"
                                                                required>
                                                        </div>

                                                        <div class="box">
                                                            <label for="famous-number">رقم الهاتف</label>
                                                            <input name="famous-number" class="is-invalid form-control"
                                                                placeholder="+966123456789" type="number" required>
                                                        </div>

                                                        <div class="box">
                                                            <label for="famous-commercial-registration">رقم السجل
                                                                التجاري</label>
                                                            <input name="famous-commercial-registration"
                                                                class="is-invalid form-control" placeholder="123456"
                                                                type="number" required>
                                                        </div>

                                                    </div>

                                                    <div class="col-lg-6">
                                                        <div class="box">
                                                            <label for="famous-email">البريد الالكتروني</label>
                                                            <input name="famous-email" class="is-invalid form-control"
                                                                placeholder="email@gmail.com" type="email" required>
                                                        </div>
                                                        <div class="box">
                                                            <label for="famous-city">المدينة</label>
                                                            <input name="famous-city"
                                                                class="form-rtl is-invalid form-control"
                                                                placeholder="مثال : الرياض" type="text" required>
                                                        </div>
                                                        <div class="box">
                                                            <label for="famous-password">كلمة المرور</label>
                                                            <input name="famous-password" minlength="8"
                                                                class="is-invalid form-control" placeholder="********"
                                                                type="password" required>
                                                        </div>

                                                        <div class="box">
                                                            <label for="famous-photo">صورة المستخدم</label>
                                                            <div class="custom-file">
                                                                <input class="form-control img-uploader" name="famous_img" type="file" id="famousImgInp" required>
                                                                <div class="img-previewer">
                                                                    <!-- When open the page -->
                                                                    <img src="assets/img/billgates.jpg" class="img-fluid">
                                                                    <!-- If Upload a New File -->
                                                                    <img id='famous-img-upload' class="img-fluid" />
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>

                                                    <div class="col-lg-3"></div>

                                                    <div class="col-lg-6 form-bottom">

                                                        <button type="submit">حفظ</button>

                                                    </div>

                                                    <div class="col-lg-3"></div>
                                                </div>
                                            </form>
                                        </div>
                                        <div class="col-lg-2"></div>
                                    </div>
                                </div>

                            </div>

                            <!-- Qsimh -->
                            <div class="qsimh-tab tab-pane fade show active" id="qsimh-tab-content" role="tabpanel"
                                aria-labelledby="qsimh-tab">

                                <div class="qsimh-table table-responsive">

                                    <table class="table table-hover">
                                        <thead class="thead-color">
                                            <tr>
                                                <th scope="col">صورة</th>
                                                <th scope="col">قسيمة</th>
                                                <th scope="col">خيارات</th>
                                                <th scope="col">مدينة</th>
                                                <th scope="col">الحالة</th>
                                                <th scope="col">أمر</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <th class="qsimh-table-img" scope="row"><img
                                                        src="assets/img/about-mission.png"></th>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>خيارات</td>
                                                <td>الرياض</td>
                                                <td>نشط</th>
                                                <td><a class="order-btn" href="#">تعليق</a></td>
                                            </tr>
                                            <tr>
                                                <th class="qsimh-table-img" scope="row"><img src="assets/img/about-vision.png"></th>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>خيارات</td>
                                                <td>الرياض</td>
                                                <td>نشط</th>
                                                <td><a class="order-btn" href="#">تعليق</a></td>
                                            </tr>
                                            <tr>
                                                <th class="qsimh-table-img" scope="row"><img src="assets/img/about-mission.png"></th>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>خيارات</td>
                                                <td>الرياض</td>
                                                <td>نشط</th>
                                                <td><a class="order-btn" href="#">تعليق</a></td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                            </div>

                            <!-- Deals -->
                            <div class="deals-tab tab-pane fade" id="deals-tab-content" role="tabpanel"
                                aria-labelledby="deals-tab">

                                <div class="row">
                                    <div class="col-lg-3">
                                        <div class="deal-card green">
                                            <div class="deal-card-img cart"></div>
                                            <div class="deal-card-text">
                                                <p>اجمالي الطلبات</p>
                                                <p>5000 ريال</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-lg-3">
                                        <div class="deal-card blue">
                                            <div class="deal-card-img bag"></div>
                                            <div class="deal-card-text">
                                                <p>اجمالي الطلبات</p>
                                                <p>5000 ريال</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-lg-3">
                                        <div class="deal-card red">
                                            <div class="deal-card-img price"></div>
                                            <div class="deal-card-text">
                                                <p>اجمالي الطلبات</p>
                                                <p>5000 ريال</p>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-lg-3">
                                        <div class="deal-card gray">
                                            <div class="deal-card-img money-bag"></div>
                                            <div class="deal-card-text">
                                                <p>اجمالي الطلبات</p>
                                                <p>5000 ريال</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <a class="pull-money" href="pull-money.html">طلب سحب الارباح</a>
                                
                                <!-- ! Modal -->
                                <!-- <a type="button" data-toggle="modal" data-target="#reqest-money" class="pull-money" href="#">طلب سحب الارباح</a> -->

                                <!-- <div class="modal fade" id="reqest-money" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <h5 class="modal-title" id="exampleModalLabel">طلب سحب الاموال</h5>
                                                <button type="button" class="close p-0 m-0" data-dismiss="modal" aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <div class="container-fluid">
                                                    <form class="was-validated pull-form" action="post">
                                                        <div class="row">
                                                            <div class="col-md-6">
                                                                <label for="">الاسم الثلاثي</label>
                                                                <input class="is-invalid form-control" name="famous_name" placeholder="الاسم" type="text" required>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label for="">رقم الأيبان</label>
                                                                <input class="is-invalid form-control" name="famous_iban" placeholder="الايبان" type="text" required>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label for="">اسم البنك</label>
                                                                <input class="is-invalid form-control" name="famous_bank_name" placeholder="البنك" type="text" required>
                                                            </div>
                                                            <div class="col-md-6">
                                                                <label for="">المبلغ المراد سحبه</label>
                                                                <input class="is-invalid form-control" name="famous_money" placeholder="المبلغ" type="number" required>
                                                            </div>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn req-btn">قدم</button>
                                                <button type="button" class="btn close-btn" data-dismiss="modal">اغلاق</button>
                                            </div>
                                        </div>
                                    </div>
                                </div> -->
                                <!-- ! Modal ! -->

                                <div class="deals-table table-responsive">

                                    <table class="table table-hover">
                                        <thead class="thead-color">
                                            <tr>
                                                <th scope="col">مبلغ المعاملة</th>
                                                <th scope="col">صياغة المعاملة</th>
                                                <th scope="col">تفاصيل المعاملة</th>
                                                <th scope="col">تاريخ المعاملة</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <th scope="row">50</th>
                                                <td>ارباح قسيمة</td>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>10/10/2022</td>
                                            </tr>
                                            <tr>
                                                <th scope="row">70</th>
                                                <td>ارباح قسيمة</td>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>10/10/2022</td>
                                            </tr>
                                            <tr>
                                                <th scope="row">150</th>
                                                <td>ارباح قسيمة</td>
                                                <td>تنظيف الاسنان باقة العروس</td>
                                                <td>10/10/2022</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>

                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

    </main>

    <footer>
        <div class="footer-bg">
            <div class="container">
                <div class="row footer-content">
                    <!-- link  -->
                    <div class="footer-links col-md-4">
                        <div class="row">
                            <ul class="col-6">
                                <h3>الموقع</h3>
                                <li><a href="#">الرئيسية</a></li>
                                <li><a href="#">من نحن</a></li>
                                <li><a href="#">المسوقين</a></li>
                            </ul>
                            <ul class="col-6">
                                <h3>الدعم</h3>
                                <li><a href="#">الشروط والاحكام</a></li>
                                <li><a href="#">تواصل معنا</a></li>
                            </ul>
                        </div>
                    </div>
                    <!-- logo -->
                    <div class="col-md-4 logo-col">
                        <a href="#" class="footer-logo"></a>
                    </div>
                    <!-- payments -->
                    <div class="col-md-4">
                        <div class="footer-payments">
                            <div class="app">
                                <h3 class="app-text">تطبيق قسيمة</h3>
                                <div class="app-icons">
                                    <a href="#"><img src="assets/img/android.svg" alt=""></a>
                                    <a href="#"><img src="assets/img/ios.svg" alt=""></a>
                                </div>
                            </div>
                            <div class="pay">
                                <h3 class="pay-text">وسائل الدفع</h3>
                                <div class="payments-icons"></div>
                            </div>
                        </div>
                    </div>
                    <!-- footer bottom -->
                    <div class="col-12">
                        <div class="footer-bottom">
                            <hr>
                            <div class="maroof-div">
                                <a class="maroof" href="#"></a>
                            </div>
                            <div class="row">
                                <div class="col-md-6 rights">
                                    <p>جميع الحقوق محفوظة</p>
                                </div>
                                <div class="col-md-6 icons">
                                    <a href="#">
                                        <i class="snapchat fab fa-snapchat-ghost"></i>
                                    </a>
                                    <a href="#">
                                        <i class="twitter fab fa-twitter"></i>
                                    </a>
                                    <a href="#">
                                        <i class="instagram fab fa-instagram"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>

    <script src="assets/js/main.js"></script>

</body>

</html>