@layout BlogLayout
@page "/ListBlog"
<PageTitle>دانشنامه</PageTitle>
<main>

            <!-- breadcrumb-area-start -->
            <div class="breadcrumb__area breadcrumb-height p-relative blue-bg-2">
               <div class="breadcrumb__shape-1">
                  <img src="img/breadcrumb/breadcrumb-shape-1.png" alt="">
               </div>
               <div class="breadcrumb__shape-2">
                  <img src="img/breadcrumb/breadcrumb-shape-2.png" alt="">
               </div>
               <div class="container">
                  <div class="row">
                     <div class="col-xl-9 col-lg-7">
                        <div class="breadcrumb__content">
                           <h3 class="breadcrumb__title ">دانشـــــنامه</h3>
                           <div class="breadcrumb__list wow tpfadeUp" data-wow-duration=".9s" data-wow-delay=".4s" style="visibility: visible; animation-duration: 0.9s; animation-delay: 0.4s; animation-name: tpfadeUp;">
                              <span class="child-one"><a href="#">خانه</a></span>
                              <span class="dvdr"><i class="fal fa-angle-left"></i></span>
                              <span>وبلاگ</span>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-3 col-lg-5 col-lg-4 text-center text-md-end">
                        <div class="breadcrumb__img p-relative text-start z-index">
                           <img class="z-index-3" src="img/breadcrumb/breadcrumb-3.png" alt="">
                           <div class="breadcrumb__sub-img wow tpfadeUp" data-wow-duration=".9s" data-wow-delay=".4s" style="visibility: visible; animation-duration: 0.9s; animation-delay: 0.4s; animation-name: tpfadeUp;">
                              <img src="img/breadcrumb/breadcrumb-sub-1.png" alt="">
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <!-- breadcrumb-area-end -->

            <!-- blog-grid-area-start -->
            <div class="blog-grid-area pt-100 pb-100">
               <div class="container">
                  <div class="row">
                     <div class="col-12">
                        <div class="blog-grid-arrow p-relative">
                           <div class="grid-next d-none d-sm-block" tabindex="0" role="button" aria-label="Next slide" aria-controls="swiper-wrapper-69e8d11b78c4bcea">
                              <button>
                                 <i class="far fa-angle-left"></i>
                                 <svg width="36" height="100" viewBox="0 0 36 100" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M4.99999 14C0 7.5 0.5 3.5 0 0L-0.000484467 99.5C-0.000415802 96.7234 1.00003 88 23 71.5C44.9999 55 32.5 37.1667 24 30.5C19.8333 27.1667 9.48375 19.8289 4.99999 14Z" fill="white"></path>
                                 </svg>
                              </button>
                           </div>
                           <div class="grid-prev d-none d-sm-block" tabindex="0" role="button" aria-label="Previous slide" aria-controls="swiper-wrapper-69e8d11b78c4bcea">
                              <button>
                                 <i class="far fa-angle-right"></i>
                                 <svg width="36" height="100" viewBox="0 0 36 100" fill="none" xmlns="http://www.w3.org/2000/svg">
                                    <path d="M30.3164 14C35.3164 7.5 34.8164 3.5 35.3164 0L35.3169 99.5C35.3168 96.7234 34.3164 88 12.3164 71.5C-9.68354 55 2.81642 37.1667 11.3164 30.5C15.4831 27.1667 25.8327 19.8289 30.3164 14Z" fill="white"></path>
                                 </svg>
                              </button>
                           </div>
                           <div class="swiper-container blog-grid-slider-active swiper-container-fade swiper-container-initialized swiper-container-horizontal swiper-container-pointer-events swiper-container-rtl">
                              <div class="swiper-wrapper" id="swiper-wrapper-69e8d11b78c4bcea" aria-live="polite" style="transition-duration: 0ms;"><div class="swiper-slide swiper-slide-duplicate swiper-slide-active" data-swiper-slide-index="2" role="group" aria-label="1 / 5" style="width: 1140px; opacity: 1; transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;">
                                    <div class="blog-grid-slider blog-grid-slider-bg d-flex align-items-center blog-grid-slider-height" data-background="img/blog/inner-blog-3.png" style="background-image: url(&quot;img/blog/inner-blog-3.png&quot;);">
                                       <div class="blog-grid-slider-wrapper">
                                          <div class="blog-grid-slider-meta">
                                             <span class="child-one">منابع</span>
                                             <span class="child-two">آذر 20, 1402</span>
                                          </div>
                                          <div class="blog-grid-slider-title-box">
                                             <h4 class="blog-grid-slider-title"><a href="blog-details.html">5 شرکتی که
                                                   بازاریابی برند <br> را درست انجام می دهند</a></h4>
                                             <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
                                                از طراحان گرافیک است، چاپگرها و
                                             </p>
                                          </div>
                                          <div class="tp-blog-author-info-box blog-grid-avata-box d-flex align-items-center">
                                             <div class="tp-blog-avata">
                                                <img src="img/blog/blog-avata-3.png" alt="">
                                             </div>
                                             <div class="tp-blog-author-info">
                                                <h5>محمد محمدی</h5>
                                                <span>مدیر سایت</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide swiper-slide-next swiper-slide-duplicate-prev" data-swiper-slide-index="0" role="group" aria-label="2 / 5" style="width: 1140px; opacity: 0; transform: translate3d(1140px, 0px, 0px); transition-duration: 0ms;">
                                    <div class="blog-grid-slider blog-grid-slider-bg d-flex align-items-center blog-grid-slider-height" data-background="img/blog/inner-blog-1.png" style="background-image: url(&quot;img/blog/inner-blog-1.png&quot;);">
                                       <div class="blog-grid-slider-wrapper">
                                          <div class="blog-grid-slider-meta">
                                             <span class="child-one">منابع</span>
                                             <span class="child-two">آذر 20, 1402</span>
                                          </div>
                                          <div class="blog-grid-slider-title-box">
                                             <h4 class="blog-grid-slider-title"><a href="blog-details.html">5 شرکتی که
                                                   بازاریابی برند <br> را درست انجام می دهند</a></h4>
                                             <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
                                                از طراحان گرافیک است، چاپگرها و
                                             </p>
                                          </div>
                                          <div class="tp-blog-author-info-box blog-grid-avata-box d-flex align-items-center">
                                             <div class="tp-blog-avata">
                                                <img src="img/blog/blog-avata-3.png" alt="">
                                             </div>
                                             <div class="tp-blog-author-info">
                                                <h5>محمد محمدی</h5>
                                                <span>مدیر سایت</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide" data-swiper-slide-index="1" role="group" aria-label="3 / 5" style="width: 1140px; opacity: 0; transform: translate3d(2280px, 0px, 0px); transition-duration: 0ms;">
                                    <div class="blog-grid-slider blog-grid-slider-bg d-flex align-items-center blog-grid-slider-height" data-background="img/blog/inner-blog-2.png" style="background-image: url(&quot;img/blog/inner-blog-2.png&quot;);">
                                       <div class="blog-grid-slider-wrapper">
                                          <div class="blog-grid-slider-meta">
                                             <span class="child-one">منابع</span>
                                             <span class="child-two">آذر 20, 1402</span>
                                          </div>
                                          <div class="blog-grid-slider-title-box">
                                             <h4 class="blog-grid-slider-title"><a href="blog-details.html">5 شرکتی که
                                                   بازاریابی برند <br> را درست انجام می دهند</a></h4>
                                             <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
                                                از طراحان گرافیک است، چاپگرها و
                                             </p>
                                          </div>
                                          <div class="tp-blog-author-info-box blog-grid-avata-box d-flex align-items-center">
                                             <div class="tp-blog-avata">
                                                <img src="img/blog/blog-avata-3.png" alt="">
                                             </div>
                                             <div class="tp-blog-author-info">
                                                <h5>محمد محمدی</h5>
                                                <span>مدیر سایت</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                                 <div class="swiper-slide swiper-slide-duplicate-active" data-swiper-slide-index="2" role="group" aria-label="4 / 5" style="width: 1140px; opacity: 0; transform: translate3d(3420px, 0px, 0px); transition-duration: 0ms;">
                                    <div class="blog-grid-slider blog-grid-slider-bg d-flex align-items-center blog-grid-slider-height" data-background="img/blog/inner-blog-3.png" style="background-image: url(&quot;img/blog/inner-blog-3.png&quot;);">
                                       <div class="blog-grid-slider-wrapper">
                                          <div class="blog-grid-slider-meta">
                                             <span class="child-one">منابع</span>
                                             <span class="child-two">آذر 20, 1402</span>
                                          </div>
                                          <div class="blog-grid-slider-title-box">
                                             <h4 class="blog-grid-slider-title"><a href="blog-details.html">5 شرکتی که
                                                   بازاریابی برند <br> را درست انجام می دهند</a></h4>
                                             <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
                                                از طراحان گرافیک است، چاپگرها و
                                             </p>
                                          </div>
                                          <div class="tp-blog-author-info-box blog-grid-avata-box d-flex align-items-center">
                                             <div class="tp-blog-avata">
                                                <img src="img/blog/blog-avata-3.png" alt="">
                                             </div>
                                             <div class="tp-blog-author-info">
                                                <h5>محمد محمدی</h5>
                                                <span>مدیر سایت</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div>
                              <div class="swiper-slide swiper-slide-duplicate swiper-slide-prev swiper-slide-duplicate-next" data-swiper-slide-index="0" role="group" aria-label="5 / 5" style="width: 1140px; opacity: 0; transform: translate3d(4560px, 0px, 0px); transition-duration: 0ms;">
                                    <div class="blog-grid-slider blog-grid-slider-bg d-flex align-items-center blog-grid-slider-height" data-background="img/blog/inner-blog-1.png" style="background-image: url(&quot;img/blog/inner-blog-1.png&quot;);">
                                       <div class="blog-grid-slider-wrapper">
                                          <div class="blog-grid-slider-meta">
                                             <span class="child-one">منابع</span>
                                             <span class="child-two">آذر 20, 1402</span>
                                          </div>
                                          <div class="blog-grid-slider-title-box">
                                             <h4 class="blog-grid-slider-title"><a href="blog-details.html">5 شرکتی که
                                                   بازاریابی برند <br> را درست انجام می دهند</a></h4>
                                             <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده
                                                از طراحان گرافیک است، چاپگرها و
                                             </p>
                                          </div>
                                          <div class="tp-blog-author-info-box blog-grid-avata-box d-flex align-items-center">
                                             <div class="tp-blog-avata">
                                                <img src="img/blog/blog-avata-3.png" alt="">
                                             </div>
                                             <div class="tp-blog-author-info">
                                                <h5>محمد محمدی</h5>
                                                <span>مدیر سایت</span>
                                             </div>
                                          </div>
                                       </div>
                                    </div>
                                 </div></div>
                           <span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span></div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <!-- blog-grid-area-end -->

            <!--Portfolio Start-->
            <div class="portfolio blog-grid-inner mb-80">
               <div class="container">
                  <div class="row justify-content-center">
                     <div class="col-lg-8">
                        <div class="tp-about__section-box text-center mb-40">
                           <h3 class="tp-section-title">بیشتر بدانیم</h3>
                        </div>
                     </div>
                  </div>
                  <div class="row grid blog-grid-inner" style="position: relative; height: 1047.48px;">
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat1 cat4 cat3 cat5" style="position: absolute; left: 0%; top: 0px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-1.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>بازاریابی</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>فروردین 12, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">2023 سال حرفه ای در <br> نقد و
                                    بررسی</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-1.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat4 cat3 cat2 cat1" style="position: absolute; left: 33.3333%; top: 0px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-2.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>منابع</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>آذر 12, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">بهترین استفاده از بازخورد</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-2.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat3 cat4 cat5" style="position: absolute; left: 66.6667%; top: 0px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-3.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>نرم افزار مدیریت</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>28 اردیبهشت, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">آموزش تایپ برای کودکان <br>
                                    و مبتدیان</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-3.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat4 cat2 cat3 cat1" style="position: absolute; left: 0%; top: 508px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-4.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>کسب و کار</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>28 فروردین, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">مدیریت پروژه در <br>
                                    نوک انگشتان شما</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-4.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat1 cat2 cat3 cat5" style="position: absolute; left: 33.3333%; top: 508px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-5.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>توسعه</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>28 آذر, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">طراحی فضای کودکان <br>
                                    کائنات</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-5.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div class="col-xl-4 col-lg-6 col-md-6 mb-30 grid-item cat4 cat1 cat5 cat2" style="position: absolute; left: 66.6667%; top: 508px;">
                        <div class="tp-blog-item">
                           <div class="tp-blog-thumb fix">
                              <a href="blog-details.html"><img src="img/blog/blog-grid-6.jpg" alt=""></a>
                           </div>
                           <div class="tp-blog-content">
                              <div class="tp-blog-meta d-flex align-items-center">
                                 <div class="tp-blog-category category-color-1">
                                    <span>طراحی</span>
                                 </div>
                                 <div class="tp-blog-date">
                                    <span>28 فروردین, 1402</span>
                                 </div>
                              </div>
                              <div class="tp-blog-title-box">
                                 <a class="tp-blog-title-sm" href="blog-details.html">چگونه ربات‌های چت می‌توانند به شما
                                    کمک کنند <br> فروش بیشتری را افزایش دهند</a>
                              </div>
                              <div class="tp-blog-author-info-box d-flex align-items-center">
                                 <div class="tp-blog-avata">
                                    <img src="img/avata/avata-6.png" alt="">
                                 </div>
                                 <div class="tp-blog-author-info">
                                    <h5>محمد محمدی</h5>
                                    <span>مدیر سایت</span>
                                 </div>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <!--Portfolio End-->

         
         </main>

@code {

}