Post view page
This commit is contained in:
@@ -73,6 +73,7 @@ function App() {
|
||||
<Route path="/pricing" element={<Pricing/>} />
|
||||
<Route path="/reviews" element={<Reviews/>} />
|
||||
<Route path="/single_post" element={<Single_post/>} />
|
||||
<Route path="/sel_post" element={<Single_post/>} />
|
||||
<Route path="/terms" element={<Terms/>} />
|
||||
<Route path="/demo" element={<Demo/>} />
|
||||
<Route path="/about" element={<About/>} />
|
||||
|
||||
@@ -55,7 +55,7 @@ const BlogItems = ({blogData}) => {
|
||||
<p className="p-md post-tag">Float News</p>
|
||||
{/* Post Link */}
|
||||
<h5 className="h5-sm">
|
||||
<a href="single-post.html">{blog.post_title.substring(0,40)+' . . .'}</a>
|
||||
<a href="/sel_post/">{blog.post_title.substring(0,40)+' . . .'}</a>
|
||||
</h5>
|
||||
{/* Text */}
|
||||
<div dangerouslySetInnerHTML={{__html: blog.post_content.substring(0,50)+' . . .'}}></div>
|
||||
@@ -86,7 +86,7 @@ const BlogItems = ({blogData}) => {
|
||||
<p className="p-md post-tag">Float News</p>
|
||||
{/* Post Link */}
|
||||
<h5 className="h5-sm">
|
||||
<a href="single-post.html">{blog.post_title.substring(0,40)+' . . .'}</a>
|
||||
<a href="/sel_post">{blog.post_title.substring(0,40)+' . . .'}</a>
|
||||
</h5>
|
||||
{/* Text */}
|
||||
<div dangerouslySetInnerHTML={{__html: blog.post_content.substring(0,50)+' . . .'}}></div>
|
||||
|
||||
+3
-188
@@ -145,31 +145,7 @@ class Single_post extends React.Component {
|
||||
</p>
|
||||
</li>
|
||||
</ul>
|
||||
{/* Small Title */}
|
||||
<h5 className="h5-md">Egestas volutpat egestas</h5>
|
||||
{/* Text */}
|
||||
<p className="p-lg">In at mauris vel nisl convallis porta at vitae dui. Nam lacus ligula, vulputate molestie bibendum
|
||||
quis, aliquet elementum massa. Vestibulum ut sagittis odio. Ac massa lorem. Fusce eu cursus est. Fusce non nulla vitae massa placerat vulputate vel a purus aliqum mullam blandit
|
||||
</p>
|
||||
{/* Text */}
|
||||
<p className="p-lg">Maecenas gravida porttitor nunc, quis vehicula magna luctus tempor. Quisque laoreet a turpis urna
|
||||
augue, viverra a augue eget, dictum tempor diam. Sed pulvinar nibh, vel imperdiet congue varius viverra.
|
||||
Sapien justo massa lorem. Fusce eu cursus non nulla vitae massa placerat purus. Sagittis congue augue egestas
|
||||
volutpat egestas magna suscipit egestas magna ipsum vitae purus efficitur ipsum primis in cubilia laoreet augue egestas luctus donec
|
||||
</p>
|
||||
{/* BLOG POST INNER IMAGE */}
|
||||
<div className="post-inner-img">
|
||||
<div className="video-preview pc-15">
|
||||
{/* Play Icon */}
|
||||
<a className="video-popup1" href="https://www.youtube.com/embed/SZEflIVnhH8">
|
||||
<div className="video-btn video-btn-lg bg_rose ico-75">
|
||||
<div className="video-block-wrapper"><span className="flaticon-play-button-1" /></div>
|
||||
</div>
|
||||
</a>
|
||||
{/* Preview Image */}
|
||||
<img className="img-fluid" src="assets/images/blog/inner-img-2.jpg" alt="blog-post-image" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Small Title */}
|
||||
<h5 className="h5-md">Vitae massa placerat vulputate</h5>
|
||||
{/* Text */}
|
||||
@@ -216,10 +192,7 @@ class Single_post extends React.Component {
|
||||
<div className="row post-share-links d-flex align-items-center">
|
||||
{/* POST TAGS */}
|
||||
<div className="col-md-9 col-xl-8 post-tags-list">
|
||||
<span><a href="#">Life</a></span>
|
||||
<span><a href="#">Ideas</a></span>
|
||||
<span><a href="#">Story</a></span>
|
||||
<span><a href="#">Web Design</a></span>
|
||||
|
||||
</div>
|
||||
{/* POST SHARE ICONS */}
|
||||
<div className="col-md-3 col-xl-4 post-share-list text-right">
|
||||
@@ -263,165 +236,7 @@ class Single_post extends React.Component {
|
||||
{/* GEOMETRIC OVERLAY */}
|
||||
<div className="bg_fixed geometric_overlay" />
|
||||
</section> {/* END SINGLE POST */}
|
||||
{/* POST COMMENTS
|
||||
============================================= */}
|
||||
<section id="post-comments" className="bg_whitesmoke pb-80 post-comments division">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
{/* COMMENTS WRAPPER */}
|
||||
<div className="col-lg-10 offset-lg-1">
|
||||
<div className="comments-wrapper">
|
||||
{/* Title */}
|
||||
<h5 className="h5-lg">4 Comments</h5>
|
||||
{/* COMMENT #1 */}
|
||||
<div className="media">
|
||||
{/* Comment-1 Avatar */}
|
||||
<img className="mr-3" src="assets/images/post-author-1.jpg" alt="comment-avatar" />
|
||||
<div className="media-body">
|
||||
{/* Comment-1 Meta */}
|
||||
<div className="comment-meta">
|
||||
<h5 className="h5-sm mt-0">Thomas</h5>
|
||||
<span className="comment-date">5 days ago - </span>
|
||||
<span className="btn-reply ico-20">
|
||||
<a href="#leave-comment" className="internal-link"><span className="flaticon-reply-arrow" /> Reply</a>
|
||||
</span>
|
||||
</div>
|
||||
{/* Comment-1 Text */}
|
||||
<p className="p-lg mb-40">Etiam sapien sem magna at vitae pulvinar congue augue egestas pretium neque undo viverra
|
||||
suscipit egestas magna porta ratione, mollis risus lectus porta rutrum aenean primis in augue luctus neque purus ipsum neque dolor primis purus efficitur an ipsum primis in cubilia laoreet augue
|
||||
</p>
|
||||
<hr />
|
||||
{/* COMMENT #2 */}
|
||||
<div className="media">
|
||||
{/* Comment-2 Avatar */}
|
||||
<a href="#" className="pr-3">
|
||||
<img src="assets/images/post-author-2.jpg" alt="comment-avatar" />
|
||||
</a>
|
||||
<div className="media-body">
|
||||
{/* Comment-2 Meta */}
|
||||
<div className="comment-meta">
|
||||
<h5 className="h5-sm mt-0">David Clark</h5>
|
||||
<span className="comment-date">6 days ago - </span>
|
||||
<span className="btn-reply ico-20">
|
||||
<a href="#leave-comment" className="internal-link"><span className="flaticon-reply-arrow" /> Reply</a>
|
||||
</span>
|
||||
</div>
|
||||
{/* Comment-2 Text */}
|
||||
<p className="p-lg">Etiam sapien magna at vitae pulvinar congue egestas a pretium neque viverra suscipit
|
||||
porta ratione, mollis risus lectus porta aliquet lorem puruss mollis
|
||||
</p>
|
||||
</div>
|
||||
</div> {/* END COMMENT #2 */}
|
||||
</div>
|
||||
</div> {/* END COMMENT #1 */}
|
||||
<hr />
|
||||
{/* COMMENT #3 */}
|
||||
<div className="media">
|
||||
{/* Comment-4 Avatar */}
|
||||
<img className="mr-3" src="assets/images/post-author-3.jpg" alt="comment-avatar" />
|
||||
<div className="media-body">
|
||||
{/* Comment-4 Meta */}
|
||||
<div className="comment-meta">
|
||||
<h5 className="h5-sm mt-0">Jasmine</h5>
|
||||
<span className="comment-date">13 days ago - </span>
|
||||
<span className="btn-reply ico-20">
|
||||
<a href="#leave-comment" className="internal-link"><span className="flaticon-reply-arrow" /> Reply</a>
|
||||
</span>
|
||||
</div>
|
||||
{/* Comment-4 Text */}
|
||||
<p className="p-lg">Porta ratione, mollis risus lectus porta rutrum arcu aenean primis in augue luctus and neque
|
||||
purus ipsum neque dolor primis libero tempus, tempor posuere ligula varius an impedit enim tempor vitae
|
||||
pulvinar at congue augue egestas. Praesent aliquet lorem purus, quis mollis nisi laoreet
|
||||
</p>
|
||||
</div>
|
||||
</div> {/* END COMMENT #3 */}
|
||||
<hr />
|
||||
{/* COMMENT #4 */}
|
||||
<div className="media">
|
||||
{/* Comment-4 Avatar */}
|
||||
<img className="mr-3" src="assets/images/post-author-4.jpg" alt="comment-avatar" />
|
||||
<div className="media-body">
|
||||
{/* Comment-4 Meta */}
|
||||
<div className="comment-meta">
|
||||
<h5 className="h5-sm mt-0">Rady Smith</h5>
|
||||
<span className="comment-date">42 days ago - </span>
|
||||
<span className="btn-reply ico-20">
|
||||
<a href="#leave-comment" className="internal-link"><span className="flaticon-reply-arrow" /> Reply</a>
|
||||
</span>
|
||||
</div>
|
||||
{/* Comment-4 Text */}
|
||||
<p className="p-lg">Etiam sapien sem magna at vitae pulvinar congue augue egestas pretium neque undo viverra
|
||||
suscipit egestas magna porta ratione, mollis risus lectus porta rutrum arcu an aenean primis auctor
|
||||
</p>
|
||||
</div>
|
||||
</div> {/* END COMMENT #4 */}
|
||||
<hr />
|
||||
{/* COMMENT FORM */}
|
||||
<div id="leave-comment">
|
||||
{/* Title */}
|
||||
<h5 className="h5-lg">Leave a Comment</h5>
|
||||
{/* Text */}
|
||||
<p className="p-md">Your email address will not be published. Required fields are marked *</p>
|
||||
<form name="commentForm" className="row comment-form">
|
||||
<div className="col-md-12 input-message">
|
||||
<p>Add Comment *</p>
|
||||
<textarea className="form-control message" name="message" rows={6} placeholder="Enter Your Comment Here* ..." required defaultValue={""} />
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<p>Name*</p>
|
||||
<input type="text" name="name" className="form-control name" placeholder="Enter Your Name*" required />
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<p>Email*</p>
|
||||
<input type="email" name="email" className="form-control email" placeholder="Enter Your Email*" required />
|
||||
</div>
|
||||
{/* Contact Form Button */}
|
||||
<div className="col-lg-12 form-btn">
|
||||
<button type="submit" className="btn btn-skyblue tra-skyblue-hover submit">Post Comment</button>
|
||||
</div>
|
||||
{/* Contact Form Message */}
|
||||
<div className="col-md-12 comment-form-msg text-center">
|
||||
<div className="sending-msg"><span className="loading" /></div>
|
||||
</div>
|
||||
</form>
|
||||
</div> {/* END COMMENT FORM */}
|
||||
</div>
|
||||
</div> {/* END COMMENTS WRAPPER */}
|
||||
</div> {/* End row */}
|
||||
</div> {/* End container */}
|
||||
</section> {/* END POST COMMENTS */}
|
||||
{/* NEWSLETTER-1
|
||||
============================================= */}
|
||||
<section id="newsletter-1" className="bg_whitesmoke pb-20 newsletter-section division">
|
||||
<div className="container">
|
||||
<div className="newsletter-wrapper bg-white">
|
||||
<div className="row d-flex align-items-center">
|
||||
{/* SECTION TITLE */}
|
||||
<div className="col-lg-6">
|
||||
<div className="newsletter-txt">
|
||||
{/* Section ID */}
|
||||
<span className="section-id">Subscribe to Our Newsletter</span>
|
||||
{/* Title */}
|
||||
<h4 className="h4-xl">Stay up to date with our news, ideas and updates</h4>
|
||||
</div>
|
||||
</div>
|
||||
{/* NEWSLETTER FORM */}
|
||||
<div className="col-lg-6">
|
||||
<form className="newsletter-form">
|
||||
<div className="input-group">
|
||||
<input type="email" autoComplete="off" className="form-control" placeholder="Your email address" required id="s-email" />
|
||||
<span className="input-group-btn">
|
||||
<button type="submit" className="btn btn-md btn-skyblue tra-skyblue-hover">Subscribe Now</button>
|
||||
</span>
|
||||
</div>
|
||||
{/* Newsletter Form Notification */}
|
||||
<label htmlFor="s-email" className="form-notification" />
|
||||
</form>
|
||||
</div> {/* END NEWSLETTER FORM */}
|
||||
</div> {/* End row */}
|
||||
</div> {/* End newsletter-holder */}
|
||||
</div> {/* End container */}
|
||||
</section> {/* END NEWSLETTER-1 */}
|
||||
|
||||
|
||||
</div> {/* END PAGE CONTENT */}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user