Spectre tpl file

<!--TOPNAV-->
<div class="bg-nav">
<header class="navbar container-nav p-3">
<section class="navbar-section">
<a class="navbar-brand" href="/"><i class="bi bi-gear-wide-connected" id="logo_icon_min"></i> FLAT-CMS.RU</a>
</section>

<section class="navbar-section">
<div class="widget widget-search widget-search-form" id="widget-search-form-1"><form action="/search" method="post"><div class="input-group input-inline"><input class="form-input" type="text" name="q" value="" placeholder="Search…" autocomplete="off"> <button class="btn btn-primary input-group-btn" type="submit"><i class="bi bi-search ml-1 mr-1"></i></button></div></form></div>
</section>

</header>
</div>
<!--TOPNAV-->

<div class="container centered mt-5" id="main-content"><div class="columns">

<!--SIDEBAR-->

<div class="column col-3 col-md-12 col-xs-12  mobile-order-2">



<!--Categories-->
<div class="column mb-5">
<div class="widget widget-category widget-category-list" id="widget-category-list-1">
<ul>
<li><a href="#">CATEGORY</a> <span class="counter">0</span></li>
<li><a href="#">CATEGORY</a> <span class="counter">0</span></li>
<li><a href="#">CATEGORY</a> <span class="counter">0</span></li>
</ul>
</div>
</div>
<!--Categories-->
 <!--Tags cloud-->
<div class="column mb-5">

  <h5><i class="bi bi-tags"></i> TAGS</h5>
  <div class="widget-content">
<a href="#"># TAG <span class="counter_tags">[ 0 ]</span></a>
<a href="#"># TAG <span class="counter_tags">[ 0 ]</span></a>
<a href="#"># TAG <span class="counter_tags">[ 0 ]</span></a>
  </div>

</div>
<!--Tags cloud-->


<!--Recent comments-->
<div class="column mb-5">
<h5><i class="bi bi-mic"></i> COMMENTS</h5>

<ul class="recent-responses">

<li class="recent-response">
<img src="http://www.gravatar.com...">
<div class="recent-response-header">
<span class="recent-response-name">AUTHOR</span>
<small>11 October 2023</small>
<a href="#" rel="nofollow"><i class="bi bi-link-45deg"></i></a>
</div>
<div class="recent-response-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusm…</div>
</li>

<li class="recent-response">
<img src="http://www.gravatar.com...">
<div class="recent-response-header">
<span class="recent-response-name">AUTHOR</span>
<small>11 October 2023</small>
<a href="#" rel="nofollow"><i class="bi bi-link-45deg"></i></a>
</div>
<div class="recent-response-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusm…</div>
</li>


</ul>


</div>
<!--Recent comments--> 



<div class="column mb-5">
<small>
<a href="/about">О сайте </a>&nbsp;&nbsp;<a href="/terms">Правила </a>&nbsp;&nbsp;<a href="#">Ссылки </a>
<br><i class="bi bi-layers"></i> Proudly powered by <a href="#" target="blank" rel="nofollow" data-tooltip="###">###</a> & <a class="" href="https://github.com/picturepan2/spectre"  data-tooltip="Spectre css framework" rel="nofollow" target="_blank"> Spectre </a></small>
<br><small>Скорость загрузки:&nbsp;<? $tt = number_format(rtrim(sprintf("%.20f", (microtime(true) - $_SERVER['REQUEST_TIME_FLOAT'])), "0"),3,'.',',');
if (strpos(($tt."0"), "0") != 0) { $tt = number_format($tt,2,'.',','); } echo ($tt); ?> сек.&nbsp;</small> 
</div> 








</div> 
<!--SIDEBAR-->







<!--MAIN CONTENT-->
<div class="column col-9 col-md-12 col-xs-12">
 
  <article>

	<div class="card mb-5">
  <div class="card-image">
<!--PREVIEW IMAGE-->
<?php if($article->fields->cover_article): ?>
<img  class="img-responsive" src="<?php echo $article->fields->cover_article; ?>">
<?php else: ?>
<img src="https://picturepan2.github.io/spectre/img/macos-sierra.jpg" class="img-responsive">
<?php endif; ?>	      
  </div>
