<!DOCTYPE html>
<html lang="en"
      th:replace="~{admin/dashboard/layout:: parent(~{::#content},~{::title},~{::script})}">
<head>
    <title >View A Post</title>

</head>
<body>
<!-- Page content-->
<section class="content" id="content">

        <div class="row">
            <div class="col-md-9">
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">View Post</h3>
                        <div class="card-tools">
                            <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                                <i class="fas fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <h2 th:text="${post.name}"> </h2>
                        <span class="description">
                            <i class="far fa-user"></i>  <span th:text="  ${post.auther}"></span>
                            <i class="far fa-clock"></i> <span th:text="${post.createdAt}"></span>
                            <i class="fas fa-folder-open"></i>  <span th:each="category : ${post.selectedCategories}"  th:value="${category.name}"
                                                                      th:text="${category.name}"></span>
                        <br />
                        <br />
                            <img class="img-fluid mb-3" th:src="@{${post.featuredImage}}" alt="Image from External Service">

                      <span th:utext="${post.body}"> </span>
                    </div><!-- /.card-body -->
                </div><!-- /.card -->
            </div>
            <div class="col-md-3">
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">Older Post</h3>
                        <div class="card-tools">
                            <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                                <i class="fas fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class=" clearfix">

                            <div class="attachment-pushed">
                                <h5 class="attachment-heading"><a href="https://www.lipsum.com/">Lorem ipsum text generator</a></h5>

                                <div class="attachment-text">
                                    Lorem Ipsum is simply dummy text of the printing and typesetting industry... <a href="#">more</a>
                                </div>
                                <!-- /.attachment-text -->
                            </div>
                            <!-- /.attachment-pushed -->
                        </div>
                    </div>
                    <!-- /.col -->
                </div>
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">Categories</h3>

                        <div class="card-tools">
                            <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                                <i class="fas fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="form-group">
                            <span class="badge badge-success float-left" th:each="category : ${post.selectedCategories}"  th:value="${category.selectedCategories}"
                                  th:text="${category.name}"></span>
                        </div>
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
                <div class="card card-primary">
                    <div class="card-header">
                        <h3 class="card-title">Tags</h3>
                        <div class="card-tools">
                            <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">
                                <i class="fas fa-minus"></i>
                            </button>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="form-group">
                             <span class="badge badge-success float-left" th:each="tag : ${post.selectedTags}"  th:value="${tag.selectedTags}" th:text="${tag.name}"></span>
                        </div>
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
<!--                <div class="card card-primary">-->
<!--                    <div class="card-header">-->
<!--                        <h3 class="card-title">Featured Image</h3>-->
<!--                        <div class="card-tools">-->
<!--                            <button type="button" class="btn btn-tool" data-card-widget="collapse" title="Collapse">-->
<!--                                <i class="fas fa-minus"></i>-->
<!--                            </button>-->
<!--                        </div>-->
<!--                    </div>-->
<!--                    <div class="card-body">-->
<!--                        <div class="form-group">-->
<!--                            &lt;!&ndash; Thumbnail Image &ndash;&gt;-->
<!--                            <a href="#img-id" id="openFullscreen">-->
<!--                                <img class="img-fluid mb-3" th:src="@{${post.featuredImage}}" alt="Image from External Service">-->
<!--                            </a>-->
<!--                        </div>-->

<!--                        &lt;!&ndash; Fullscreen Image Overlay &ndash;&gt;-->
<!--                        <div class="overlay" id="img-id">-->
<!--                            <span class="close" id="closeFullscreen">&times;</span>-->
<!--                            <img th:src="@{${post.featuredImage}}" alt="Fullscreen">-->
<!--                        </div>-->
<!--                    </div>-->
                    <!-- /.col -->
                <!-- /.row -->
                <div class="row">
                    <div class="share-art">
                        <div class="sa-title">
                            <strong>SHARE THIS</strong>
                        </div>
                        <a class="btn btn-primary" href="http://www.facebook.com/sharer.php?u=https://newcon-themexpose.blogspot.com/2016/08/apples-new-ipad-lets-you-play-latest.html&amp;title=Apple’s new ipad lets you play the latest games for a fraction of the price" onclick="window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank"><i class="fab fa-facebook-square"></i><span> Share it</span></a>
                        <a class="btn btn-info" href="http://twitter.com/share?url=https://newcon-themexpose.blogspot.com/2016/08/apples-new-ipad-lets-you-play-latest.html&amp;title=Apple’s new ipad lets you play the latest games for a fraction of the price" onclick="window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank"><i class="fab fa-twitter"></i><span> Tweet</span></a>
                        <a class="btn btn-danger" href="https://plus.google.com/share?url=https://newcon-themexpose.blogspot.com/2016/08/apples-new-ipad-lets-you-play-latest.html&amp;title=Apple’s new ipad lets you play the latest games for a fraction of the price" onclick="window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank"><i class="fab fa-google-plus-square"></i><span> Share it</span></a>
                        <a class="btn btn-primary" href="http://www.linkedin.com/shareArticle?url=https://newcon-themexpose.blogspot.com/2016/08/apples-new-ipad-lets-you-play-latest.html&amp;title=Apple’s new ipad lets you play the latest games for a fraction of the price" onclick="window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank"><i class="fab fa-linkedin"></i><span> Share it</span></a>
                        <a class="btn btn-danger" href="http://pinterest.com/pin/create/button/?url=https://newcon-themexpose.blogspot.com/2016/08/apples-new-ipad-lets-you-play-latest.html&amp;media=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrGW5hbtI7xSGrvaYbJlR8zIzUS8mDpClQsO2BZyIL7RZfzRZQQdsFmxgxLKpCUceGVHTKYJUxLA-2iY5kGR7LA00BwxV7vmyGrevm0vg4T1GuGBxn5cZZlnmlGsPaO45t6sqlCeeGJ3E/s1600/14.jpg&amp;description=Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo cons..." onclick="window.open(this.href, 'windowName', 'width=600, height=400, left=24, top=24, scrollbars, resizable'); return false;" rel="nofollow" target="_blank"><i class="fab fa-pinterest-p"></i><span> Pin it</span></a>
                    </div>
                </div>
            </div><!-- /.card -->
        </div>
</section>
<script>

</script>
</body>
</html>
