193 lines
10 KiB
HTML
193 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Blue Sky, by Kazhnuz</title>
|
|
|
|
<!-- meta -->
|
|
<meta name="description" content="">
|
|
<meta name="author" content="">
|
|
|
|
<!-- mon icon -->
|
|
<link rel="shortcut icon" href="img/favicon.png">
|
|
|
|
<!-- framework utilisés -->
|
|
<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,800&display=swap" rel="stylesheet">
|
|
<link href="https://fonts.googleapis.com/css?family=Amatic+SC&display=swap" rel="stylesheet">
|
|
<link href="dep/spectre/css/spectre.min.css" rel="stylesheet">
|
|
<link href="dep/fork-awesome/css/fork-awesome.css" rel="stylesheet">
|
|
|
|
<link href="style.css" rel="stylesheet">
|
|
|
|
</head>
|
|
|
|
<body>
|
|
<div id="wrapper">
|
|
|
|
<header id="page-header">
|
|
<div class="columns">
|
|
<div class="column col-6">
|
|
<h1><img src="img/logo.png" alt="Kazhnuz"/></h1>
|
|
</div>
|
|
|
|
<div class="column col-md-6">
|
|
<nav class="navbar">
|
|
<section class="navbar-section">
|
|
|
|
</section>
|
|
<section class="navbar-section">
|
|
<a href="blog.html" class="btn btn-link">Blog</a>
|
|
<a href="..." class="btn btn-link">Gallerie</a>
|
|
<a href="apropos.html" class="btn btn-link">A propos</a>
|
|
</section>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
|
|
<div class="container-blog" id="page-content">
|
|
|
|
<main class="mainpane">
|
|
<nav aria-label="breadcrumb">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="index.html">kazhnuz.space</a></li><li class="breadcrumb-item"><a href="#">Contenus</a></li><li class="breadcrumb-item" aria-current="page"><span class="active">Article exemple</span></li>
|
|
</ol>
|
|
</nav>
|
|
|
|
|
|
<section>
|
|
<h1>Édito</h1>
|
|
<div class="card card-primary">
|
|
<div class="card-header"><h1>Test article de blog</h1></div>
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
<p class="align-center"> <a href="blog-article.html" class="btn btn-readmore">Lire l'article</a> </p>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
<section>
|
|
<h1>Derniers articles</h1>
|
|
<div class="card card-primary">
|
|
<div class="card-header"><h1>Test article de blog</h1></div>
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
<p class="align-center"> <a href="blog-article.html" class="btn btn-readmore">Lire l'article</a> </p>
|
|
</div>
|
|
|
|
|
|
<div class="card card-primary">
|
|
<div class="card-header"><h1>Test article de blog</h1></div>
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
<p class="align-center"> <a href="blog-article.html" class="btn btn-readmore">Lire l'article</a> </p>
|
|
</div>
|
|
|
|
|
|
<div class="card card-primary">
|
|
<div class="card-header"><h1>Test article de blog</h1></div>
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
<p class="align-center"> <a href="blog-article.html" class="btn btn-readmore">Lire l'article</a> </p>
|
|
</div>
|
|
|
|
|
|
<div class="card card-primary">
|
|
<div class="card-header"><h1>Test article de blog</h1></div>
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
|
|
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repudiandae rerum, sapiente possimus ullam laboriosam dolorum dicta quas laborum maiores, accusantium eveniet sunt, dolor necessitatibus quo! Ducimus a consequuntur vero sapiente.</p>
|
|
<p class="align-center"> <a href="blog-article.html" class="btn btn-readmore">Lire l'article</a> </p>
|
|
</div>
|
|
|
|
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<section class="sidebar">
|
|
<div class="card card-primary">
|
|
<div class="card-header"><i class="fa fa-rss"></i> Publications</div>
|
|
<div class="card-menu">
|
|
<a href="#" class="menu-element"><span class="trim-that">#WRITOBER2019 - Ring</span></a>
|
|
<a href="#" class="menu-element"><span class="trim-that">Petite histoire uchronique du système solaire (4)</span></a>
|
|
<a href="#" class="menu-element"><span class="trim-that">#WRITOBER2019 - Ring</span></a>
|
|
<a href="#" class="menu-element"><span class="trim-that">#WRITOBER2019 - Ring</span></a>
|
|
<a href="#" class="menu-element"><span class="trim-that">#WRITOBER2019 - Ring</span></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card card-primary">
|
|
<div class="card-header"><i class="fa fa-folder"></i> Catégories</div>
|
|
<div class="card-menu">
|
|
<a href="#" class="menu-element">Nouvelles et formats courts <span class="menu-label label-secondary">40</span></a>
|
|
<a href="#" class="menu-element">Contes et légendes <span class="menu-label label-secondary">11</span></a>
|
|
<a href="#" class="menu-element">Poèmes <span class="menu-label label-secondary">11</span></a>
|
|
<a href="#" class="menu-element">Romans <span class="menu-label label-secondary">0</span></a>
|
|
<a href="#" class="menu-element">Logo et Design <span class="menu-label label-secondary">0</span></a>
|
|
<a href="#" class="menu-element">Mapping et Pixel Art <span class="menu-label label-secondary">0</span></a>
|
|
<div class="menu-divider">FICHES</div>
|
|
<a href="#" class="menu-element">Univers <span class="menu-label label-secondary">4</span></a>
|
|
<a href="#" class="menu-element">Personnages <span class="menu-label label-secondary">uwu</span></a>
|
|
<div class="menu-divider">BLOG</div>
|
|
<a href="blog-category.html" class="menu-element">Niouzes site et perso <span class="menu-label label-secondary">2</span></a>
|
|
<a href="blog-category.html" class="menu-element">Réflexions et pensées <span class="menu-label label-secondary">0</span></a>
|
|
<a href="blog-category.html" class="menu-element">Militantisme <span class="menu-label label-secondary">4</span></a>
|
|
<a href="blog-category.html" class="menu-element">Conseils et partages <span class="menu-label label-secondary">-1</span></a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card card-primary">
|
|
<div class="card-header"><i class="fa fa-calendar-o"></i> Archives</div>
|
|
<div class="card-menu">
|
|
<a href="#" class="menu-element">Octobre 2019 <span class="menu-label label-secondary">1</span></a>
|
|
<a href="#" class="menu-element">2018 <span class="menu-label label-secondary">3</span></a>
|
|
<a href="#" class="menu-element">2017 <span class="menu-label label-secondary">50</span></a>
|
|
<a href="#" class="menu-element">2016 <span class="menu-label label-secondary">8</span></a>
|
|
<a href="#" class="menu-element">2015 <span class="menu-label label-secondary">2</span></a>
|
|
<a href="#" class="menu-element">2010 - 2014 <span class="menu-label label-secondary">27</span></a>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
<footer>
|
|
<ul class="social">
|
|
<li class="social-li"><a class="social-link" href="https://twitter.com/kazhnuz" alt="Twitter"><i class="fa fa-fw fa-twitter"></i></a></li>
|
|
<li class="social-li"><a class="social-link" href="https://octodon.social/users/kazhnuz" alt="Mastodon"><i class="fa fa-fw fa-mastodon"></i></a></li>
|
|
<li class="social-li"><a class="social-link" href="#" alt="Diaspora"><i class="fa fa-fw fa-diaspora"></i></a></li>
|
|
<li class="social-li"><a class="social-link" href="#" alt="DeviantART"><i class="fa fa-fw fa-deviantart"></i></a></li>
|
|
<li class="social-li"><a class="social-link" href="#" alt="Github"><i class="fa fa-fw fa-github"></i></a></li>
|
|
<li class="social-li"><a class="social-link" href="#" alt="Gitlab"><i class="fa fa-fw fa-gitlab"></i></a></li>
|
|
</ul>
|
|
|
|
<div class="columns">
|
|
<div class="column">
|
|
<p>Ce theme est diffusé sous licence <strong>Creative Common Attribution - Partage à l'Identique 4.0</strong> - hors mention contraire.</p>
|
|
<p>Cette licence vous autorise à partager et copier mes travaux, tant que vous me citiez en source, et que vous autorisez la même chose pour les travaux qui en seraient dérivés. N'hésitez pas à partager ! <i style="color:#FF0000" class="fa fa-heart"></i></p>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<p>Theme réalisé avec le quadriciel <a href="https://getbootstrap.com/">Bootstrap4</a> et la banque d'icone <a href="https://forkawesome.github.io/Fork-Awesome/">Fork-Awesome</a>.</p>
|
|
</div>
|
|
|
|
<div class="column">
|
|
<p>Lorem Ipsum.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="js/trim.js"></script>
|
|
</body>
|
|
</html>
|