blog-list.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">
                        <navaria-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 px-3 text-secondary"></i>
                                <li class="breadcrumb-item active text-white" aria-current="page">لیست بلاگ ها</li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>

        <div class="py-4 g-4">
            <div class="container">
                <div class="row mx-4">
                    <div class="col-md-12 col-lg-3 pt-4">
                        <div class="row g-4">
                            <div class="col-12 text-center p-2">
                                <h2 class="text-white display-6 pb-2">دسته بندی ها</h2>
                                <ul class="list-group">
                                    <li
                                        class="list-group-item sidebar-item d-flex bg-dark justify-content-between text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> خبری</a>
                                        </div>
                                        <span class="badge bg-primary rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex bg-dark justify-content-between text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> ورزشی</a>
                                        </div>
                                        <span class="badge bg-primary rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex bg-dark justify-content-between text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> تکنولوژی</a>
                                        </div>
                                        <span class="badge bg-primary rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex bg-dark justify-content-between text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> محیط زیست</a>
                                        </div>
                                        <span class="badge bg-primary rounded-pill">14</span>
                                    </li>
                                </ul>
                            </div>
                            <div class="col-12 text-center p-2">
                                <h2 class="text-white display-6 pb-2">برترین تگ ها</h2>
                                <ul class="list-group">
                                    <li
                                        class="list-group-item sidebar-item d-flex justify-content-between align-items-start bg-dark text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> فوتبال</a>
                                        </div>
                                        <span class="badge bg-warning text-dark rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex justify-content-between align-items-start bg-dark text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> ارز دیجیتال</a>
                                        </div>
                                        <span class="badge bg-warning text-dark rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex justify-content-between align-items-start bg-dark text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white">برنامه نویسی</a>
                                        </div>
                                        <span class="badge bg-warning text-dark rounded-pill">14</span>
                                    </li>
                                    <li
                                        class="list-group-item sidebar-item d-flex justify-content-between align-items-start bg-dark text-white">
                                        <div class="ms-2">
                                            <a href="#" class="text-decoration-none text-white"> سینما</a>
                                        </div>
                                        <span class="badge bg-warning text-dark rounded-pill">14</span>
                                    </li>
                                </ul>
                            </div>
                            <div class="col-12">
                                <img src="img/5.svg" class="img-fluid img-blog" alt="image">
                            </div>
                        </div>
                    </div>
                    <div class="col-md-12 col-lg-9">
                        <div class="row g-4">
                            <div class="col-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="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-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="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-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="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-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="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-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="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-md-6 col-lg-6 col-xl-4">
                                <div class="card border-0 shadow post-section" style="width: 18rem;">
                                    <a href="blog-single.html" class="text-decoration-none"><img src="img/4.svg"
                                            class="card-img-top" alt="alit"></a>
                                    <div class="card-body bg-dark">
                                        <a href="blog-single.html" class="text-decoration-none">
                                            <h5 class="card-title text-warning">عنوان پست</h5>
                                        </a>
                                        <p class="card-text text-white">همه چیز درباره عنوان پست</p>
                                        <a href="#" class="btn btn-dark btn-more text-success fs-5"><i
                                                class="bi bi-arrow-left ps-2"></i>بیشتر !</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="py-4 g-4">
                            <div class="container">
                                <div class="row pe-3">
                                    <nav aria-label="Page navigation example">
                                        <ul class="pagination">
                                            <li class="page-item"><a
                                                    class="page-link bg-dark text-secondary border-1 border-success"
                                                    href="?page=previous">قبلی</a>
                                            </li>
                                            <li class="page-item"><a
                                                    class="page-link bg-dark text-secondary border-1 border-success active"
                                                    href="?page=1">1</a>
                                            </li>
                                            <li class="page-item"><a
                                                    class="page-link bg-dark text-secondary border-1 border-success"
                                                    href="?page=2">2</a>
                                            </li>
                                            <li class="page-item"><a
                                                    class="page-link bg-dark text-secondary border-1 border-success"
                                                    href="?page=3">3</a>
                                            </li>
                                            <li class="page-item"><a
                                                    class="page-link bg-dark text-secondary border-1 border-success"
                                                    href="?page=next">بعدی</a></li>
                                        </ul>
                                    </nav>
                                </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>