{% extends "layout.html" %} {% block content %} <style type="text/css"> .rating { border: none; margin-right: calc(100% - 225px); } .myratings { color: green } .rating>[id^="star"] { display: none } .rating>label:before { margin: 5px; font-size: 2.25em; font-family: FontAwesome; display: inline-block; content: "\f005" } .rating>.half:before { content: "\f089"; position: absolute } .rating>label { color: #ddd; float: right } .rating>[id^="star"]:checked~label, .rating:not(:checked)>label:hover, .rating:not(:checked)>label:hover~label { color: #FFD700 } .rating>[id^="star"]:checked+label:hover, .rating>[id^="star"]:checked~label:hover, .rating>label:hover~[id^="star"]:checked~label, .rating>[id^="star"]:checked~label:hover~label { color: #FFED85 } </style> <section class="section lb m3rem"> <div class="container"> <div class="row"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <div class="page-wrapper"> <div class="blog-title-area"> <ol class="breadcrumb hidden-xs-down"> <li class="breadcrumb-item"><a href="{{ url_for('home') }}">Home</a></li> <li class="breadcrumb-item"><a href="{{ url_for('allposts') }}" >All Blog</a></li> <li class="breadcrumb-item active">{{ post.title }}</li> </ol> <!-- <span class="color-yellow"><a href="marketing-category.html" title="">Lifestyle</a></span> --> <h3>{{ post.title }}</h3> <div class="blog-meta big-meta"> <small><a href="marketing-single.html" title="">{{ post.date }}</a></small> <small><a href="blog-author.html" title="">by {{ post.user.username }}</a></small> <!-- <small><a href="#" title=""><i class="fa fa-eye"></i> 2344</a></small> --> </div><!-- end meta --> <!-- <div class="post-sharing"> <ul class="list-inline"> <li><a href="#" class="fb-button btn btn-primary"><i class="fa fa-facebook"></i> <span class="down-mobile">Share on Facebook</span></a></li> <li><a href="#" class="tw-button btn btn-primary"><i class="fa fa-twitter"></i> <span class="down-mobile">Tweet on Twitter</span></a></li> <li><a href="#" class="gp-button btn btn-primary"><i class="fa fa-google-plus"></i></a></li> </ul> </div> --> </div><!-- end title --> <div class="single-post-media"> <img src="upload/market_blog_06.jpg" alt="" class="img-fluid"> </div><!-- end media --> <div class="blog-content"> {% autoescape false %} {{ post.content }} {% endautoescape %} <div id="post_id" style="display: none"> {{post.id}} </div> </div><!-- end content --> <hr class="invis1"> <div class="custombox clearfix"> <h4 class="small-title">Do you like this post?</h4> <fieldset class="rating"> <script type="text/javascript"> function updateStars(rate) { console.log(rate); console.log($("#post_id").text().trim()); $.ajax({ url : '/ratepost/'+$("#post_id").text().trim()+'?rate='+rate, type : 'GET', success : function(rs){ console.log(rs) }, error : function(error) { console.log(error) // $(".myratings").html("Please login to rate") window.location.href = "/login"; } }); } </script> {% for rIndex in range(5,0,-1) %} {% if rate <= rIndex : %} <input type="radio" id="star{{rIndex}}" name="rating" value="{{rIndex}}" onchange="updateStars('{{rIndex}}')" checked /> <label class="full" for="star{{rIndex}}" title="{{rIndex}} stars"></label> {% else %} <input type="radio" id="star{{rIndex}}" name="rating" value="{{rIndex}}" onchange="updateStars('{{rIndex}}')" /> <label class="full" for="star{{rIndex}}" title="{{rIndex}} stars"></label> {% endif %} {% endfor %} </fieldset> </div><!-- end custom-box --> <hr class="invis1"> <hr class="invis1"> <div class="custombox clearfix"> <h4 class="small-title">Comments</h4> <div class="row"> <div class="col-lg-12"> <div class="comments-list"> {% for comment in comments %} <div class="media"> <div class="media-body"> <h4 class="media-heading user_name">{{comment.user.username}} <small>{{comment.date}}</small></h4> <p>{{comment.content}}</p> <a href="#leaveReply" class="btn btn-primary btn-sm">Reply</a> </div> </div> {% endfor %} </div> </div><!-- end col --> </div><!-- end row --> </div><!-- end custom-box --> <hr class="invis1"> <div class="custombox clearfix"> <h4 class="small-title" id="leaveReply">Leave a Reply</h4> <div class="row"> <div class="col-lg-12"> <form method="post" class="form-wrapper" action="{{ url_for('post_comment', post_id=post.id) }}"> {{ form.hidden_tag() }} <!-- <textarea name="comment" id="comment" cols="25" rows="10"></textarea> --> {{ form.comment(class_="form-control") }} {{ form.submit(class_="btn btn-primary") }} {% for error in form.comment.errors %}<span style="color: red;">[{{ error }}]</span> {% endfor %} </div> </form> </div> </div> </div> </div><!-- end page-wrapper --> </div><!-- end col --> </div><!-- end row --> </div><!-- end container --> </section> <div class="dmtop">Scroll to Top</div> </div><!-- end wrapper --> {% endblock content %}