@component('home.layouts.component', ['title' => 'صفحه تکی مقاله'])

    @slot('style')
    @endslot

    @slot('content_top')
    @endslot

    @slot('content')
        <div class="container">
            <div class="d-flex justify-content-center">
                <div class="container-article-width">
                    <div class="article-content-holder">
                        <h1 class="title">
                            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
                        </h1>
                        <div class="author-published-holder">
                            <div class="author-avatar-holder">
                                <img class="author-avatar" src="https://beyondco.de/img/marcel.jpg" alt="avater">
                            </div>
                            <div class="author-published-text">
                                <div class="author-name">
                                    مشخصات نویسنده
                                </div>
                                <div class="published-at">
                                    ۱۴۰۰/۰۴/۱۸
                                </div>
                            </div>
                        </div>
                        <div class="content-text">
                            <h1>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h1>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <h2>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h2>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <h3>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h3>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <ul>
                                <li>روزنامه و مجله در ستون</li>
                                <li>روزنامه و مجله در ستون</li>
                                <li>روزنامه و مجله در ستون</li>
                            </ul>
                            <h2>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h2>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <ol>
                                <li>روزنامه و مجله در ستون</li>
                                <li>روزنامه و مجله در ستون</li>
                                <li>روزنامه و مجله در ستون</li>
                            </ol>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                <img width="600" height="300" src="https://www.codeitbro.com/wp-content/uploads/2020/09/benefits-of-computer-programming.jpg" alt="img">
                            </div>
                            <h2>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h2>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <div>
                                <video controls>
                                    <source src="http://learn.shayhowe.com/assets/misc/courses/html-css/adding-media/earth.ogv" type="video/ogg">
                                    <source src="http://learn.shayhowe.com/assets/misc/courses/html-css/adding-media/earth.mp4" type="video/mp4">
                                    Please <a href="http://learn.shayhowe.com/assets/misc/courses/html-css/adding-media/earth.mp4" download>download</a> the video.
                                </video>
                            </div>
                            <h2>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h2>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <table class="table table-bordered">
                                <thead>
                                <tr>
                                    <th scope="col">ردیف</th>
                                    <th scope="col">عنوان</th>
                                    <th scope="col">تعداد</th>
                                    <th scope="col">توضیحات</th>
                                </tr>
                                </thead>
                                <tbody>
                                <tr>
                                    <th scope="row">۱</th>
                                    <td>متن</td>
                                    <td>۲۳۵</td>
                                    <td>توضیحات</td>
                                </tr>
                                <tr>
                                    <th scope="row">۲</th>
                                    <td>متن</td>
                                    <td>۴۵۷۴</td>
                                    <td>توضیحات</td>
                                </tr>
                                </tbody>
                            </table>
                            <h2>
                                عنوان مقاله متون بلکه روزنامه و مجله در ستون
                            </h2>
                            <div>
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته، حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد. در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها و شرایط سخت تایپ به پایان رسد وزمان مورد نیاز شامل حروفچینی دستاوردهای اصلی و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
                            </div>
                            <figure>
                                <blockquote>
                                    <div>
                                        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد.
                                    </div>
                                </blockquote>
                            </figure>
                        </div>
                    </div>
                    <div class="article-button">
                        <button class="btn btn-primary">
                            بعدی
                        </button>
                        <button class="btn btn-primary">
                            قبلی
                        </button>
                    </div>
                    <hr>
                    <div class="comments-holder">
                        <!-- comments user form -->
                        <div class="comments-content">
                            <h5>
                                دیدگاه کاربران
                            </h5>
                            <div class="my-3">
                                لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون
                            </div>
                            <div class="form-opinion">
                                <form action="">
                                    <div class="row">
                                        <div class="col-lg-4 col-md-6 mb-2">
                                            <div class="form-group">
                                                <input class="form-control" id="form_name" type="text" name="name" placeholder="نام">
                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-md-6 mb-2">
                                            <div class="form-group">
                                                <input class="form-control" id="form_email" type="email" name="email" placeholder="ایمیل">
                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-md-12 mb-2">
                                            <div class="form-group">
                                                <input class="form-control" id="form_subject" type="text" name="subject" placeholder="موضوع">
                                            </div>
                                        </div>
                                        <div class="col-md-12 mb-2">
                                            <div class="form-group">
                                                <textarea class="form-control" id="form_message" name="message" placeholder="دیدگاه" rows="4"></textarea>
                                            </div>
                                        </div>
                                        <div class="col-md-12">
                                            <button type="submit" class="btn btn-primary"><span>ارسال دیدگاه</span></button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <!-- show comments user -->
                        <div class="pb-5 comment-customers">
                            <div class="media border p-3 mt-3">
                                <div class="media-body">
                                    <div class="parent-reply-body">
                                        <div class="user-description">
                                        <span class="user-description-holder">
                                            <span class="user-name">
                                                آرش محبی
                                            </span>
                                            <span class="item-details">
                                                <i class="fa fa-clock-o item-details-clock"></i>
                                                <span>
                                                    <span class="item-details-date">
                                                        ۱۷ خرداد ۱۳۹۹
                                                    </span>
                                                    <span class="item-details-time">
                                                        ۱۲:۱۸
                                                    </span>
                                                </span>
                                            </span>
                                        </span>
                                            <span class="d-flex">
                                            <span class="reply-post">
                                                <i class="fa fa-reply reply-post-icon"></i>
                                            </span>
                                            <span class="reply-post-like-button">
                                                <span class="reply-post-like-count">۱۲</span>
                                                <i class="fa fa-heart-o"></i>
                                            </span>
                                        </span>
                                        </div>
                                        <div class="user-comment-text">
                                            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت
                                            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت با استفاده از طراحان گرافیک است، چاپگرها
                                            لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت با استفاده از طراحان گرافیک است، چاپگرها
                                            چاپ، و با استفاده از طراحان گرافیک است، چاپگرها
                                        </div>
                                        <div class="form-reply-opinion" style="display: none;">
                                            <form action="">
                                                <div class="row">
                                                    <div class="col-lg-4 col-md-6 mb-2">
                                                        <div class="form-group">
                                                            <input class="form-control" id="form_name" type="text" name="name" placeholder="نام">
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 col-md-6 mb-2">
                                                        <div class="form-group">
                                                            <input class="form-control" id="form_email" type="email" name="email" placeholder="ایمیل">
                                                        </div>
                                                    </div>
                                                    <div class="col-lg-4 col-md-12 mb-2">
                                                        <div class="form-group">
                                                            <input class="form-control" id="form_subject" type="text" name="subject" placeholder="موضوع">
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12 mb-2">
                                                        <div class="form-group">
                                                            <textarea class="form-control" id="form_message" name="message" placeholder="دیدگاه" rows="4"></textarea>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-12">
                                                        <button type="submit" class="btn btn-primary"><span>ارسال دیدگاه</span></button>
                                                        <button class="btn btn-danger btn-cancel-reply"><span>انصراف</span></button>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                    <div>
                                        <div class="media px-3 pt-3">
                                            <div class="media-body">
                                                <div class="parent-reply-body">
                                                    <div class="user-description">
                                                    <span class="user-description-holder">
                                                        <span class="user-name">
                                                            آرشftgyrht محبی
                                                        </span>
                                                        <span class="item-details">
                                                            <i class="fa fa-clock-o item-details-clock"></i>
                                                            <span>
                                                                <span class="item-details-date">
                                                                    ۱۷ خرداد ۱۳۹۹
                                                                </span>
                                                                <span class="item-details-time">
                                                                    ۱۲:۱۸
                                                                </span>
                                                            </span>
                                                        </span>
                                                    </span>
                                                    </div>
                                                    <div class="user-comment-text">
                                                        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت
                                                        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت با استفاده از طراحان گرافیک است، چاپگرها
                                                        با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- paginate -->
                                <div class="pagination-holder">
                                    <nav>
                                        <ul class="pagination pagination">
                                            <li class="page-item active" aria-current="page">
                                                <span class="page-link">1</span>
                                            </li>
                                            <li class="page-item"><a class="page-link" href="#">2</a></li>
                                            <li class="page-item"><a class="page-link" href="#">3</a></li>
                                        </ul>
                                    </nav>
                                </div>
                            </div>
                        </div>

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

        <div class="container my-4">
            <hr>
            <div class="latest-article">
                <h5>
                    مقالات اخیر
                </h5>
                <div class="row">
                    @for($i=0; $i<3; $i++)
                        <div class="col-lg-4">
                            <div class="card">
                                <div class="card-body">
                                    <h5 class="card-title">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم</h5>
                                    <p class="card-text">
                                        لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت با استفاده از طراحان گرافیک است، چاپگرها با استفاده از طراحان گرافیک است،
                                    </p>
                                    <div class="author-published-holder">
                                        <div class="author-avatar-holder">
                                            <img class="author-avatar" src="https://beyondco.de/img/marcel.jpg" alt="avater">
                                        </div>
                                        <div class="author-published-text">
                                            <div class="author-name">
                                                مشخصات نویسنده
                                            </div>
                                            <div class="published-at">
                                                ۱۴۰۰/۰۴/۱۸
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endfor
                </div>
            </div>
        </div>
    @endslot

    @slot('script')
        <script>
            $('.reply-post-icon').click(function () {
                $('.form-opinion').slideUp();
                $(this).parents('.parent-reply-body').find('.form-reply-opinion').slideDown();
            });

            $('.btn-cancel-reply').click(function (e) {
                e.preventDefault();
                $('.form-opinion').slideDown();
                $(this).parents('.parent-reply-body').find('.form-reply-opinion').slideUp();
            });
        </script>
    @endslot

@endcomponent