<!--PREVIEW IMAGE-->

<!--HEADER-->  
  <div class="card-header">
<!--Title-->
  <h3>
	TITLE
  </h3> 
<span><i class="bi bi-person"></i>  AUTHOR</span>

<br><small>00:00</small>	
	
  </div>
<!--HEADER-->  

<!--CONTENT-->   
  <div class="card-body">
<p>
 CONTENT
</p>
<p><a href="#" rel="tag"># TAG</a>, <a href="#" rel="tag"># TAG 2</a></p>
  </div>
<!--CONTENT-->   
 
  
 
<!--FOOTER-->    
  <div class="card-footer">
  


<div class="float-left">
<a href="#"><i class="bi bi-folder"></i> CATEGORY</a>
</div> 


  
	<div class="float-right">
	 <i class="bi bi-eye"></i> 0
	 <i class="bi bi-chat"></i> 0
	</div> 

  </div>
<!--FOOTER-->   
</div>
	
</article>  


<!--LIST_COMMENTS-->
<ol class="comments-body">
<li class="comment">


<div class="card mb-5">
<div class="card-header">
<figure class="comment-avatar">
<img src="http://www.gravatar.com/avatar/ce0e352d73ba7d4432c57f2c4a239a51?s=60&amp;d=mp" alt="" width="60" height="60">
</figure>
<header class="comment-header">
<h5 class="comment-name"><span class="a">AUTHOR</span></h5>
<small>11 October 2023, 21:25</small>
<a href="#" rel="nofollow" data-tooltip="Permalink"><i class="bi bi-link-45deg"></i></a>
</header>
</div>

<div class="card-body"><div class="comment-body">
<strong>Lorem ipsum sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
<footer class="comment-footer"><a href="#">Edit</a> / <a href="#">Delete</a></footer></div>

</div>


</li>
</ol>
<!--LIST_COMMENTS-->

<!--COMMENT FORM-->
<div class="card mb-5"><div class="card-body">
<form class="comment-form" id="comment-form">

<div class="input_comment columns">
<div class="column col-6 col-xs-12">
<input name="name" class="form-input input-lg" type="text" value="" placeholder="Name"></div>
<div class="column col-6 col-xs-12"><input name="email" class="form-input input-lg" type="email" value="" placeholder="Email"></div>
</div>


<div class="input_comment columns"><div class="column col-12">
<div class="form-group">
<label class="form-label math_captha_label">5 − 2 =</label>
<input name="math" class="form-input input-lg math_captha" type="text" value="" autocomplete="off">
</div>
</div></div>

<div><p><button class="btn btn-primary " type="submit"><i class="fa fa-check-circle"></i> Publish</button></p></div>
</form>

</div></div>

<!--COMMENT FORM-->

<!--PAGINATION-->
<div class="p-centered mb-5">
<nav class="blog-pager">
<span class="pagination">
<span class="pagination-first">First</span>
<span class="pagination-prev">Previous</span>
<span><strong class="pagination-step pagination-1 current">1</strong>
<a href="/article/2" class="pagination-step pagination-step-2">2</a></span>
<a href="/article/2" rel="next" class="pagination-next">Next</a>
<a href="/article/2" class="pagination-last">Last</a></span>
</nav>
</div>
<!--PAGINATION-->

</div>
<!--MAIN CONTENT-->


</div></div>
WolfJN27 May 2025
Спасибо Вам за ваш труд) Благодарю за отзыв
Александр27 May 2025
Спасибо Вам за ваш труд)
WolfJN09 May 2025
Спасибо за публикацию шаблона Я хотела это сделать самостоятельно на о…
Сергей08 May 2025
Спасибо за шаблон, выложил в разделе расширений, только поправил ширин…
WolfJN07 October 2024
Да, движок очень хороший . Я сделала для него шаблон flat-cms.ru/artic…
Popular Posts

Recent Responses
