contact.html

<!DOCTYPE html>
<html lang="fa" dir="rtl">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>وبلاگ نقطه صفر | تماس ما</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
            integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css">
        <!-- <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazir-font@v30.1.0/dist/font-face.css" rel="stylesheet"
        type="text/css" /> -->
        <link rel="stylesheet" href="css/bootstrap.min.css">
        <link rel="stylesheet" href="icons/bootstrap-icons.css">
        <link rel="stylesheet" href="css/reboot.css">

    </head>

    <body class="bg-dark" id="top">
        <!--message-->
        <div class="bg-warning">
            <div class="alert alert-warning alert-dismissible fade show text-center mb-0" role="alert">
                <strong>20 درصد تخفیف</strong> برای عضویت بخش ویژه
                <a href="#" class="text-decoration-none text-white btn btn-primary">عضویت</a>
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        </div>
        <div class="container g-4">
            <div class="row">
                <div class="py-2 bg-dark text-white mb-2">
                    <ul class="nav">
                        <li class="nav-item pe-2 py-2"><span class="text-warning">تلفن: </span>09123456789</li>
                        <li class="nav-item pe-2 py-2"><span class="text-warning">ایمیل: </span> info@test.com</li>
                        <li class="nav-item px-2 py-2"><a href="#"><i class="bi bi-instagram text-warning"></i></a></li>
                        <li class="nav-item px-2 py-2"><a href="#"><i class="bi bi-telegram text-warning"></i></a></li>
                        <li class="nav-item px-2 py-2"><a href="#"><i class="bi bi-facebook text-warning"></i></a></li>
                    </ul>
                </div>
            </div>
        </div>

        <!--nav-->
        <div class="bg-dark py-2 shadow sticky-top">
            <div class="container bg-dark">
                <nav class="navbar navbar-expand-lg navbar-light">
                    <div class="container-fluid">
                        <a class="navbar-brand text-warning" href="index.html"><h1>وبلاگ نقطه صفر</h1></a>
                        <button class="navbar-toggler bg-danger text-dark" type="button" data-bs-toggle="offcanvas"
                            data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent"
                            aria-expanded="false" aria-label="Toggle navigation">
                            <span class="navbar-toggler-icon"></span>
                        </button>
                        <div class="offcanvas offcanvas-start bg-dark ps-5" id="navbarSupportedContent">
                            <div class="offcanvas-header">
                                <h5 class="offcanvas-title" id="offcanvasNavbarLabel">منو</h5>
                                <button type="button" class="btn-close  bg-danger" data-bs-dismiss="offcanvas"
                                    aria-label="Close"></button>
                            </div>
                            <ul class="navbar-nav">
                                <li class="nav-item">
                                    <a class="nav-link active  text-white" aria-current="page"
                                        href="index.html">خانه</a>
                                </li>
                                <li class="nav-item dropdown">
                                    <a class="nav-link dropdown-toggle text-white" href="#" id="navbarDropdown"
                                        role="button" data-bs-toggle="dropdown" aria-expanded="false">
                                        بلاگ
                                    </a>
                                    <ul class="dropdown-menu text-white bg-dark text-center" aria-labelledby="navbarDropdown">
                                        <li><a class="dropdown-item text-white" href="blog-single.html">جزئیات بلاگ</a>
                                        </li>
                                        <li><a class="dropdown-item text-white" href="blog-list.html">لیست بلاگ ها</a>
                                        </li>
                                    </ul>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link  text-white" aria-current="page" href="contact.html">تماس با
                                        ما</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link  text-white" aria-current="page" href="about.html">درباره ما</a>
                                </li>
                                <div class="ps-5 d-flex">
                                    <a href="cart.html" class="btn btn-dark ms-1 shadow text-warning"
                                        data-bs-toggle="tooltip" data-bs-placement="top" title="سبد خرید"><i
                                            class="bi bi-cart"></i></a>
                                    <a href="wishlist.html" class="btn btn-dark ms-1 shadow text-danger"
                                        data-bs-toggle="tooltip" data-bs-placement="top" title="لیست علاقه مندی ها"><i
                                            class="bi bi-heart-fill"></i></a><br>
                                    <a href="login.html" class="btn btn-dark ms-1 shadow login">ورود</a>
                                    <a href="register.html" class="btn btn-dark ms-1 shadow register">ثبت نام</a>
                                </div>
                            </ul>
                            <div class="pt-4 d-lg-none">
                                <h2 class="text-info text-center pb-2">وبلاگ نقطه صفر</h2>
                                <p class="lead text-white text-center px-5">جدید ترین اخبار در وبلاگ
                                   تیم ما در تلاش است تا جدید ترین اخبار موجود در دنیا را ، در اختیار شما عزیزان قرار دهد .
                                </p>
                            </div>
                        </div>
                    </div>
                </nav>
                <div class="py-3">
                    <form class="d-flex">
                        <input class="form-control me-2 rounded-0" type="search" placeholder="جستوجو کن ..." aria-label="Search">
                        <button class="btn btn-outline-success rounded-0" type="submit">جستوجو</button>
                    </form>
                </div>
            </div>
        </div>

        <!--breadcrumb-->
        <div class="py-4 g-4">
            <div class="container">
                <div class="row">
                    <nav aria-label="breadcrumb">
                        <ul class="breadcrumb">
                            <li class="breadcrumb-item"><a href="index.html"
                                    class="text-secondary text-decoration-none">خانه</a></li>
                                    <i class="bi bi-arrow-left text-secondary px-3"></i>
                            <li class="breadcrumb-item active text-white" aria-current="page">تماس با ما</li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>

        <!--Google map-->
        <div class="py-5 g-4">
            <div class="container">
                <div id="map-container-google-1" class="z-depth-1-half map-container" style="height: 500px">
                    <iframe src="https://maps.google.com/maps?q=ardabil&t=&z=13&ie=UTF8&iwloc=&output=embed"
                        frameborder="0" style="border:0" allowfullscreen></iframe>
                </div>
                <div class="row pt-5">
                    <a href="#" class="text-decoration-none">
                        <h2 class="text-white">گالری <i class="ps-1 bi bi-arrow-up-left-circle-fill text-danger"></i>
                        </h2>
                    </a>
                    <div class="col-md-2 col-lg-4 col-xl-3 shadow">
                        <img src="img/1.svg" alt="img" class="img-fluid">
                    </div>
                    <div class="col-md-2 col-lg-4 col-xl-3 shadow">
                        <img src="img/4.svg" alt="img" class="img-fluid">
                    </div>
                    <div class="col-md-2 col-lg-4 col-xl-3 shadow">
                        <img src="img/2.svg" alt="img" class="img-fluid">
                    </div>
                    <div class="col-md-2 col-lg-4 col-xl-3 shadow">
                        <img src="img/4.svg" alt="img" class="img-fluid">
                    </div>
                </div>
            </div>
        </div>

        <div class="py-4 g-4">
            <div class="container">
                <div class="row">
                    <div class="col-12 text-center pb-4">
                        <h2 class="text-warning display-4 py-3">تماس با ما</h2>
                        <p class="text-white lead justify-content-center">
                            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.
                            چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی
                            تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در
                            شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها
                            شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی
                            ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط
                            سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته
                            اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                        </p>
                    </div>
                    <div class="col-12">
                        <form action="#">
                            <div class="mb-3">
                                <label for="exampleFormControlInput1" class="form-label text-white">نام و نام خانوادگی
                                    *</label>
                                <input type="text" required class="form-control" id="exampleFormControlInput1"
                                    placeholder="لطفا نام و نام خانوادگی خود را وارد کنید .">
                            </div>
                            <div class="mb-3">
                                <label for="exampleFormControlInput2" class="form-label text-white">آدرس ایمیل
                                    *</label>
                                <input type="email" required class="form-control" id="exampleFormControlInput2">
                            </div>
                            <div class="mb-3">
                                <label for="exampleFormControlInput3" class="form-label text-white">عوان تماس</label>
                                <input type="text" placeholder="عنوان تماس خود را وارد کنید ..." class="form-control" id="exampleFormControlInput3">
                            </div>
                            <div class="mb-3">
                                <label for="exampleFormControlTextarea1" class="form-label text-white">متن تماس *</label>
                                <textarea class="form-control" required id="exampleFormControlTextarea1"
                                    placeholder="بنویسید ..." rows="10"></textarea>
                            </div>
                            <div class="mb-3">
                                <button class="btn btn-success px-4" type="submit">ارسال</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>

        <!-- recently post -->
        <div class="py-4 g-4">
            <div class="container">
                <div class="row">
                    <a href="#" class="text-decoration-none">
                        <h2 class="text-white">پست های پیشنهادی <i
                                class="ps-1 bi bi-arrow-up-left-circle-fill text-danger"></i></h2>
                    </a>
                    <div class="row row-cols-1 row-cols-md-3 g-4">
                        <div class="col">
                            <div class="card bg-dark border-0 shadow post-section">
                                <a href="#" class="text-decoration-none"><img src="img/1.svg"
                                        class="card-img-top img-fluid" alt="img"></a>
                                <div class="card-body">
                                    <a href="#" class="text-decoration-none">
                                        <h5 class="card-title text-warning">عنوان پست</h5>
                                    </a>
                                    <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                </div>
                                <div class="card-footer py-2 border-0">
                                    <a href="#" class="text-decoration-none btn btn-dark btn-more text-success fs-5"><i
                                            class="bi bi-arrow-left ps-2"></i>بیشتر !</a>
                                </div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="card bg-dark border-0 shadow post-section">
                                <a href="#" class="text-decoration-none"><img src="img/1.svg"
                                        class="card-img-top img-fluid" alt="img"></a>
                                <div class="card-body">
                                    <a href="#" class="text-decoration-none">
                                        <h5 class="card-title text-warning">عنوان پست</h5>
                                    </a>
                                    <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                </div>
                                <div class="card-footer py-2 border-0">
                                    <a href="#" class="text-decoration-none btn btn-dark btn-more text-success fs-5"><i
                                            class="bi bi-arrow-left ps-2"></i>بیشتر !</a>
                                </div>
                            </div>
                        </div>
                        <div class="col">
                            <div class="card bg-dark border-0 shadow post-section">
                                <a href="#" class="text-decoration-none"><img src="img/1.svg"
                                        class="card-img-top img-fluid" alt="img"></a>
                                <div class="card-body">
                                    <a href="#" class="text-decoration-none">
                                        <h5 class="card-title text-warning">عنوان پست</h5>
                                    </a>
                                    <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                </div>
                                <div class="card-footer py-2 border-0">
                                    <a href="#" class="text-decoration-none btn btn-dark btn-more text-success fs-5"><i
                                            class="bi bi-arrow-left ps-2"></i>بیشتر !</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--footer-->
        <footer class="py-4 g-4 bg-gradient shadow">
            <div class="container">
                <div class="row p-3">
                    <div class="col-md-6 col-lg-4 col-xl-3">
                        <h2 class="text-warning py-3 display-6">وبلاگ نقطه صفر</h2>
                        <p class="text-white pe-5">
                            وبلاگ ما تشکیل شده از دو تیم 4 نفره، ما در این سایت در تلاش هستیم تا اخبار روز دنیا را در
                            اختیار کاربران عزیزمان قرار دهیم .
                        </p>
                    </div>
                    <div class="col-md-6 col-lg-4 col-xl-3">
                        <h2 class="text-white py-3 display-6 border-5 border-primary border-end pe-3">
                            صفحات اصلی</h2>
                        <ul class="text-white list-unstyled">
                            <li class="nav-item"><a href="index.html" style="opacity: 0.70"
                                    class="text-decoration-none text-white">خانه</a></li>
                            <li class="nav-item"><a href="blog-list.html" style="opacity: 0.70"
                                    class="text-decoration-none text-white">بلاگ</a></li>
                            <li class="nav-item"><a href="#" style="opacity: 0.70"
                                    class="text-decoration-none text-white">تماس با ما</a></li>
                            <li class="nav-item"><a href="#" style="opacity: 0.70"
                                    class="text-decoration-none text-white">درباره ما</a></li>
                        </ul>
                    </div>
                    <div class="col-md-6 col-lg-4 col-xl-3">
                        <h2 class="text-white py-3 border-5 border-primary border-end pe-3">لینک های
                            مشترک</h2>
                        <ul class="text-white list-unstyled">
                            <li class="nav-item"><a href="index.html" style="opacity: 0.70"
                                    class="text-decoration-none text-white">خانه</a></li>
                            <li class="nav-item"><a href="about.html" style="opacity: 0.70"
                                    class="text-decoration-none text-white">درباره ما</a></li>
                            <li class="nav-item"><a href="contact.html" style="opacity: 0.70"
                                    class="text-decoration-none text-white">تماس با ما</a></li>
                        </ul>
                    </div>
                    <div class="col-md-6 col-lg-4 col-xl-3">
                        <h2 class="text-white py-3 display-6 border-5 border-primary border-end pe-3">
                            جامعه ما</h2>
                        <ul class="text-white list-unstyled">
                            <li class="nav-item"><a href="#" style="opacity: 0.70"
                                    class="text-decoration-none text-white">خبرنگاران جوان</a></li>
                            <li class="nav-item"><a href="#" style="opacity: 0.70"
                                    class="text-decoration-none text-white">خبرنگاران محلی</a></li>
                            <li class="nav-item"><a href="#" style="opacity: 0.70"
                                    class="text-decoration-none text-white">خبرنگاران جهانی</a></li>
                        </ul>
                    </div>
                </div>
                <hr class="text-white">
                <div class="text-center text-white">
                    ساخته شده توسط <a href="https://instagram.com/py.d.d" target="_blank"
                        class="text-warning pe-2 text-decoration-none">علی
                        بهزاد</a><i class="bi bi-heart-fill text-danger pe-2"></i>
                    <a href="#top" class="text-decoration-none text-info pe-3 fs-3"><i
                            class="bi bi-arrow-up-circle ps-3"></i></a>
                    2021 &copy;
                </div>
            </div>
        </footer>
        <!--scripts-->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
            crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js"
            integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB"
            crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.min.js"
            integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13"
            crossorigin="anonymous"></script>
        <script src="js/bootstrap.bundle.js"></script>
        <script src="js/my_js.js"></script>
    </body>

</html>