Compare commits
15 commits
02a95de38b
...
7690aa2bd3
| Author | SHA1 | Date | |
|---|---|---|---|
|
7690aa2bd3 | ||
|
|
ab93b641de | ||
|
|
5c84704967 | ||
|
|
ea976d6d04 | ||
|
|
e06c12268c | ||
|
|
013440fe2e | ||
|
|
06ef777f34 | ||
|
|
e8fa8693d1 | ||
|
|
4ba652bf17 | ||
|
|
ad5799743d | ||
|
|
b913f993da | ||
|
|
45275244a6 | ||
|
|
c6d8aa0b7a | ||
|
|
b62f928b2b | ||
|
|
7e8db4267c |
95 changed files with 29987 additions and 0 deletions
8
archive.php
Normal file
8
archive.php
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<h1 class="page-title"><?php echo get_the_archive_title(); ?></h1>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||||
|
</main>
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
||||||
23
category.php
Normal file
23
category.php
Normal file
|
|
@ -0,0 +1,23 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<?php
|
||||||
|
$category = get_category( get_query_var( 'cat' ) );
|
||||||
|
$cat_id = $category->cat_ID; ?>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<!-- Sidebar custom pour contenir la description -->
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="card card-info">
|
||||||
|
<div class="card-header"><i class="fa fa-folder-open"></i> <?php echo single_cat_title(); ?></div>
|
||||||
|
<div class="card-body">
|
||||||
|
<?php the_archive_description() ?>
|
||||||
|
<p><? echo '<a href="' . get_category_link( $cat_id ) . 'feed/" title="RSS de la categorie" />Flux RSS</a> de la categorie'; ?></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar-content.php'); ?>
|
||||||
|
</aside>
|
||||||
|
<?php get_footer(); ?>
|
||||||
114
comments.php
Normal file
114
comments.php
Normal file
|
|
@ -0,0 +1,114 @@
|
||||||
|
<?php // Do not delete these lines
|
||||||
|
if ('comments.php' == basename($_SERVER['SCRIPT_FILENAME'])) die ('Ne pas télécharger cette page directement, merci !');
|
||||||
|
if (!empty($post->post_password)) { // if there's a password
|
||||||
|
if ($_COOKIE['wp-postpass_' . COOKIEHASH] != $post->post_password) { // and it doesn't match the cookie
|
||||||
|
?>
|
||||||
|
|
||||||
|
<h2><?php _e('Protégé par mot de passe'); ?></h2>
|
||||||
|
<p><?php _e('Entrer le mot de passe pour voir les commentaires'); ?></p>
|
||||||
|
|
||||||
|
<?php return;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* This variable is for alternating comment background */
|
||||||
|
|
||||||
|
$oddcomment = 'alt';
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
<!-- You can start editing here. -->
|
||||||
|
|
||||||
|
<section class="comment-list">
|
||||||
|
|
||||||
|
<?php if ($comments) : ?>
|
||||||
|
<h1 class="page-title" id="comments"><?php comments_number('Pas de commentaire', 'Un commentaire', '% commentaires' );?></h1>
|
||||||
|
<?php foreach ($comments as $comment) : ?>
|
||||||
|
<article class="card comment">
|
||||||
|
<div class="author-area">
|
||||||
|
<? echo get_avatar( get_the_author_meta('user_email'), $size = '120'); ?>
|
||||||
|
<div class="author-metadata">
|
||||||
|
<div class="author-pseudo">Écrit par <a href="" >Pseudo</a></div>
|
||||||
|
<small class="author-date">Le vendredi 19 septembre 2014 à 07:16</small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<?php comment_text() ?>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<?php /* Changes every other comment to a different class */
|
||||||
|
if ('alt' == $oddcomment) $oddcomment = '';
|
||||||
|
else $oddcomment = 'alt';
|
||||||
|
?>
|
||||||
|
|
||||||
|
<?php endforeach; /* end for each comment */ ?>
|
||||||
|
|
||||||
|
<?php else : // this is displayed if there are no comments so far ?>
|
||||||
|
|
||||||
|
<?php if ('open' == $post->comment_status) : ?>
|
||||||
|
<!-- If comments are open, but there are no comments. -->
|
||||||
|
<?php else : // comments are closed ?>
|
||||||
|
|
||||||
|
<!-- If comments are closed. -->
|
||||||
|
<p class="nocomments toast toast-danger">Les commentaires sont ferms !</p>
|
||||||
|
|
||||||
|
<?php endif; ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php if ('open' == $post->comment_status) : ?>
|
||||||
|
<div class="card card-primary">
|
||||||
|
<h2 id="respond" class="card-header">Laissez un commentaire</h2>
|
||||||
|
|
||||||
|
<!-- Cas du besoin de s'enregistrer -->
|
||||||
|
<?php if ( get_option('comment_registration') && !$user_ID ) : ?>
|
||||||
|
<p>You must be <a href="<?php echo get_option('siteurl'); ?>/wp-login.php?redirect_to=<?php the_permalink(); ?>">connecté</a> pour laisser un commentaire.</p>
|
||||||
|
|
||||||
|
<!-- Utilisateur enregistré -->
|
||||||
|
<?php else : ?>
|
||||||
|
<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
|
||||||
|
<?php if ( $user_ID ) : ?>
|
||||||
|
|
||||||
|
<div class="toast toast-info alert-flex" role="alert">
|
||||||
|
<p class="mb-0"><i class="fa fa-info fa-fw" ></i> Connecté en tant que <a class="alert-link" href="<?php echo get_option('siteurl'); ?>/wp-admin/profile.php"><?php echo $user_identity; ?></a>.</p>
|
||||||
|
<p class="mb-0 align-right"><a class="alert-link" href="<?php echo get_option('siteurl'); ?>/wp-login.php?action=logout" title="Déconnecté de ce compte"><i class="fa fa-fw fa-power-off"></i></a></p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Commentaire non-enregistré -->
|
||||||
|
<?php else : ?>
|
||||||
|
<div class="toast toast-info"><p>Ce site utilise Akismet pour réduire les contenus indésirables (spam, etc). <a href="https://akismet.com/privacy/">En savoir plus sur la façon dont les données de vos commentaires sont traitées.</a></p></div>
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<input type="text" class="form-control" name="author" id="author" placeholder="Nom <?php if ($req) echo "(requis)"; ?>" aria-label="Username" value="<?php echo $comment_author; ?>" size="40" tabindex="1" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<input type="text" class="form-control" name="email" id="email" placeholder="Courriel (ne sera pas publié) <?php if ($req) echo "(requis)"; ?>" value="<?php echo $comment_author_email; ?>" size="40" tabindex="2" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<input type="text" class="form-control" name="url" id="url" placeholder="Site Web" value="<?php echo $comment_author_url; ?>" size="40" tabindex="2" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<div class="input-group mb-3">
|
||||||
|
<textarea class="form-control" name="comment" id="comment" aria-label="Contenu du commentaire" placeholder="Contenu du commentaire" tabindex="4"></textarea>
|
||||||
|
</div>
|
||||||
|
<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
|
||||||
|
<?php do_action('comment_form', $post->ID); ?>
|
||||||
|
|
||||||
|
<p class="align-right"><button name="submit" class="btn btn-primary" type="submit" id="submit" tabindex="5" value="Envoyer" >Envoyer</button>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<?php endif; // If registration required and not logged in ?>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<?php endif; // if you delete this the sky will fall on your head ?>
|
||||||
40
components/featured.php
Normal file
40
components/featured.php
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
<div id="featured-articles" class="preview-container">
|
||||||
|
<?php
|
||||||
|
query_posts(array(
|
||||||
|
'post_type' => 'post',
|
||||||
|
'tax_query' => array(
|
||||||
|
array(
|
||||||
|
'taxonomy' => 'niveau',
|
||||||
|
'terms' => 'featured',
|
||||||
|
'field' => 'slug',
|
||||||
|
)
|
||||||
|
),
|
||||||
|
'orderby' => 'date',
|
||||||
|
'post_count' => '2',
|
||||||
|
'order' => 'DESC'
|
||||||
|
));
|
||||||
|
|
||||||
|
if ( have_posts() ) while ( have_posts() ) : the_post(); ?>
|
||||||
|
|
||||||
|
<article class="preview">
|
||||||
|
<a href="<?php the_permalink(); ?>" class="preview-link">
|
||||||
|
<div class="preview-item" style="background-image:url('<?php echo get_the_post_thumbnail_url(); ?>');">
|
||||||
|
<div class="preview-overlay">
|
||||||
|
<div class="preview-categories">
|
||||||
|
<?php $category = get_the_category();
|
||||||
|
echo"<span class='badge badge-category'>" . $category[0]->cat_name . "</span>"; ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<h2 class="preview-title"><?php the_title();/*3*/ ?></h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
|
||||||
|
<?php endwhile; ?> <?php wp_reset_query(); /*4*/ ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
29
components/footer-content.php
Normal file
29
components/footer-content.php
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
<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="https://framasphere.org/u/kazhnuz" alt="Diaspora"><i class="fa fa-fw fa-diaspora"></i></a></li>
|
||||||
|
<li class="social-li"><a class="social-link" href="https://deviantart.com/kazhnuz" alt="DeviantART"><i class="fa fa-fw fa-deviantart"></i></a></li>
|
||||||
|
<li class="social-li"><a class="social-link" href="https://github.com/kazhnuz" alt="Github"><i class="fa fa-fw fa-github"></i></a></li>
|
||||||
|
<li class="social-li"><a class="social-link" href="https://git.kobold.cafe/kazhnuz" alt="Gitlab"><i class="fa fa-fw fa-git"></i></a></li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<div class="footer-collumns">
|
||||||
|
<div>
|
||||||
|
<p>Ce site fait partie de <a href="https://kobold.city">kobold.city</a></p>
|
||||||
|
<p>Kobold City et les différents sites/services qui le composent sont fourni "tel-quel", sans garantie. Ce sont des sites fait pour le fun, et fourni en tant que tel sur un petit serveur random maintenue par une seule personne.</p>
|
||||||
|
<p>Cependant, toute critique, remarque, etc. est la bienvenue. Pour cela, vous pouvez me contacter à kazhnuz [at] kobold [point] cafe ou sur les réseaux sociaux visible plus haut</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<p>Ce site est propulsé par <a href="https://picturepan2.github.io/spectre/">Spectre</a> et <a href="https://forkawesome.github.io/Fork-Awesome/">Fork-Awesome</a> et <a href="https://wordpress.org">Wordpress</a></p>
|
||||||
|
<p>Le style utilisé est <a href="https://git.kobold.cafe/kazhnuz/kspace.css">kazhnuz.css</a>, sous licence CC BY-SA et GPL v3.</p>
|
||||||
|
<p>Le code source du theme wordpress est accessible à <a href="https://git.kobold.cafe/kazhnuz/kspace-wordpress-theme">l'adresse suivante</a>.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<p>Les contenus sont diffusé sous licence Creative Common Attribution - Partage à l'Identique 4.0 - hors mention contraire.</p>
|
||||||
|
<p>Ces licences 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 class="color-red fa fa-heart"></i></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
6
components/header-content.php
Normal file
6
components/header-content.php
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
<header id="page-header">
|
||||||
|
<div class="header-collumns">
|
||||||
|
<?php include(TEMPLATEPATH . '/components/logo.php'); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/navbar-pages.php'); ?>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
3
components/logo.php
Normal file
3
components/logo.php
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
<div class="logo-area">
|
||||||
|
<h1><a href="<?php echo site_url(); ?>"><img src="<?php echo get_template_directory_uri();?>/img/logo.png" alt="Kazhnuz"/></a></h1>
|
||||||
|
</div>
|
||||||
19
components/navbar-category.php
Normal file
19
components/navbar-category.php
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-grey" id="navbar-category">
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
|
<ul class="navbar-nav nav-justified w-100">
|
||||||
|
<?php
|
||||||
|
$categories = get_categories( array(
|
||||||
|
'orderby' => 'name',
|
||||||
|
'order' => 'ASC'
|
||||||
|
) );
|
||||||
|
|
||||||
|
foreach( $categories as $category ) {
|
||||||
|
echo '<li class="nav-item"><a class="nav-link" href="' . get_category_link($category->term_id) . '">' . $category->name . '</a></li>';
|
||||||
|
}?>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
6
components/navbar-pages.php
Normal file
6
components/navbar-pages.php
Normal file
|
|
@ -0,0 +1,6 @@
|
||||||
|
<div class="navbar-area">
|
||||||
|
<!-- <a href="/blog.html" class="btn btn-navbar">Blog</a> -->
|
||||||
|
<!-- <a href="/crea.html" class="btn btn-navbar">Romans</a> -->
|
||||||
|
<!-- <a href="/apropos.html" class="btn btn-navbar">A propos</a> -->
|
||||||
|
<a href="<?php bloginfo('rss2_url'); ?>" class="btn btn-navbar"><i class="fa fa-rss"></i></a>
|
||||||
|
</div>
|
||||||
15
components/opengraph.php
Normal file
15
components/opengraph.php
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
<?php if ( is_single() ) { ?>
|
||||||
|
<?php if(!has_post_thumbnail( $post->ID )) {
|
||||||
|
$image = get_template_directory_uri() . "/img/default-preview.png";
|
||||||
|
} else {
|
||||||
|
$image = get_the_post_thumbnail_url();
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
|
||||||
|
<meta property='og:url' content='<?php echo get_permalink(); ?>'/>
|
||||||
|
<meta property='og:type' content='article'/>
|
||||||
|
<meta property='og:title' content='<?php wp_title(''); ?>'/>
|
||||||
|
<meta property='og:site_name' content='<?php bloginfo('name'); ?>'/>
|
||||||
|
<meta property='og:image' content='<?php echo $image ?>'/>
|
||||||
|
<meta property='og:description' content='<?php the_excerpt(); ?>'/>
|
||||||
|
<?php } ?>
|
||||||
18
components/posts-list.php
Normal file
18
components/posts-list.php
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
|
||||||
|
<div class="card card-primary" id="post-<?php the_ID(); ?>">
|
||||||
|
<div class="card-header"><h1><?php the_title(); ?></h1></div>
|
||||||
|
<div class="article-meta">
|
||||||
|
<div class="article-category">
|
||||||
|
<?php $category = get_the_category();
|
||||||
|
echo"<a href= '" . esc_url( get_category_link( $category[0]->term_id ) ) . "' class='btn-small btn-info'><i class='fa fa-folder'></i> " . $category[0]->cat_name . "</a>"; ?>
|
||||||
|
</div>
|
||||||
|
<time itemprop="datePublished"><em><?php the_time('j F Y') ?></em></time>
|
||||||
|
</div>
|
||||||
|
<?php the_excerpt(); ?>
|
||||||
|
<p class="align-center"> <a href="<?php the_permalink(); ?>" class="btn btn-readmore" title="<?php the_title();?>">Lire l'article</a> </p>
|
||||||
|
</div>
|
||||||
|
<?php endwhile; ?>
|
||||||
|
<div class="navigation">
|
||||||
|
<?php the_posts_pagination(); ?>
|
||||||
|
</div>
|
||||||
|
<?php endif; ?>
|
||||||
5
components/searchform.php
Normal file
5
components/searchform.php
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
<form method="get" id="searchform" action="<?php bloginfo('home'); ?>/">
|
||||||
|
<div>
|
||||||
|
<input class="form-control" type="search" placeholder="Chercher" aria-label="Chercher" value="<?php the_search_query(); ?>" name="s" id="s" />
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
5
components/sidebar-content.php
Normal file
5
components/sidebar-content.php
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar/last-articles.php'); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar/categories.php'); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar/tags.php'); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar/archives.php'); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar/links.php'); ?>
|
||||||
12
components/sidebar/archives.php
Normal file
12
components/sidebar/archives.php
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
<div class="card card-primary">
|
||||||
|
<div class="card-header"><i class="fa fa-folder"></i> Archives</div>
|
||||||
|
<div class="card-menu">
|
||||||
|
<?php
|
||||||
|
wp_get_archives( array(
|
||||||
|
'type' => 'yearly',
|
||||||
|
'echo' => 1,
|
||||||
|
'order'=> 'ASC'
|
||||||
|
) );
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
14
components/sidebar/categories.php
Normal file
14
components/sidebar/categories.php
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<div class="card card-primary">
|
||||||
|
<div class="card-header"><i class="fa fa-folder"></i> Catégories</div>
|
||||||
|
<div class="card-menu">
|
||||||
|
<?php
|
||||||
|
$categories = get_categories( array(
|
||||||
|
'orderby' => 'name',
|
||||||
|
'order' => 'ASC'
|
||||||
|
) );
|
||||||
|
|
||||||
|
foreach( $categories as $category ) {
|
||||||
|
echo '<a class="menu-element" href="' . get_category_link($category->term_id) . '">' . $category->name . '<span class="menu-label label-secondary">'. $category->count . '</span></a>';
|
||||||
|
}?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
13
components/sidebar/last-articles.php
Normal file
13
components/sidebar/last-articles.php
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<div class="card card-primary">
|
||||||
|
<div class="card-header"><i class="fa fa-rss"></i> Publications</div>
|
||||||
|
<div class="card-menu">
|
||||||
|
<?php
|
||||||
|
wp_get_archives( array(
|
||||||
|
'type' => 'postbypost',
|
||||||
|
'echo' => 1,
|
||||||
|
'order' => 'ASC',
|
||||||
|
'limit' => 6
|
||||||
|
) );
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
10
components/sidebar/links.php
Normal file
10
components/sidebar/links.php
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<div class="card card-primary">
|
||||||
|
<div class="card-header"><i class="fa fa-link"></i> Liens</div>
|
||||||
|
<div class="card-menu">
|
||||||
|
<a href="https://kobold.city" class="menu-element">Kobold City</a>
|
||||||
|
<a href="https://rulebook.kobold.city" class="menu-element">Mes JDR</a>
|
||||||
|
<a href="https://univers.kobold.city" class="menu-element">Mes Univers</a>
|
||||||
|
<a href="https://git.kobold.city" class="menu-element">Mon Gitea</a>
|
||||||
|
<a href="https://vault.kobold.city" class="menu-element">Vault</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
24
components/sidebar/tags.php
Normal file
24
components/sidebar/tags.php
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
$args = array(
|
||||||
|
'smallest' => 8, 'largest' => 22, 'unit' => 'pt', 'number' => 999,
|
||||||
|
'format' => 'array', 'orderby' => 'name', 'order' => 'ASC',
|
||||||
|
'exclude' => '', 'include' => '');
|
||||||
|
|
||||||
|
$tags = get_tags($args);
|
||||||
|
|
||||||
|
?>
|
||||||
|
|
||||||
|
<div class="card card-primary">
|
||||||
|
<div class="card-header"><i class="fa fa-tags"></i> Tags</div>
|
||||||
|
<div class="card-body">
|
||||||
|
<form action="<?php bloginfo('url'); ?>" method="get">
|
||||||
|
<select class="card-select select" id="select-of-tags" name="tag" onchange="if(this.selectedIndex){location.href=(this.options[selectedIndex].value)}">
|
||||||
|
<option value="">Selection d'un tag...</option>
|
||||||
|
<?php foreach ($tags as $tag) {?>
|
||||||
|
<option value="<?php bloginfo('url'); ?>/tag/<?php echo $tag->slug ?>"><?php echo $tag->name ?></option>
|
||||||
|
<?php } ?>
|
||||||
|
</select>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
2573
dep/fork-awesome/css/fork-awesome.css
Normal file
2573
dep/fork-awesome/css/fork-awesome.css
Normal file
File diff suppressed because it is too large
Load diff
12
dep/fork-awesome/css/fork-awesome.min.css
vendored
Normal file
12
dep/fork-awesome/css/fork-awesome.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dep/fork-awesome/css/fork-awesome.min.css.map
Normal file
1
dep/fork-awesome/css/fork-awesome.min.css.map
Normal file
File diff suppressed because one or more lines are too long
446
dep/fork-awesome/css/v5-compat.css
Normal file
446
dep/fork-awesome/css/v5-compat.css
Normal file
|
|
@ -0,0 +1,446 @@
|
||||||
|
/*!
|
||||||
|
Fork Awesome 1.1.7
|
||||||
|
License - https://forkaweso.me/Fork-Awesome/license
|
||||||
|
|
||||||
|
Copyright 2018 Dave Gandy & Fork Awesome
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||||
|
*/
|
||||||
|
.fas,
|
||||||
|
.fab,
|
||||||
|
.far {
|
||||||
|
display: inline-block;
|
||||||
|
font: normal normal normal 14px/1 ForkAwesome;
|
||||||
|
font-size: inherit;
|
||||||
|
text-rendering: auto;
|
||||||
|
-webkit-font-smoothing: antialiased;
|
||||||
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
}
|
||||||
|
.fas.fa-chart-area:before {
|
||||||
|
content: "\f1fe";
|
||||||
|
}
|
||||||
|
.fas.fa-arrows-alt:before {
|
||||||
|
content: "\f047";
|
||||||
|
}
|
||||||
|
.fas.fa-expand-arrows-alt:before {
|
||||||
|
content: "\f0b2";
|
||||||
|
}
|
||||||
|
.fas.fa-arrows-alt-h:before {
|
||||||
|
content: "\f07e";
|
||||||
|
}
|
||||||
|
.fas.fa-arrows-alt-v:before {
|
||||||
|
content: "\f07d";
|
||||||
|
}
|
||||||
|
.fas.fa-calendar-alt:before {
|
||||||
|
content: "\f073";
|
||||||
|
}
|
||||||
|
.fas.fa-circle-notch:before {
|
||||||
|
content: "\f1ce";
|
||||||
|
}
|
||||||
|
.fas.fa-cloud-download-alt:before {
|
||||||
|
content: "\f0ed";
|
||||||
|
}
|
||||||
|
.fas.fa-cloud-upload-alt:before {
|
||||||
|
content: "\f0ee";
|
||||||
|
}
|
||||||
|
.fas.fa-credit-card:before {
|
||||||
|
content: "\f283";
|
||||||
|
}
|
||||||
|
.fas.fa-dollar-sign:before {
|
||||||
|
content: "\f155";
|
||||||
|
}
|
||||||
|
.fas.fa-euro-sign:before {
|
||||||
|
content: "\f153";
|
||||||
|
}
|
||||||
|
.fas.fa-exchange-alt:before {
|
||||||
|
content: "\f0ec";
|
||||||
|
}
|
||||||
|
.fas.fa-external-link-alt:before {
|
||||||
|
content: "\f08e";
|
||||||
|
}
|
||||||
|
.fas.fa-external-link-square-alt:before {
|
||||||
|
content: "\f14c";
|
||||||
|
}
|
||||||
|
.fas.fa-eye-dropper:before {
|
||||||
|
content: "\f1fb";
|
||||||
|
}
|
||||||
|
.fas.fa-pound-sign:before {
|
||||||
|
content: "\f154";
|
||||||
|
}
|
||||||
|
.fas.fa-glass-martini:before {
|
||||||
|
content: "\f000";
|
||||||
|
}
|
||||||
|
.fas.fa-shekel-sign:before {
|
||||||
|
content: "\f20b";
|
||||||
|
}
|
||||||
|
.fas.fa-rupee-sign:before {
|
||||||
|
content: "\f156";
|
||||||
|
}
|
||||||
|
.fas.fa-won-sign:before {
|
||||||
|
content: "\f159";
|
||||||
|
}
|
||||||
|
.fas.fa-level-down-alt:before {
|
||||||
|
content: "\f149";
|
||||||
|
}
|
||||||
|
.fas.fa-level-up-alt:before {
|
||||||
|
content: "\f148";
|
||||||
|
}
|
||||||
|
.fas.fa-chart-line:before {
|
||||||
|
content: "\f201";
|
||||||
|
}
|
||||||
|
.fas.fa-long-arrow-alt-down:before {
|
||||||
|
content: "\f175";
|
||||||
|
}
|
||||||
|
.fas.fa-long-arrow-alt-left:before {
|
||||||
|
content: "\f177";
|
||||||
|
}
|
||||||
|
.fas.fa-long-arrow-alt-right:before {
|
||||||
|
content: "\f178";
|
||||||
|
}
|
||||||
|
.fas.fa-long-arrow-alt-up:before {
|
||||||
|
content: "\f176";
|
||||||
|
}
|
||||||
|
.fas.fa-map-marker-alt:before {
|
||||||
|
content: "\f041";
|
||||||
|
}
|
||||||
|
.fas.fa-mobile-alt:before {
|
||||||
|
content: "\f10b";
|
||||||
|
}
|
||||||
|
.fas.fa-pencil-alt:before {
|
||||||
|
content: "\f040";
|
||||||
|
}
|
||||||
|
.fas.fa-pen-square:before {
|
||||||
|
content: "\f14b";
|
||||||
|
}
|
||||||
|
.fas.fa-chart-pie:before {
|
||||||
|
content: "\f200";
|
||||||
|
}
|
||||||
|
.fas.fa-yen-sign:before {
|
||||||
|
content: "\f157";
|
||||||
|
}
|
||||||
|
.fas.fa-ruble-sign:before {
|
||||||
|
content: "\f158";
|
||||||
|
}
|
||||||
|
.fas.fa-shield-alt:before {
|
||||||
|
content: "\f132";
|
||||||
|
}
|
||||||
|
.fas.fa-sign-in-alt:before {
|
||||||
|
content: "\f090";
|
||||||
|
}
|
||||||
|
.fas.fa-sign-out-alt:before {
|
||||||
|
content: "\f08b";
|
||||||
|
}
|
||||||
|
.fas.fa-sliders-h:before {
|
||||||
|
content: "\f1de";
|
||||||
|
}
|
||||||
|
.fas.fa-tablet-alt:before {
|
||||||
|
content: "\f10a";
|
||||||
|
}
|
||||||
|
.fas.fa-tachometer-alt:before {
|
||||||
|
content: "\f0e4";
|
||||||
|
}
|
||||||
|
.fas.fa-thumbtack:before {
|
||||||
|
content: "\f08d";
|
||||||
|
}
|
||||||
|
.fas.fa-ticket-alt:before {
|
||||||
|
content: "\f145";
|
||||||
|
}
|
||||||
|
.fas.fa-trash-alt:before {
|
||||||
|
content: "\f1f8";
|
||||||
|
}
|
||||||
|
.fas.fa-lira-sign:before {
|
||||||
|
content: "\f195";
|
||||||
|
}
|
||||||
|
.fab.fa-linkedin-in:before {
|
||||||
|
content: "\fe01";
|
||||||
|
}
|
||||||
|
.fab.fa-linkedin:before {
|
||||||
|
content: "\f08c";
|
||||||
|
}
|
||||||
|
.far.fa-address-book:before {
|
||||||
|
content: "\f2ba";
|
||||||
|
}
|
||||||
|
.far.fa-address-card:before {
|
||||||
|
content: "\f2bc";
|
||||||
|
}
|
||||||
|
.far.fa-arrow-alt-circle-down:before {
|
||||||
|
content: "\f01a";
|
||||||
|
}
|
||||||
|
.far.fa-arrow-alt-circle-left:before {
|
||||||
|
content: "\f190";
|
||||||
|
}
|
||||||
|
.far.fa-arrow-alt-circle-right:before {
|
||||||
|
content: "\f18e";
|
||||||
|
}
|
||||||
|
.far.fa-arrow-alt-circle-up:before {
|
||||||
|
content: "\f01b";
|
||||||
|
}
|
||||||
|
.far.fa-bell:before {
|
||||||
|
content: "\f0f3";
|
||||||
|
}
|
||||||
|
.far.fa-bell-slash:before {
|
||||||
|
content: "\f1f7";
|
||||||
|
}
|
||||||
|
.far.fa-bookmark:before {
|
||||||
|
content: "\f097";
|
||||||
|
}
|
||||||
|
.far.fa-building:before {
|
||||||
|
content: "\f0f7";
|
||||||
|
}
|
||||||
|
.far.fa-calendar-check:before {
|
||||||
|
content: "\f274";
|
||||||
|
}
|
||||||
|
.far.fa-calendar-minus:before {
|
||||||
|
content: "\f272";
|
||||||
|
}
|
||||||
|
.far.fa-calendar:before {
|
||||||
|
content: "\f133";
|
||||||
|
}
|
||||||
|
.far.fa-calendar-plus:before {
|
||||||
|
content: "\f271";
|
||||||
|
}
|
||||||
|
.far.fa-calendar-times:before {
|
||||||
|
content: "\f273";
|
||||||
|
}
|
||||||
|
.far.fa-caret-square-down:before {
|
||||||
|
content: "\f150";
|
||||||
|
}
|
||||||
|
.far.fa-caret-square-left:before {
|
||||||
|
content: "\f191";
|
||||||
|
}
|
||||||
|
.far.fa-caret-square-right:before {
|
||||||
|
content: "\f152";
|
||||||
|
}
|
||||||
|
.far.fa-caret-square-up:before {
|
||||||
|
content: "\f151";
|
||||||
|
}
|
||||||
|
.far.fa-check-circle:before {
|
||||||
|
content: "\f05d";
|
||||||
|
}
|
||||||
|
.far.fa-check-square:before {
|
||||||
|
content: "\f046";
|
||||||
|
}
|
||||||
|
.far.fa-circle:before {
|
||||||
|
content: "\f10c";
|
||||||
|
}
|
||||||
|
.far.fa-clock:before {
|
||||||
|
content: "\f017";
|
||||||
|
}
|
||||||
|
.far.fa-comment:before {
|
||||||
|
content: "\f0e5";
|
||||||
|
}
|
||||||
|
.far.fa-comment-dots:before {
|
||||||
|
content: "\f27b";
|
||||||
|
}
|
||||||
|
.far.fa-comments:before {
|
||||||
|
content: "\f0e6";
|
||||||
|
}
|
||||||
|
.far.fa-dot-circle:before {
|
||||||
|
content: "\f192";
|
||||||
|
}
|
||||||
|
.far.fa-id-card:before {
|
||||||
|
content: "\f2c3";
|
||||||
|
}
|
||||||
|
.far.fa-envelope:before {
|
||||||
|
content: "\f003";
|
||||||
|
}
|
||||||
|
.far.fa-envelope-open:before {
|
||||||
|
content: "\f2b7";
|
||||||
|
}
|
||||||
|
.far.fa-file-archive:before {
|
||||||
|
content: "\f1c6";
|
||||||
|
}
|
||||||
|
.far.fa-file-audio:before {
|
||||||
|
content: "\f1c7";
|
||||||
|
}
|
||||||
|
.far.fa-file-code:before {
|
||||||
|
content: "\f1c9";
|
||||||
|
}
|
||||||
|
.far.fa-file-excel:before {
|
||||||
|
content: "\f1c3";
|
||||||
|
}
|
||||||
|
.far.fa-file-image:before {
|
||||||
|
content: "\f1c5";
|
||||||
|
}
|
||||||
|
.far.fa-file-video:before {
|
||||||
|
content: "\f1c8";
|
||||||
|
}
|
||||||
|
.far.fa-copy:before,
|
||||||
|
.far.fa-file:before {
|
||||||
|
content: "\f016";
|
||||||
|
}
|
||||||
|
.far.fa-file-pdf:before {
|
||||||
|
content: "\f1c1";
|
||||||
|
}
|
||||||
|
.far.fa-file-powerpoint:before {
|
||||||
|
content: "\f1c4";
|
||||||
|
}
|
||||||
|
.far.fa-file-alt:before {
|
||||||
|
content: "\f0f6";
|
||||||
|
}
|
||||||
|
.far.fa-file-word:before {
|
||||||
|
content: "\f1c2";
|
||||||
|
}
|
||||||
|
.far.fa-flag:before {
|
||||||
|
content: "\f11d";
|
||||||
|
}
|
||||||
|
.far.fa-save:before {
|
||||||
|
content: "\f0c7";
|
||||||
|
}
|
||||||
|
.far.fa-folder:before {
|
||||||
|
content: "\f114";
|
||||||
|
}
|
||||||
|
.far.fa-folder-open:before {
|
||||||
|
content: "\f115";
|
||||||
|
}
|
||||||
|
.far.fa-frown:before {
|
||||||
|
content: "\f119";
|
||||||
|
}
|
||||||
|
.far.fa-futbol:before {
|
||||||
|
content: "\f1e3";
|
||||||
|
}
|
||||||
|
.far.fa-hand-rock:before {
|
||||||
|
content: "\f255";
|
||||||
|
}
|
||||||
|
.far.fa-hand-lizard:before {
|
||||||
|
content: "\f258";
|
||||||
|
}
|
||||||
|
.far.fa-hand-point-down:before {
|
||||||
|
content: "\f0a7";
|
||||||
|
}
|
||||||
|
.far.fa-hand-point-left:before {
|
||||||
|
content: "\f0a5";
|
||||||
|
}
|
||||||
|
.far.fa-hand-point-right:before {
|
||||||
|
content: "\f0a4";
|
||||||
|
}
|
||||||
|
.far.fa-hand-point-up:before {
|
||||||
|
content: "\f0a6";
|
||||||
|
}
|
||||||
|
.far.fa-hand-paper:before {
|
||||||
|
content: "\256";
|
||||||
|
}
|
||||||
|
.far.fa-hand-pointer:before {
|
||||||
|
content: "\f25a";
|
||||||
|
}
|
||||||
|
.far.fa-hand-scissors:before {
|
||||||
|
content: "\f257";
|
||||||
|
}
|
||||||
|
.far.fa-hand-spock:before {
|
||||||
|
content: "\f259";
|
||||||
|
}
|
||||||
|
.far.fa-handshake:before {
|
||||||
|
content: "\f2b5";
|
||||||
|
}
|
||||||
|
.far.fa-hdd:before {
|
||||||
|
content: "\f0a0";
|
||||||
|
}
|
||||||
|
.far.fa-heart:before {
|
||||||
|
content: "\f08a";
|
||||||
|
}
|
||||||
|
.far.fa-hospital:before {
|
||||||
|
content: "\f0f8";
|
||||||
|
}
|
||||||
|
.far.fa-hourglass:before {
|
||||||
|
content: "\f250";
|
||||||
|
}
|
||||||
|
.far.fa-id-card:before {
|
||||||
|
content: "\f2c3";
|
||||||
|
}
|
||||||
|
.far.fa-keyboard:before {
|
||||||
|
content: "\f11c";
|
||||||
|
}
|
||||||
|
.far.fa-lemon:before {
|
||||||
|
content: "\f094";
|
||||||
|
}
|
||||||
|
.far.fa-lightbulb:before {
|
||||||
|
content: "\f0eb";
|
||||||
|
}
|
||||||
|
.far.fa-meh:before {
|
||||||
|
content: "\f11a";
|
||||||
|
}
|
||||||
|
.far.fa-minus-square:before {
|
||||||
|
content: "\f147";
|
||||||
|
}
|
||||||
|
.far.fa-money-bill-alt:before {
|
||||||
|
content: "\f0d6";
|
||||||
|
}
|
||||||
|
.far.fa-moon:before {
|
||||||
|
content: "\f186";
|
||||||
|
}
|
||||||
|
.far.fa-newspaper:before {
|
||||||
|
content: "\f1ea";
|
||||||
|
}
|
||||||
|
.far.fa-paper-plane:before {
|
||||||
|
content: "\f1d9";
|
||||||
|
}
|
||||||
|
.far.fa-pause-circle:before {
|
||||||
|
content: "\f28c";
|
||||||
|
}
|
||||||
|
.far.fa-edit:before {
|
||||||
|
content: "\f044";
|
||||||
|
}
|
||||||
|
.far.fa-image:before {
|
||||||
|
content: "\f03e";
|
||||||
|
}
|
||||||
|
.far.fa-play-circle:before {
|
||||||
|
content: "\f01d";
|
||||||
|
}
|
||||||
|
.far.fa-plus-square:before {
|
||||||
|
content: "\f196";
|
||||||
|
}
|
||||||
|
.far.fa-question-circle:before {
|
||||||
|
content: "\f92c";
|
||||||
|
}
|
||||||
|
.far.fa-share-square:before {
|
||||||
|
content: "\f045";
|
||||||
|
}
|
||||||
|
.far.fa-smile:before {
|
||||||
|
content: "\f118";
|
||||||
|
}
|
||||||
|
.far.fa-snowflake:before {
|
||||||
|
content: "\f2dc";
|
||||||
|
}
|
||||||
|
.far.fa-futbol:before {
|
||||||
|
content: "\f1e3";
|
||||||
|
}
|
||||||
|
.far.fa-star-half:before {
|
||||||
|
content: "\f089";
|
||||||
|
}
|
||||||
|
.far.fa-star:before {
|
||||||
|
content: "\f006";
|
||||||
|
}
|
||||||
|
.far.fa-sticky-note:before {
|
||||||
|
content: "\f24a";
|
||||||
|
}
|
||||||
|
.far.fa-stop-circle:before {
|
||||||
|
content: "\f28e";
|
||||||
|
}
|
||||||
|
.far.fa-sun:before {
|
||||||
|
content: "\f185";
|
||||||
|
}
|
||||||
|
.far.fa-thumbs-down:before {
|
||||||
|
content: "\f088";
|
||||||
|
}
|
||||||
|
.far.fa-thumbs-up:before {
|
||||||
|
content: "\f087";
|
||||||
|
}
|
||||||
|
.far.fa-times-circle:before {
|
||||||
|
content: "\f05c";
|
||||||
|
}
|
||||||
|
.far.fa-window-close:before {
|
||||||
|
content: "\f2d4";
|
||||||
|
}
|
||||||
|
.far.fa-trash-alt:before {
|
||||||
|
content: "\f014";
|
||||||
|
}
|
||||||
|
.far.fa-user-circle:before {
|
||||||
|
content: "\f2be";
|
||||||
|
}
|
||||||
|
.far.fa-user:before {
|
||||||
|
content: "\f2c0";
|
||||||
|
}
|
||||||
12
dep/fork-awesome/css/v5-compat.min.css
vendored
Normal file
12
dep/fork-awesome/css/v5-compat.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
1
dep/fork-awesome/css/v5-compat.min.css.map
Normal file
1
dep/fork-awesome/css/v5-compat.min.css.map
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
{"version":3,"sources":["v5-compat.css"],"names":[],"mappings":";;;;;;;;;;;AAaA,KACA,KAFA,KAGE,QAAA,aACA,KAAA,OAAA,OAAA,OAAA,KAAA,EAAA,YACA,UAAA,QACA,eAAA,KACA,uBAAA,YACA,wBAAA,UAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEuB,iCACvB,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAEwB,kCACxB,QAAA,QAEsB,gCACtB,QAAA,QAEiB,2BACjB,QAAA,QAEiB,2BACjB,QAAA,QAEe,yBACf,QAAA,QAEkB,4BAClB,QAAA,QAEuB,iCACvB,QAAA,QAE8B,wCAC9B,QAAA,QAEiB,2BACjB,QAAA,QAEgB,0BAChB,QAAA,QAEmB,6BACnB,QAAA,QAEiB,2BACjB,QAAA,QAEgB,0BAChB,QAAA,QAEc,wBACd,QAAA,QAEoB,8BACpB,QAAA,QAEkB,4BAClB,QAAA,QAEgB,0BAChB,QAAA,QAEyB,mCACzB,QAAA,QAEyB,mCACzB,QAAA,QAE0B,oCAC1B,QAAA,QAEuB,iCACvB,QAAA,QAEoB,8BACpB,QAAA,QAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEe,yBACf,QAAA,QAEc,wBACd,QAAA,QAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEiB,2BACjB,QAAA,QAEkB,4BAClB,QAAA,QAEe,yBACf,QAAA,QAEgB,0BAChB,QAAA,QAEoB,8BACpB,QAAA,QAEe,yBACf,QAAA,QAEgB,0BAChB,QAAA,QAEe,yBACf,QAAA,QAEe,yBACf,QAAA,QAEiB,2BACjB,QAAA,QAEc,wBACd,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAE2B,qCAC3B,QAAA,QAE2B,qCAC3B,QAAA,QAE4B,sCAC5B,QAAA,QAEyB,mCACzB,QAAA,QAEU,oBACV,QAAA,QAEgB,0BAChB,QAAA,QAEc,wBACd,QAAA,QAEc,wBACd,QAAA,QAEoB,8BACpB,QAAA,QAEoB,8BACpB,QAAA,QAEc,wBACd,QAAA,QAEmB,6BACnB,QAAA,QAEoB,8BACpB,QAAA,QAEuB,iCACvB,QAAA,QAEuB,iCACvB,QAAA,QAEwB,kCACxB,QAAA,QAEqB,+BACrB,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAEY,sBACZ,QAAA,QAEW,qBACX,QAAA,QAEa,uBACb,QAAA,QAEkB,4BAClB,QAAA,QAEc,wBACd,QAAA,QAEgB,0BAChB,QAAA,QAEa,uBACb,QAAA,QAEc,wBACd,QAAA,QAEmB,6BACnB,QAAA,QAEkB,4BAClB,QAAA,QAEgB,0BAChB,QAAA,QAEe,yBACf,QAAA,QAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEgB,0BAChB,QAAA,QAEU,oBACA,oBACV,QAAA,QAEc,wBACd,QAAA,QAEqB,+BACrB,QAAA,QAEc,wBACd,QAAA,QAEe,yBACf,QAAA,QAEU,oBACV,QAAA,QAEU,oBACV,QAAA,QAEY,sBACZ,QAAA,QAEiB,2BACjB,QAAA,QAEW,qBACX,QAAA,QAEY,sBACZ,QAAA,QAEe,yBACf,QAAA,QAEiB,2BACjB,QAAA,QAEqB,+BACrB,QAAA,QAEqB,+BACrB,QAAA,QAEsB,gCACtB,QAAA,QAEmB,6BACnB,QAAA,QAEgB,0BAChB,QAAA,OAEkB,4BAClB,QAAA,QAEmB,6BACnB,QAAA,QAEgB,0BAChB,QAAA,QAEe,yBACf,QAAA,QAES,mBACT,QAAA,QAEW,qBACX,QAAA,QAEc,wBACd,QAAA,QAEe,yBACf,QAAA,QAEa,uBACb,QAAA,QAEc,wBACd,QAAA,QAEW,qBACX,QAAA,QAEe,yBACf,QAAA,QAES,mBACT,QAAA,QAEkB,4BAClB,QAAA,QAEoB,8BACpB,QAAA,QAEU,oBACV,QAAA,QAEe,yBACf,QAAA,QAEiB,2BACjB,QAAA,QAEkB,4BAClB,QAAA,QAEU,oBACV,QAAA,QAEW,qBACX,QAAA,QAEiB,2BACjB,QAAA,QAEiB,2BACjB,QAAA,QAEqB,+BACrB,QAAA,QAEkB,4BAClB,QAAA,QAEW,qBACX,QAAA,QAEe,yBACf,QAAA,QAEY,sBACZ,QAAA,QAEe,yBACf,QAAA,QAEU,oBACV,QAAA,QAEiB,2BACjB,QAAA,QAEiB,2BACjB,QAAA,QAES,mBACT,QAAA,QAEiB,2BACjB,QAAA,QAEe,yBACf,QAAA,QAEkB,4BAClB,QAAA,QAEkB,4BAClB,QAAA,QAEe,yBACf,QAAA,QAEiB,2BACjB,QAAA,QAEU,oBACV,QAAA"}
|
||||||
BIN
dep/fork-awesome/fonts/forkawesome-webfont.eot
Normal file
BIN
dep/fork-awesome/fonts/forkawesome-webfont.eot
Normal file
Binary file not shown.
2849
dep/fork-awesome/fonts/forkawesome-webfont.svg
Normal file
2849
dep/fork-awesome/fonts/forkawesome-webfont.svg
Normal file
File diff suppressed because it is too large
Load diff
|
After Width: | Height: | Size: 469 KiB |
BIN
dep/fork-awesome/fonts/forkawesome-webfont.ttf
Normal file
BIN
dep/fork-awesome/fonts/forkawesome-webfont.ttf
Normal file
Binary file not shown.
BIN
dep/fork-awesome/fonts/forkawesome-webfont.woff
Normal file
BIN
dep/fork-awesome/fonts/forkawesome-webfont.woff
Normal file
Binary file not shown.
BIN
dep/fork-awesome/fonts/forkawesome-webfont.woff2
Normal file
BIN
dep/fork-awesome/fonts/forkawesome-webfont.woff2
Normal file
Binary file not shown.
2
dep/jquery/jquery.js
vendored
Normal file
2
dep/jquery/jquery.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1227
dep/spectre/css/spectre-exp.css
Normal file
1227
dep/spectre/css/spectre-exp.css
Normal file
File diff suppressed because it is too large
Load diff
1
dep/spectre/css/spectre-exp.min.css
vendored
Normal file
1
dep/spectre/css/spectre-exp.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
597
dep/spectre/css/spectre-icons.css
Normal file
597
dep/spectre/css/spectre-icons.css
Normal file
|
|
@ -0,0 +1,597 @@
|
||||||
|
/*! Spectre.css Icons v0.5.8 | MIT License | github.com/picturepan2/spectre */
|
||||||
|
.icon {
|
||||||
|
box-sizing: border-box;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: inherit;
|
||||||
|
font-style: normal;
|
||||||
|
height: 1em;
|
||||||
|
position: relative;
|
||||||
|
text-indent: -9999px;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon::before,
|
||||||
|
.icon::after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
left: 50%;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon.icon-2x {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon.icon-3x {
|
||||||
|
font-size: 2.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon.icon-4x {
|
||||||
|
font-size: 3.2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.accordion .icon,
|
||||||
|
.btn .icon,
|
||||||
|
.toast .icon,
|
||||||
|
.menu .icon {
|
||||||
|
vertical-align: -10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-lg .icon {
|
||||||
|
vertical-align: -15%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-down::before,
|
||||||
|
.icon-arrow-left::before,
|
||||||
|
.icon-arrow-right::before,
|
||||||
|
.icon-arrow-up::before,
|
||||||
|
.icon-downward::before,
|
||||||
|
.icon-back::before,
|
||||||
|
.icon-forward::before,
|
||||||
|
.icon-upward::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-right: 0;
|
||||||
|
height: .65em;
|
||||||
|
width: .65em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-down::before {
|
||||||
|
transform: translate(-50%, -75%) rotate(225deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-left::before {
|
||||||
|
transform: translate(-25%, -50%) rotate(-45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-right::before {
|
||||||
|
transform: translate(-75%, -50%) rotate(135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-arrow-up::before {
|
||||||
|
transform: translate(-50%, -25%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-back::after,
|
||||||
|
.icon-forward::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: .1rem;
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-downward::after,
|
||||||
|
.icon-upward::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: .8em;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-back::after {
|
||||||
|
left: 55%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-back::before {
|
||||||
|
transform: translate(-50%, -50%) rotate(-45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-downward::after {
|
||||||
|
top: 45%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-downward::before {
|
||||||
|
transform: translate(-50%, -50%) rotate(-135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-forward::after {
|
||||||
|
left: 45%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-forward::before {
|
||||||
|
transform: translate(-50%, -50%) rotate(135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-upward::after {
|
||||||
|
top: 55%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-upward::before {
|
||||||
|
transform: translate(-50%, -50%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-caret::before {
|
||||||
|
border-left: .3em solid transparent;
|
||||||
|
border-right: .3em solid transparent;
|
||||||
|
border-top: .3em solid currentColor;
|
||||||
|
height: 0;
|
||||||
|
transform: translate(-50%, -25%);
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-menu::before {
|
||||||
|
background: currentColor;
|
||||||
|
box-shadow: 0 -.35em, 0 .35em;
|
||||||
|
height: .1rem;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-apps::before {
|
||||||
|
background: currentColor;
|
||||||
|
box-shadow: -.35em -.35em, -.35em 0, -.35em .35em, 0 -.35em, 0 .35em, .35em -.35em, .35em 0, .35em .35em;
|
||||||
|
height: 3px;
|
||||||
|
width: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-resize-horiz::before,
|
||||||
|
.icon-resize-horiz::after,
|
||||||
|
.icon-resize-vert::before,
|
||||||
|
.icon-resize-vert::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-right: 0;
|
||||||
|
height: .45em;
|
||||||
|
width: .45em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-resize-horiz::before,
|
||||||
|
.icon-resize-vert::before {
|
||||||
|
transform: translate(-50%, -90%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-resize-horiz::after,
|
||||||
|
.icon-resize-vert::after {
|
||||||
|
transform: translate(-50%, -10%) rotate(225deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-resize-horiz::before {
|
||||||
|
transform: translate(-90%, -50%) rotate(-45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-resize-horiz::after {
|
||||||
|
transform: translate(-10%, -50%) rotate(135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-more-horiz::before,
|
||||||
|
.icon-more-vert::before {
|
||||||
|
background: currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: -.4em 0, .4em 0;
|
||||||
|
height: 3px;
|
||||||
|
width: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-more-vert::before {
|
||||||
|
box-shadow: 0 -.4em, 0 .4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-plus::before,
|
||||||
|
.icon-minus::before,
|
||||||
|
.icon-cross::before {
|
||||||
|
background: currentColor;
|
||||||
|
height: .1rem;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-plus::after,
|
||||||
|
.icon-cross::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: 100%;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cross::before {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cross::after {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-cross::before,
|
||||||
|
.icon-cross::after {
|
||||||
|
transform: translate(-50%, -50%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-check::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-right: 0;
|
||||||
|
border-top: 0;
|
||||||
|
height: .5em;
|
||||||
|
transform: translate(-50%, -75%) rotate(-45deg);
|
||||||
|
width: .9em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-stop {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-stop::before {
|
||||||
|
background: currentColor;
|
||||||
|
height: .1rem;
|
||||||
|
transform: translate(-50%, -50%) rotate(45deg);
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shutdown {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-top-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shutdown::before {
|
||||||
|
background: currentColor;
|
||||||
|
content: "";
|
||||||
|
height: .5em;
|
||||||
|
top: .1em;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-refresh::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-right-color: transparent;
|
||||||
|
height: 1em;
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-refresh::after {
|
||||||
|
border: .2em solid currentColor;
|
||||||
|
border-left-color: transparent;
|
||||||
|
border-top-color: transparent;
|
||||||
|
height: 0;
|
||||||
|
left: 80%;
|
||||||
|
top: 20%;
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-search::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
height: .75em;
|
||||||
|
left: 5%;
|
||||||
|
top: 5%;
|
||||||
|
transform: translate(0, 0) rotate(45deg);
|
||||||
|
width: .75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-search::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: .1rem;
|
||||||
|
left: 80%;
|
||||||
|
top: 80%;
|
||||||
|
transform: translate(-50%, -50%) rotate(45deg);
|
||||||
|
width: .4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-edit::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
height: .4em;
|
||||||
|
transform: translate(-40%, -60%) rotate(-45deg);
|
||||||
|
width: .85em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-edit::after {
|
||||||
|
border: .15em solid currentColor;
|
||||||
|
border-right-color: transparent;
|
||||||
|
border-top-color: transparent;
|
||||||
|
height: 0;
|
||||||
|
left: 5%;
|
||||||
|
top: 95%;
|
||||||
|
transform: translate(0, -100%);
|
||||||
|
width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-delete::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom-left-radius: .1rem;
|
||||||
|
border-bottom-right-radius: .1rem;
|
||||||
|
border-top: 0;
|
||||||
|
height: .75em;
|
||||||
|
top: 60%;
|
||||||
|
width: .75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-delete::after {
|
||||||
|
background: currentColor;
|
||||||
|
box-shadow: -.25em .2em, .25em .2em;
|
||||||
|
height: .1rem;
|
||||||
|
top: .05rem;
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-share {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: .1rem;
|
||||||
|
border-right: 0;
|
||||||
|
border-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-share::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-left: 0;
|
||||||
|
border-top: 0;
|
||||||
|
height: .4em;
|
||||||
|
left: 100%;
|
||||||
|
top: .25em;
|
||||||
|
transform: translate(-125%, -50%) rotate(-45deg);
|
||||||
|
width: .4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-share::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: 75% 0;
|
||||||
|
border-right: 0;
|
||||||
|
height: .5em;
|
||||||
|
width: .6em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-flag::before {
|
||||||
|
background: currentColor;
|
||||||
|
height: 1em;
|
||||||
|
left: 15%;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-flag::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom-right-radius: .1rem;
|
||||||
|
border-left: 0;
|
||||||
|
border-top-right-radius: .1rem;
|
||||||
|
height: .65em;
|
||||||
|
left: 60%;
|
||||||
|
top: 35%;
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bookmark::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-top-left-radius: .1rem;
|
||||||
|
border-top-right-radius: .1rem;
|
||||||
|
height: .9em;
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-bookmark::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-left: 0;
|
||||||
|
border-radius: .1rem;
|
||||||
|
height: .5em;
|
||||||
|
transform: translate(-50%, 35%) rotate(-45deg) skew(15deg, 15deg);
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-download,
|
||||||
|
.icon-upload {
|
||||||
|
border-bottom: .1rem solid currentColor;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-download::before,
|
||||||
|
.icon-upload::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-right: 0;
|
||||||
|
height: .5em;
|
||||||
|
transform: translate(-50%, -60%) rotate(-135deg);
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-download::after,
|
||||||
|
.icon-upload::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: .6em;
|
||||||
|
top: 40%;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-upload::before {
|
||||||
|
transform: translate(-50%, -60%) rotate(45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-upload::after {
|
||||||
|
top: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-copy::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: .1rem;
|
||||||
|
border-right: 0;
|
||||||
|
height: .8em;
|
||||||
|
left: 40%;
|
||||||
|
top: 35%;
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-copy::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: .1rem;
|
||||||
|
height: .8em;
|
||||||
|
left: 60%;
|
||||||
|
top: 60%;
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-time {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-time::before {
|
||||||
|
background: currentColor;
|
||||||
|
height: .4em;
|
||||||
|
transform: translate(-50%, -75%);
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-time::after {
|
||||||
|
background: currentColor;
|
||||||
|
height: .3em;
|
||||||
|
transform: translate(-50%, -75%) rotate(90deg);
|
||||||
|
transform-origin: 50% 90%;
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-mail::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: .1rem;
|
||||||
|
height: .8em;
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-mail::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-right: 0;
|
||||||
|
border-top: 0;
|
||||||
|
height: .5em;
|
||||||
|
transform: translate(-50%, -90%) rotate(-45deg) skew(10deg, 10deg);
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-people::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
height: .45em;
|
||||||
|
top: 25%;
|
||||||
|
width: .45em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-people::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50% 50% 0 0;
|
||||||
|
height: .4em;
|
||||||
|
top: 75%;
|
||||||
|
width: .9em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-message {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-radius: .1rem;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-message::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom-right-radius: .1rem;
|
||||||
|
border-left: 0;
|
||||||
|
border-top: 0;
|
||||||
|
height: .8em;
|
||||||
|
left: 65%;
|
||||||
|
top: 40%;
|
||||||
|
width: .7em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-message::after {
|
||||||
|
background: currentColor;
|
||||||
|
border-radius: .1rem;
|
||||||
|
height: .3em;
|
||||||
|
left: 10%;
|
||||||
|
top: 100%;
|
||||||
|
transform: translate(0, -90%) rotate(45deg);
|
||||||
|
width: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-photo {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: .1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-photo::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
height: .25em;
|
||||||
|
left: 35%;
|
||||||
|
top: 35%;
|
||||||
|
width: .25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-photo::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom: 0;
|
||||||
|
border-left: 0;
|
||||||
|
height: .5em;
|
||||||
|
left: 60%;
|
||||||
|
transform: translate(-50%, 25%) rotate(-45deg);
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-link::before,
|
||||||
|
.icon-link::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 5em 0 0 5em;
|
||||||
|
border-right: 0;
|
||||||
|
height: .5em;
|
||||||
|
width: .75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-link::before {
|
||||||
|
transform: translate(-70%, -45%) rotate(-45deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-link::after {
|
||||||
|
transform: translate(-30%, -55%) rotate(135deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-location::before {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50% 50% 50% 0;
|
||||||
|
height: .8em;
|
||||||
|
transform: translate(-50%, -60%) rotate(-45deg);
|
||||||
|
width: .8em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-location::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
height: .2em;
|
||||||
|
transform: translate(-50%, -80%);
|
||||||
|
width: .2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-emoji {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-emoji::before {
|
||||||
|
border-radius: 50%;
|
||||||
|
box-shadow: -.17em -.1em, .17em -.1em;
|
||||||
|
height: .15em;
|
||||||
|
width: .15em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-emoji::after {
|
||||||
|
border: .1rem solid currentColor;
|
||||||
|
border-bottom-color: transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
border-right-color: transparent;
|
||||||
|
height: .5em;
|
||||||
|
transform: translate(-50%, -40%) rotate(-135deg);
|
||||||
|
width: .5em;
|
||||||
|
}
|
||||||
1
dep/spectre/css/spectre-icons.min.css
vendored
Normal file
1
dep/spectre/css/spectre-icons.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
3718
dep/spectre/css/spectre.css
Normal file
3718
dep/spectre/css/spectre.css
Normal file
File diff suppressed because it is too large
Load diff
1
dep/spectre/css/spectre.min.css
vendored
Normal file
1
dep/spectre/css/spectre.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
360
example.html
Normal file
360
example.html
Normal file
|
|
@ -0,0 +1,360 @@
|
||||||
|
<!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="css/bootstrap.css" rel="stylesheet">
|
||||||
|
<link href="css/fork-awesome.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<link href="style.css" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="wrapper" class="card">
|
||||||
|
|
||||||
|
<header>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="#" id="" ><img src="img/brand-icon.png" alt="Quarante-Douze"></a>
|
||||||
|
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
|
<ul class="navbar-nav mr-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">À propos</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Contact</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
|
<section class="container-fluid">
|
||||||
|
<h1><a href="https://quarante-douze.net/"><img src="img/logo.png"></a></h1>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-grey" id="navbar-category">
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
|
<ul class="navbar-nav nav-justified w-100">
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#">La vie du blog</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Contenus Culturels</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Fandoms</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Tribunes</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Libreries</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Internet et Numérique</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="container-fluid">
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-md-9">
|
||||||
|
|
||||||
|
<nav aria-label="breadcrumb">
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item"><a href="#">Accueil</a></li>
|
||||||
|
<li class="breadcrumb-item"><a href="#">Contenus</a></li>
|
||||||
|
<li class="breadcrumb-item active" aria-current="page">Article exemple</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<article>
|
||||||
|
|
||||||
|
<section class="article-content">
|
||||||
|
<h1 class="card-title">Nom de l'article :</h1>
|
||||||
|
|
||||||
|
<div><em>test</em></div>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>1 - Titre de niveau 3
|
||||||
|
<ul>
|
||||||
|
<li>1.1 - Titre de niveau 4</li>
|
||||||
|
<li>1.2 - Titre de niveau 4</li>
|
||||||
|
<li>1.3 - Titre de niveau 4</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>2 - Titre de niveau 3</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h3>Introduction : Lorem Ipsum</h3>
|
||||||
|
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p class="align-center"><a href="#" class="btn btn-warning">Télécharger ce thème</a></p>
|
||||||
|
|
||||||
|
<h3>Titre de niveau 3</h3>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h3>Titre de niveau 3</h3>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
<blockquote><p>Cras malesuada, metus at viverra molestie, mi ligula sodales tellus, vitae facilisis ante est vitae dolor. Donec feugiat non est eget elementum. Nullam in erat et arcu tincidunt maximus. Nullam nibh orci, egestas eu ex non, viverra pretium magna. Proin convallis, risus eu condimentum luctus, ante dui mattis eros, a varius risus diam sed nisl. Ut malesuada ipsum in augue accumsan ullamcorper. Phasellus efficitur augue in venenatis sollicitudin. Integer at consectetur arcu.</p></blockquote>
|
||||||
|
|
||||||
|
<pre><code>Vivamus tincidunt dolor quis consectetur dapibus.
|
||||||
|
Ut metus risus, lobortis non venenatis in, ultricies a orci.
|
||||||
|
In suscipit ante et aliquet pretium.
|
||||||
|
Integer diam dui, rutrum vitae risus ultricies, varius vulputate magna.
|
||||||
|
In id suscipit elit.</code></pre>
|
||||||
|
|
||||||
|
|
||||||
|
<p id="1">[1] : Sed et odio volutpat, convallis est et, interdum sapien.</p>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="share-buttons align-right">
|
||||||
|
<a href="#" class="btn btn-facebook"><i class="fa fa-fw fa-facebook"></i></a>
|
||||||
|
<a href="#" class="btn btn-twitter"><i class="fa fa-fw fa-twitter"></i></a>
|
||||||
|
<a href="#" class="btn btn-googleplus"><i class="fa fa-fw fa-google-plus"></i></a>
|
||||||
|
<a href="#" class="btn btn-diaspora"><i class="fa fa-fw fa-diaspora"></i></a>
|
||||||
|
<a href="#" class="btn btn-mastodon"><i class="fa fa-fw fa-mastodon"></i></a>
|
||||||
|
<a href="#" class="btn btn-light"><i class="fa fa-fw fa-envelope"></i></a>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
<section class="card card-darker">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<div class="previews-section prev-col-3">
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p class="p-img"><img src="img/wmap.png" alt="Card image cap"></p></div>
|
||||||
|
<div class="preview-overlay"><h1>Image Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="commentaires">
|
||||||
|
<h3>Commentaires :</h3>
|
||||||
|
|
||||||
|
<article class="comment">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
<div class="article-content">
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="comment">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
<div class="article-content">
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<aside class="sidebar col-md-3">
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">Catégories</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title"> Archive</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">Navigation</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#SecondNavbar" aria-controls="SecondNavbar" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="SecondNavbar">
|
||||||
|
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
|
||||||
|
<li class="nav-item inactive">
|
||||||
|
CC BY-SA 2018 <strong>Quarante-Douze</strong>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul class="navbar-nav my-2 my-lg-0">
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-rss"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-twitter"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-facebook"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-diaspora"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-mastodon"></i></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
|
||||||
|
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||||
|
<script src="js/bootstrap.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
fonts/OpenSans-Bold-webfont.woff
Normal file
BIN
fonts/OpenSans-Bold-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-BoldItalic-webfont.woff
Normal file
BIN
fonts/OpenSans-BoldItalic-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-ExtraBold-webfont.woff
Normal file
BIN
fonts/OpenSans-ExtraBold-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-ExtraBoldItalic-webfont.woff
Normal file
BIN
fonts/OpenSans-ExtraBoldItalic-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-Italic-webfont.woff
Normal file
BIN
fonts/OpenSans-Italic-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-Light-webfont.woff
Normal file
BIN
fonts/OpenSans-Light-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-LightItalic-webfont.woff
Normal file
BIN
fonts/OpenSans-LightItalic-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-Regular-webfont.woff
Normal file
BIN
fonts/OpenSans-Regular-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-Semibold-webfont.woff
Normal file
BIN
fonts/OpenSans-Semibold-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/OpenSans-SemiboldItalic-webfont.woff
Normal file
BIN
fonts/OpenSans-SemiboldItalic-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/forkawesome-webfont.eot
Normal file
BIN
fonts/forkawesome-webfont.eot
Normal file
Binary file not shown.
2760
fonts/forkawesome-webfont.svg
Normal file
2760
fonts/forkawesome-webfont.svg
Normal file
File diff suppressed because it is too large
Load diff
|
After Width: | Height: | Size: 455 KiB |
BIN
fonts/forkawesome-webfont.ttf
Normal file
BIN
fonts/forkawesome-webfont.ttf
Normal file
Binary file not shown.
BIN
fonts/forkawesome-webfont.woff
Normal file
BIN
fonts/forkawesome-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/forkawesome-webfont.woff2
Normal file
BIN
fonts/forkawesome-webfont.woff2
Normal file
Binary file not shown.
BIN
fonts/teko-bold-webfont.woff
Normal file
BIN
fonts/teko-bold-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/teko-light-webfont.woff
Normal file
BIN
fonts/teko-light-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/teko-medium-webfont.woff
Normal file
BIN
fonts/teko-medium-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/teko-regular-webfont.woff
Normal file
BIN
fonts/teko-regular-webfont.woff
Normal file
Binary file not shown.
BIN
fonts/teko-semibold-webfont.woff
Normal file
BIN
fonts/teko-semibold-webfont.woff
Normal file
Binary file not shown.
8
footer.php
Normal file
8
footer.php
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/footer-content.php'); ?>
|
||||||
|
<?php wp_footer(); ?>
|
||||||
|
<script src="<?php echo get_template_directory_uri();?>/dep/jquery/js/jquery.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
144
functions.php
Normal file
144
functions.php
Normal file
|
|
@ -0,0 +1,144 @@
|
||||||
|
<?php
|
||||||
|
/* functions.php
|
||||||
|
*
|
||||||
|
* All the function of Quarante-Douze
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
/* 1. Sidebar support */
|
||||||
|
|
||||||
|
if ( function_exists('register_sidebar') )
|
||||||
|
register_sidebar(array(
|
||||||
|
'before_widget' => '<section id="%1$s" class="widget %2$s card card-primary">',
|
||||||
|
'after_widget' => '</section>',
|
||||||
|
'before_title' => '<div class="section card-header"><h1>',
|
||||||
|
'after_title' => '</h1></div>',
|
||||||
|
));
|
||||||
|
|
||||||
|
/* 2. Niveau support (for featured posts) */
|
||||||
|
|
||||||
|
register_taxonomy(
|
||||||
|
'niveau',
|
||||||
|
'post',
|
||||||
|
array(
|
||||||
|
'label' => 'Niveau',
|
||||||
|
'labels' => array(
|
||||||
|
'name' => 'Niveaux',
|
||||||
|
'singular_name' => 'Niveaux',
|
||||||
|
'all_items' => 'Tous les niveaux',
|
||||||
|
'edit_item' => 'Éditer le niveau',
|
||||||
|
'view_item' => 'Voir le niveau',
|
||||||
|
'update_item' => 'Mettre à jour le niveau',
|
||||||
|
'add_new_item' => 'Ajouter un niveau',
|
||||||
|
'new_item_name' => 'Nouveau niveau',
|
||||||
|
'search_items' => 'Rechercher parmi les niveaux',
|
||||||
|
'popular_items' => 'Niveaux les plus utilisés'
|
||||||
|
),
|
||||||
|
'hierarchical' => false
|
||||||
|
)
|
||||||
|
);
|
||||||
|
|
||||||
|
register_taxonomy_for_object_type( 'niveau', 'post' );
|
||||||
|
|
||||||
|
/* 3. Excerpt and thumbnail support */
|
||||||
|
|
||||||
|
function wpqdouze_post_supports() {
|
||||||
|
add_post_type_support( 'post', 'excerpt');
|
||||||
|
}
|
||||||
|
|
||||||
|
add_action( 'init', 'wpqdouze_post_supports' );
|
||||||
|
|
||||||
|
add_theme_support( 'post-thumbnails' );
|
||||||
|
set_post_thumbnail_size( 825, 510, true );
|
||||||
|
|
||||||
|
/* 4. Social Network */
|
||||||
|
|
||||||
|
function mypost_social_sharing_buttons($content) {
|
||||||
|
// Fork of mypost_social_sharing_buttons
|
||||||
|
// You can find the original at the following url:
|
||||||
|
// https://mypost_.com/how-to-create-social-sharing-button-without-any-plugin-and-script-loading-wordpress-speed-optimization-goal/
|
||||||
|
|
||||||
|
global $post;
|
||||||
|
if(is_singular() || is_home()){
|
||||||
|
|
||||||
|
// Get current page URL
|
||||||
|
$mypost_URL = urlencode(get_permalink());
|
||||||
|
|
||||||
|
// Get current page title
|
||||||
|
$mypost_Title = htmlspecialchars(urlencode(html_entity_decode(get_the_title(), ENT_COMPAT, 'UTF-8')), ENT_COMPAT, 'UTF-8');
|
||||||
|
// $mypost_Title = str_replace( ' ', '%20', get_the_title());
|
||||||
|
|
||||||
|
// Get Post Thumbnail for pinterest
|
||||||
|
$mypost_Thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' );
|
||||||
|
|
||||||
|
// Construct sharing URL without using any script
|
||||||
|
$twitterURL = 'https://twitter.com/intent/tweet?text='.$mypost_Title.'&url='.$mypost_URL.'&via=mypost_';
|
||||||
|
$facebookURL = 'https://www.facebook.com/sharer/sharer.php?u='.$mypost_URL;
|
||||||
|
$bufferURL = 'https://bufferapp.com/add?url='.$mypost_URL.'&text='.$mypost_Title;
|
||||||
|
$whatsappURL = 'whatsapp://send?text='.$mypost_Title . ' ' . $mypost_URL;
|
||||||
|
$linkedInURL = 'https://www.linkedin.com/shareArticle?mini=true&url='.$mypost_URL.'&title='.$mypost_Title;
|
||||||
|
$diasporaURL = 'http://sharetodiaspora.github.io/?title=' . $mypost_Title . '&url=' . $mypost_URL;
|
||||||
|
|
||||||
|
// Based on popular demand added Pinterest too
|
||||||
|
$pinterestURL = 'https://pinterest.com/pin/create/button/?url='.$mypost_URL.'&media='.$mypost_Thumbnail[0].'&description='.$mypost_Title;
|
||||||
|
|
||||||
|
// Add sharing button at the end of page/page content
|
||||||
|
$content .= '<!-- based on crunchify social sharing. Get your copy here: http://crunchify.me/1VIxAsz -->';
|
||||||
|
$content .= '<div class="reagir share-buttons">';
|
||||||
|
$content .= '<a class="btn-small btn-twitter" href="'. $twitterURL .'" target="_blank"><i alt="twitter" class="fa fa-fw fa-twitter"></i></a> ';
|
||||||
|
$content .= '<a class="btn-small btn-facebook" href="'.$facebookURL.'" target="_blank"><i alt="facebook" class="fa fa-fw fa-facebook"></i></a> ';
|
||||||
|
$content .= '<a title="Share to Diaspora*" class="btn-small btn-diaspora" href="'.$diasporaURL.'" target="_blank"><i class="fa fa-fw fa-diaspora"></i></a>';
|
||||||
|
//$content .= '<a class="btn btn-whatsapp" href="'.$whatsappURL.'" target="_blank"><i alt="whatsapp" class="fa fa-fw fa-whatsapp"></i></a>';
|
||||||
|
// $content .= '<a class="btn btn-buffer" href="'.$bufferURL.'" target="_blank"><i alt="buffer" class="fa fa-fw fa-buffer"></i></a>';
|
||||||
|
//$content .= '<a class="btn btn-linkedin" href="'.$linkedInURL.'" target="_blank"><i alt="linkedin" class="fa fa-fw fa-linkedin"></i></a>';
|
||||||
|
//$content .= '<a class="btn btn-pinterest" href="'.$pinterestURL.'" data-pin-custom="true" target="_blank"><i alt="Pin It" class="fa fa-fw fa-pinterest"></i></a>';
|
||||||
|
$content .= '</div>';
|
||||||
|
|
||||||
|
return $content;
|
||||||
|
}else{
|
||||||
|
// if not a post/page then don't include sharing button
|
||||||
|
return $content;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
add_filter( 'the_content', 'mypost_social_sharing_buttons');
|
||||||
|
|
||||||
|
add_action( 'post_tag_add_form_fields', 'kspace_add_term_fields' );
|
||||||
|
|
||||||
|
function kspace_add_term_fields( $taxonomy ) {
|
||||||
|
echo '<div class="form-field">
|
||||||
|
<label for="misha-text">Plus d\'Info</label>
|
||||||
|
<input type="text" name="plus-dinfo" id="plus-dinfo" />
|
||||||
|
<p>Une URL permettant d\'obtenir plus d\'information sur le tag.</p>
|
||||||
|
</div>';
|
||||||
|
}
|
||||||
|
|
||||||
|
add_action( 'post_tag_edit_form_fields', 'misha_edit_term_fields', 10, 2 );
|
||||||
|
|
||||||
|
function misha_edit_term_fields( $term, $taxonomy ) {
|
||||||
|
|
||||||
|
$value = get_term_meta( $term->term_id, 'plus-dinfo', true );
|
||||||
|
|
||||||
|
echo '<tr class="form-field">
|
||||||
|
<th>
|
||||||
|
<label for="misha-text">Plus d\'Info</label>
|
||||||
|
</th>
|
||||||
|
<td>
|
||||||
|
<input name="plus-dinfo" id="plus-dinfo" type="text" value="' . esc_attr( $value ) .'" />
|
||||||
|
<p class="description">Une URL permettant d\'obtenir plus d\'information sur le tag.</p>
|
||||||
|
</td>
|
||||||
|
</tr>';
|
||||||
|
}
|
||||||
|
|
||||||
|
add_action( 'created_post_tag', 'misha_save_term_fields' );
|
||||||
|
add_action( 'edited_post_tag', 'misha_save_term_fields' );
|
||||||
|
|
||||||
|
function misha_save_term_fields( $term_id ) {
|
||||||
|
|
||||||
|
update_term_meta(
|
||||||
|
$term_id,
|
||||||
|
'plus-dinfo',
|
||||||
|
sanitize_text_field( $_POST[ 'plus-dinfo' ] )
|
||||||
|
);
|
||||||
|
|
||||||
|
}
|
||||||
1
generate.sh
Executable file
1
generate.sh
Executable file
|
|
@ -0,0 +1 @@
|
||||||
|
sassc scss/style.scss > style.css
|
||||||
33
header.php
Normal file
33
header.php
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html <?php language_attributes(); ?>>
|
||||||
|
<head>
|
||||||
|
<meta charset="<?php bloginfo( 'charset' ); ?>">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<title><?php bloginfo('name'); ?><?php wp_title(' - '); ?></title>
|
||||||
|
<meta name="description" content="<?php bloginfo('name'); echo " - "; bloginfo('description');?>" />
|
||||||
|
|
||||||
|
<?php if ( is_singular() && pings_open( get_queried_object() ) ) : ?>
|
||||||
|
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
|
||||||
|
<?php endif; ?>
|
||||||
|
|
||||||
|
<?php wp_head(); ?>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/opengraph.php'); ?>
|
||||||
|
<link rel="shortcut icon" href="img/favicon.png">
|
||||||
|
|
||||||
|
<!-- Polices d'écriture -->
|
||||||
|
<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">
|
||||||
|
|
||||||
|
<!-- framework utilisés -->
|
||||||
|
<link href="<?php echo get_template_directory_uri() . "/dep/spectre/css/spectre.min.css"; ?>" rel="stylesheet"/>
|
||||||
|
<link href="<?php echo get_template_directory_uri() . "/dep/fork-awesome/css/fork-awesome.min.css"; ?>" rel="stylesheet"/>
|
||||||
|
|
||||||
|
<!-- CSS -->
|
||||||
|
<link href="<?php bloginfo('stylesheet_url'); ?>" rel="stylesheet"/>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<!-- Début du vrai HTML -->
|
||||||
|
<body>
|
||||||
|
<div id="wrapper">
|
||||||
|
<?php include(TEMPLATEPATH . '/components/header-content.php'); ?>
|
||||||
|
<div class="container-blog">
|
||||||
BIN
img/avatar.png
Normal file
BIN
img/avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
img/background.png
Normal file
BIN
img/background.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.1 KiB |
BIN
img/brand-icon.png
Normal file
BIN
img/brand-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 251 B |
BIN
img/default-preview.png
Normal file
BIN
img/default-preview.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
BIN
img/logo.png
Normal file
BIN
img/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 147 KiB |
BIN
img/wmap.png
Normal file
BIN
img/wmap.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
360
index.html
Normal file
360
index.html
Normal file
|
|
@ -0,0 +1,360 @@
|
||||||
|
<!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="css/bootstrap.css" rel="stylesheet">
|
||||||
|
<link href="css/fork-awesome.css" rel="stylesheet">
|
||||||
|
|
||||||
|
<link href="style.css" rel="stylesheet">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div id="wrapper" class="card">
|
||||||
|
|
||||||
|
<header>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="#" id="" ><img src="img/brand-icon.png" alt="Quarante-Douze"></a>
|
||||||
|
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
|
<ul class="navbar-nav mr-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">À propos</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Contact</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
|
||||||
|
<section class="container-fluid">
|
||||||
|
<h1><a href="https://quarante-douze.net/"><img src="img/logo.png"></a></h1>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-grey" id="navbar-category">
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||||
|
<ul class="navbar-nav nav-justified w-100">
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#">La vie du blog</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Contenus Culturels</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Fandoms</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Tribunes</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Libreries</a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="#">Internet et Numérique</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="container-fluid">
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-md-9">
|
||||||
|
|
||||||
|
<nav aria-label="breadcrumb">
|
||||||
|
<ol class="breadcrumb">
|
||||||
|
<li class="breadcrumb-item"><a href="#">Accueil</a></li>
|
||||||
|
<li class="breadcrumb-item"><a href="#">Contenus</a></li>
|
||||||
|
<li class="breadcrumb-item active" aria-current="page">Article exemple</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<article>
|
||||||
|
|
||||||
|
<section class="article-content">
|
||||||
|
<h1 class="card-title">Nom de l'article :</h1>
|
||||||
|
|
||||||
|
<div><em>test</em></div>
|
||||||
|
|
||||||
|
<hr />
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>1 - Titre de niveau 3
|
||||||
|
<ul>
|
||||||
|
<li>1.1 - Titre de niveau 4</li>
|
||||||
|
<li>1.2 - Titre de niveau 4</li>
|
||||||
|
<li>1.3 - Titre de niveau 4</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>2 - Titre de niveau 3</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h3>Introduction : Lorem Ipsum</h3>
|
||||||
|
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p class="align-center"><a href="#" class="btn btn-warning">Télécharger ce thème</a></p>
|
||||||
|
|
||||||
|
<h3>Titre de niveau 3</h3>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h4>Titre de niveau 4</h4>
|
||||||
|
<h3>Titre de niveau 3</h3>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
<blockquote><p>Cras malesuada, metus at viverra molestie, mi ligula sodales tellus, vitae facilisis ante est vitae dolor. Donec feugiat non est eget elementum. Nullam in erat et arcu tincidunt maximus. Nullam nibh orci, egestas eu ex non, viverra pretium magna. Proin convallis, risus eu condimentum luctus, ante dui mattis eros, a varius risus diam sed nisl. Ut malesuada ipsum in augue accumsan ullamcorper. Phasellus efficitur augue in venenatis sollicitudin. Integer at consectetur arcu.</p></blockquote>
|
||||||
|
|
||||||
|
<pre><code>Vivamus tincidunt dolor quis consectetur dapibus.
|
||||||
|
Ut metus risus, lobortis non venenatis in, ultricies a orci.
|
||||||
|
In suscipit ante et aliquet pretium.
|
||||||
|
Integer diam dui, rutrum vitae risus ultricies, varius vulputate magna.
|
||||||
|
In id suscipit elit.</code></pre>
|
||||||
|
|
||||||
|
|
||||||
|
<p id="1">[1] : Sed et odio volutpat, convallis est et, interdum sapien.</p>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="share-buttons align-right">
|
||||||
|
<a href="#" class="btn btn-facebook"><i class="fa fa-fw fa-facebook"></i></a>
|
||||||
|
<a href="#" class="btn btn-twitter"><i class="fa fa-fw fa-twitter"></i></a>
|
||||||
|
<a href="#" class="btn btn-googleplus"><i class="fa fa-fw fa-google-plus"></i></a>
|
||||||
|
<a href="#" class="btn btn-diaspora"><i class="fa fa-fw fa-diaspora"></i></a>
|
||||||
|
<a href="#" class="btn btn-mastodon"><i class="fa fa-fw fa-mastodon"></i></a>
|
||||||
|
<a href="#" class="btn btn-light"><i class="fa fa-fw fa-envelope"></i></a>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
<section class="card card-darker">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<div class="previews-section prev-col-3">
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p class="p-img"><img src="img/wmap.png" alt="Card image cap"></p></div>
|
||||||
|
<div class="preview-overlay"><h1>Image Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="preview-container">
|
||||||
|
<article class="card card-preview">
|
||||||
|
<a href="#" class="preview-link">
|
||||||
|
<div class="preview-item">
|
||||||
|
<div class="preview-content"><p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. Sed posuere lectus eu orci tristique maximus. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p></div>
|
||||||
|
<div class="preview-overlay"><h1>Text Exemple</h1></div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<aside class="card-body">
|
||||||
|
<div class="align-right"><time><small>Le 27/02/2017</small></time></div>
|
||||||
|
<div class="align-left"><i class="fa fa-tags"></i> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-primary">categorie</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> <a href="" class="badge badge-info">mot-clef</a> </div>
|
||||||
|
<div class="align-center comment-text"><a href="#">3 commentaires</a></div>
|
||||||
|
</aside>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="commentaires">
|
||||||
|
<h3>Commentaires :</h3>
|
||||||
|
|
||||||
|
<article class="comment">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
<div class="article-content">
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="comment">
|
||||||
|
<div class="media card-meta">
|
||||||
|
<div class="media-left"><a href="#"><img class="media-object" src="img/avatar.png" alt="..."></a></div>
|
||||||
|
<div class="media-body"><author class="media-heading">Écrit par <a href="" >Pseudo</a></author><time> Le vendredi 19 septembre 2014 à 07:16 </time></div>
|
||||||
|
</div>
|
||||||
|
<div class="article-content">
|
||||||
|
<p><em>Lorem ipsum dolor sit amet<sup><a href="#1">[1]</a></sup>, consectetur adipiscing elit. Praesent varius ullamcorper diam, non sagittis lectus rutrum id. Integer eros urna, egestas et libero a, finibus egestas odio. Nunc vel hendrerit quam, eget malesuada sem. Sed hendrerit ligula pharetra leo aliquam volutpat. Integer auctor urna ac convallis laoreet. Nunc vestibulum ipsum sed tortor aliquam porta. Cras nunc est, lobortis in est at, rhoncus auctor nunc. Sed dignissim erat non sollicitudin ultricies. Integer vel consectetur urna. Etiam fermentum ligula vitae nunc viverra, a fringilla sem aliquam. Suspendisse potenti. Morbi sem mi, malesuada quis odio vitae, suscipit congue metus. Sed ut ullamcorper urna, eget molestie est. Sed pulvinar justo ac urna consectetur fringilla. Donec tristique eget leo sit amet mollis.</em></p>
|
||||||
|
|
||||||
|
<p>Proin bibendum felis sit amet nisl iaculis, <strong>vel blandit purus dictum</strong>. Maecenas ullamcorper tortor ac dolor pulvinar, id imperdiet arcu suscipit. <mark>Sed posuere lectus eu orci tristique maximus</mark>. Nulla facilisi. Aenean sed fermentum nisl. Donec sodales ligula eu est finibus, eu posuere ligula condimentum. Morbi arcu magna, varius id justo ac, aliquam luctus magna. Pellentesque a velit et ipsum euismod congue eget eu sem. <del>Nulla luctus est nec arcu volutpat blandit.</del> Quisque egestas, elit eu tempus tincidunt, mi libero porta purus, eget lobortis metus erat a dolor. Integer ac turpis lacinia, interdum nisl non, feugiat libero.</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<aside class="sidebar col-md-3">
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">Catégories</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title"> Archive</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="card card-primary">
|
||||||
|
<div class="card-header">
|
||||||
|
<h3 class="card-title">Navigation</h3>
|
||||||
|
</div>
|
||||||
|
<div class="list-group list-group-flush">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||||||
|
Objet de liste
|
||||||
|
<span class="badge badge-primary badge-pill">14</span>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action">Objet de liste</a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
</aside>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#SecondNavbar" aria-controls="SecondNavbar" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div class="collapse navbar-collapse" id="SecondNavbar">
|
||||||
|
<ul class="navbar-nav mr-auto mt-2 mt-lg-0">
|
||||||
|
<li class="nav-item inactive">
|
||||||
|
CC BY-SA 2018 <strong>Quarante-Douze</strong>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul class="navbar-nav my-2 my-lg-0">
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-rss"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-twitter"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-facebook"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-diaspora"></i></a>
|
||||||
|
</li>
|
||||||
|
<li class="nav-item active">
|
||||||
|
<a class="nav-link" href="#"><i class="fa fa-fw fa-mastodon"></i></a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
|
||||||
|
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||||
|
<script src="js/bootstrap.min.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
10
index.php
Normal file
10
index.php
Normal file
|
|
@ -0,0 +1,10 @@
|
||||||
|
<?php get_header(); ?>
|
||||||
|
<main class="col-md-8">
|
||||||
|
<h1 class="page-title"><i class="fa fa-fw fa-star"></i> À la une</h1>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/featured.php'); ?>
|
||||||
|
|
||||||
|
<h1 class="page-title"><i class="fa fa-fw fa-clock-o"></i> Articles récents</h1>
|
||||||
|
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||||
|
</main>
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
||||||
6444
js/bootstrap.bundle.js
vendored
Normal file
6444
js/bootstrap.bundle.js
vendored
Normal file
File diff suppressed because it is too large
Load diff
1
js/bootstrap.bundle.js.map
Normal file
1
js/bootstrap.bundle.js.map
Normal file
File diff suppressed because one or more lines are too long
7
js/bootstrap.bundle.min.js
vendored
Normal file
7
js/bootstrap.bundle.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
js/bootstrap.bundle.min.js.map
Normal file
1
js/bootstrap.bundle.min.js.map
Normal file
File diff suppressed because one or more lines are too long
3927
js/bootstrap.js
vendored
Normal file
3927
js/bootstrap.js
vendored
Normal file
File diff suppressed because it is too large
Load diff
1
js/bootstrap.js.map
Normal file
1
js/bootstrap.js.map
Normal file
File diff suppressed because one or more lines are too long
7
js/bootstrap.min.js
vendored
Normal file
7
js/bootstrap.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
js/bootstrap.min.js.map
Normal file
1
js/bootstrap.min.js.map
Normal file
File diff suppressed because one or more lines are too long
5
js/jquery.min.js
vendored
Normal file
5
js/jquery.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
17
page.php
Normal file
17
page.php
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
|
||||||
|
|
||||||
|
<article class="article-content" id="post-<?php the_ID(); ?>">
|
||||||
|
<h1 class="page-title"><?php the_title(); ?></h1>
|
||||||
|
|
||||||
|
<div class="article-body">
|
||||||
|
<?php the_content(); ?>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<?php endwhile; ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
</main>
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
||||||
143
scss/_angled-edges.scss
Normal file
143
scss/_angled-edges.scss
Normal file
|
|
@ -0,0 +1,143 @@
|
||||||
|
//-------------------------------------------------------------------------------------
|
||||||
|
// Angled Edges v2.0.0 (https://github.com/josephfusco/angled-edges)
|
||||||
|
// Copyright 2017 Joseph Fusco
|
||||||
|
// Licensed under MIT (https://github.com/josephfusco/angled-edges/blob/master/LICENSE)
|
||||||
|
//-------------------------------------------------------------------------------------
|
||||||
|
|
||||||
|
/// Replace `$search` with `$replace` in `$string`.
|
||||||
|
///
|
||||||
|
/// @author Hugo Giraudel
|
||||||
|
/// @link http://www.sassmeister.com/gist/1b4f2da5527830088e4d
|
||||||
|
///
|
||||||
|
/// @param {String} $string - Initial string
|
||||||
|
/// @param {String} $search - Substring to replace
|
||||||
|
/// @param {String} $replace ('') - New value
|
||||||
|
/// @return {String} Updated string
|
||||||
|
///
|
||||||
|
@function ae-str-replace($string, $search, $replace: '') {
|
||||||
|
$index: str-index($string, $search);
|
||||||
|
|
||||||
|
@if $index {
|
||||||
|
@return str-slice($string, 1, $index - 1) + $replace + ae-str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
|
||||||
|
}
|
||||||
|
|
||||||
|
@return $string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Encode SVG to use as background.
|
||||||
|
///
|
||||||
|
/// @param {String} $string
|
||||||
|
/// @return {String} Encoded svg data
|
||||||
|
///
|
||||||
|
@function ae-svg-encode($string){
|
||||||
|
$result: ae-str-replace($string, '<svg', '<svg xmlns="http://www.w3.org/2000/svg"');
|
||||||
|
$result: ae-str-replace($result, '%', '%25');
|
||||||
|
$result: ae-str-replace($result, '"', '\'');
|
||||||
|
$result: ae-str-replace($result, '<', '%3C');
|
||||||
|
$result: ae-str-replace($result, '>', '%3E');
|
||||||
|
|
||||||
|
@return 'data:image/svg+xml,' + $result;
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Outputs pseudo content for main mixin.
|
||||||
|
///
|
||||||
|
/// @author Joseph Fusco
|
||||||
|
///
|
||||||
|
/// @param {String} $location
|
||||||
|
/// @param {Number} $height
|
||||||
|
/// @output psuedo content
|
||||||
|
///
|
||||||
|
@mixin ae-pseudo($wedge, $height, $width) {
|
||||||
|
background-image: url($wedge);
|
||||||
|
background-position: center center;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
// full width wedge - needed as Firefox ignores preserveAspectRatio="none" in this case
|
||||||
|
@if ($width == null) {
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
content: '';
|
||||||
|
height: $height * 1px;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
width: 100%;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
/// Attatches an svg wedge shape to an element.
|
||||||
|
///
|
||||||
|
/// @author Joseph Fusco
|
||||||
|
///
|
||||||
|
/// @param {String} $location - 'inside top', 'outside top', 'inside bottom', 'outside bottom'
|
||||||
|
/// @param {String} $hypotenuse - 'upper left', 'upper right', 'lower left', 'lower right'
|
||||||
|
/// @param {Color} $fill
|
||||||
|
/// @param {Number} $height
|
||||||
|
/// @param {Number} $width
|
||||||
|
/// @output '::before' and/or '::after' with svg background image
|
||||||
|
///
|
||||||
|
@mixin angled-edge($location, $hypotenuse, $fill, $height: 100, $width: null) {
|
||||||
|
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
$points: (
|
||||||
|
'upper left': '0,#{$height} #{$width},#{$height} #{$width},0',
|
||||||
|
'upper right': '0,#{$height} #{$width},#{$height} 0,0',
|
||||||
|
'lower left': '0,0 #{$width},#{$height} #{$width},0',
|
||||||
|
'lower right': '0,0 #{$width},0 0,#{$height}'
|
||||||
|
);
|
||||||
|
|
||||||
|
// full width wedge
|
||||||
|
@if ($width == null) {
|
||||||
|
$points: (
|
||||||
|
'upper left': '0,#{$height} 100,#{$height} 100,0',
|
||||||
|
'upper right': '0,#{$height} 100,#{$height} 0,0',
|
||||||
|
'lower left': '0,0 100,#{$height} 100,0',
|
||||||
|
'lower right': '0,0 100,0 0,#{$height}'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// ensure $fill color is using rgb()
|
||||||
|
$fill-rgb: 'rgb(' + round(red($fill)) + ',' + round(green($fill)) + ',' + round(blue($fill)) + ')';
|
||||||
|
|
||||||
|
// capture alpha component of $fill to use with fill-opacity
|
||||||
|
$fill-alpha: alpha($fill);
|
||||||
|
|
||||||
|
$wedge: '<svg width="#{$width}" height="#{$height}" fill="#{$fill-rgb}" fill-opacity="#{$fill-alpha}"><polygon points="#{map-get($points, $hypotenuse)}"></polygon></svg>';
|
||||||
|
|
||||||
|
// full width wedge
|
||||||
|
@if ($width == null) {
|
||||||
|
$wedge: '<svg preserveAspectRatio="none" viewBox="0 0 100 #{$height}" fill="#{$fill-rgb}" fill-opacity="#{$fill-alpha}"><polygon points="#{map-get($points, $hypotenuse)}"></polygon></svg>';
|
||||||
|
}
|
||||||
|
|
||||||
|
$encoded-wedge: ae-svg-encode($wedge);
|
||||||
|
|
||||||
|
@if ($location == 'inside top') {
|
||||||
|
&::before {
|
||||||
|
@include ae-pseudo($encoded-wedge, $height, $width);
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
} @else if ($location == 'outside top') {
|
||||||
|
&::before {
|
||||||
|
@include ae-pseudo($encoded-wedge, $height, $width);
|
||||||
|
top: -$height * 1px;
|
||||||
|
}
|
||||||
|
} @else if ($location == 'inside bottom') {
|
||||||
|
&::after {
|
||||||
|
@include ae-pseudo($encoded-wedge, $height, $width);
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
} @else if ($location == 'outside bottom') {
|
||||||
|
&::after {
|
||||||
|
@include ae-pseudo($encoded-wedge, $height, $width);
|
||||||
|
bottom: -$height * 1px;
|
||||||
|
}
|
||||||
|
} @else {
|
||||||
|
@error 'Invalid argument for $location - must use: `inside top`, `outside top`, `inside bottom`, `outside bottom`';
|
||||||
|
}
|
||||||
|
|
||||||
|
@if (map-has-key($points, $hypotenuse) == false) {
|
||||||
|
@error 'Invalid argument for $hypotenuse - must use: `upper left`, `upper right`, `lower left`, `lower right`';
|
||||||
|
}
|
||||||
|
}
|
||||||
124
scss/_definitions.scss
Normal file
124
scss/_definitions.scss
Normal file
|
|
@ -0,0 +1,124 @@
|
||||||
|
/* --- 01. DEFINITIONS --- */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Les définitions globales de la stylesheet.
|
||||||
|
* Elle permette de rapidement modifier le style globale de la fiche en modifiant les éléments centraux
|
||||||
|
* D'autres définitions importantes sont visibles dans les autres parties de la fiche.
|
||||||
|
*
|
||||||
|
* Pour customiser les couleurs, voyez _palette.scss
|
||||||
|
*/
|
||||||
|
|
||||||
|
// A modifier pour customiser le style facilement :
|
||||||
|
|
||||||
|
$large-shadow: 0px 2px 10px rgba(0, 0, 0, 0);
|
||||||
|
$narrow-shadow: 0px 2px 6px rgba(0, 0, 0, 0);
|
||||||
|
$inset-shadow: inset 0px -2px 0px rgba(0, 0, 0, 0);
|
||||||
|
$inset-shadow-inverted: inset 0px 2px 0px rgba(0, 0, 0, 0);
|
||||||
|
$inset-relief: inset 0px 2px 0px rgba(255, 255, 255, 0);
|
||||||
|
|
||||||
|
$baseline: 1.5;
|
||||||
|
$fontsize: 4.75mm;
|
||||||
|
|
||||||
|
$lineheight: $baseline * 1rem;
|
||||||
|
$lineheight_half: $lineheight/2;
|
||||||
|
$lineheight_quarter: $lineheight/4;
|
||||||
|
|
||||||
|
$border-radius: 0px;
|
||||||
|
$border-size: 0px;
|
||||||
|
|
||||||
|
$fontweight_big: 300;
|
||||||
|
$fontweight_base: 400;
|
||||||
|
$fontweight_bold: 600;
|
||||||
|
$fontweight_hyper: 800;
|
||||||
|
|
||||||
|
$basefont: Open Sans, sans-serif;
|
||||||
|
$titlefont: Amatic SC, sans-serif;
|
||||||
|
|
||||||
|
|
||||||
|
// MIXINS RESPONSIVES
|
||||||
|
|
||||||
|
// Small tablets and large smartphones (landscape view)
|
||||||
|
$screen-sm-min: 576px;
|
||||||
|
|
||||||
|
// Small tablets (portrait view)
|
||||||
|
$screen-md-min: 768px;
|
||||||
|
|
||||||
|
// Tablets and small desktops
|
||||||
|
$screen-lg-min: 992px;
|
||||||
|
|
||||||
|
// Large tablets and desktops
|
||||||
|
$screen-xl-min: 1200px;
|
||||||
|
|
||||||
|
// Very large desktops
|
||||||
|
$screen-xxl-min: 1600px;
|
||||||
|
|
||||||
|
|
||||||
|
// Small devices
|
||||||
|
@mixin sm {
|
||||||
|
@media (min-width: #{$screen-sm-min}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Medium devices
|
||||||
|
@mixin md {
|
||||||
|
@media (min-width: #{$screen-md-min}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Large devices
|
||||||
|
@mixin lg {
|
||||||
|
@media (min-width: #{$screen-lg-min}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Extra large devices
|
||||||
|
@mixin xl {
|
||||||
|
@media (min-width: #{$screen-xl-min}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Extra large desktops
|
||||||
|
@mixin xxl {
|
||||||
|
@media (min-width: #{$screen-xxl-min}) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Custom devices
|
||||||
|
@mixin rwd($screen) {
|
||||||
|
@media (min-width: $screen+'px' ) {
|
||||||
|
@content;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// MIXINS AUTRES
|
||||||
|
|
||||||
|
@mixin borders() {
|
||||||
|
border: $border-size solid rgba(0, 0, 0, 0.3)
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin border-radius() {
|
||||||
|
border-radius: $border-radius $border-radius $border-radius $border-radius;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin biseau($size) {
|
||||||
|
position: relative;
|
||||||
|
z-index:1;
|
||||||
|
overflow: visible;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: " ";
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
left:-$size/2;
|
||||||
|
right:-$size/2;
|
||||||
|
bottom:0;
|
||||||
|
z-index:-1;
|
||||||
|
transform: skewX(-15deg);
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
}
|
||||||
|
}
|
||||||
71
scss/_drawing.scss
Normal file
71
scss/_drawing.scss
Normal file
|
|
@ -0,0 +1,71 @@
|
||||||
|
/* --- 04. COMPOSANTS --- */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Les différents composants réutilisables de la page.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import 'components/cards';
|
||||||
|
|
||||||
|
@import 'components/buttons';
|
||||||
|
|
||||||
|
@import 'components/previews';
|
||||||
|
|
||||||
|
.article-meta, .article-nav {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong.btn-fake {
|
||||||
|
@include button($button_large);
|
||||||
|
@include button-fullcontrol(transparent, transparent, rgba(0,0,0,1));
|
||||||
|
}
|
||||||
|
|
||||||
|
a.article-nav-link-wrap {
|
||||||
|
@include button($button_large);
|
||||||
|
padding-left: $button_large;
|
||||||
|
padding-right: $button_large;
|
||||||
|
&:hover, &:active {
|
||||||
|
@include borders();
|
||||||
|
}
|
||||||
|
|
||||||
|
p &:last-child {
|
||||||
|
margin-bottom:0;
|
||||||
|
}
|
||||||
|
@include button-color($color-info, $color-button-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
.pigimg, .mb {
|
||||||
|
padding-bottom:1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#page-nav {
|
||||||
|
padding-bottom:1.5rem;
|
||||||
|
.page-number, .next, .prev {
|
||||||
|
@include button($button_small);
|
||||||
|
padding-left: $button_small;
|
||||||
|
padding-right: $button_small;
|
||||||
|
@include button-color($color-light2, $color-button-dark);
|
||||||
|
|
||||||
|
&.current {
|
||||||
|
@include button-color($color-info, $color-button-light);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-select {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group {
|
||||||
|
padding-bottom:1.5rem;
|
||||||
|
|
||||||
|
input, textarea {
|
||||||
|
width:100%;
|
||||||
|
background-color:$color-light;
|
||||||
|
border-radius:0px;
|
||||||
|
border: 1px solid rgba(0,0,0,0.2);
|
||||||
|
padding:0.375rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
123
scss/_font-face.scss
Normal file
123
scss/_font-face.scss
Normal file
|
|
@ -0,0 +1,123 @@
|
||||||
|
/* 2.1 - Font Face */
|
||||||
|
|
||||||
|
/* 2.1.1 - OpenSans
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-Light-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-Light-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-Light-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-Light-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 300;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-LightItalic-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-LightItalic-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-LightItalic-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 300;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-Regular-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-Regular-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-Regular-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-Regular-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-Italic-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-Italic-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-Italic-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-Italic-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-Semibold-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-Semibold-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-Semibold-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-Semibold-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 600;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-SemiboldItalic-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-SemiboldItalic-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-SemiboldItalic-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 600;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-Bold-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-Bold-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-BoldItalic-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-BoldItalic-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-BoldItalic-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-ExtraBold-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-ExtraBold-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-ExtraBold-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 800;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'OpenSans';
|
||||||
|
src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot');
|
||||||
|
src: url('fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||||
|
url('fonts/OpenSans-ExtraBoldItalic-webfont.woff2') format('woff2'),
|
||||||
|
url('fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||||
|
url('fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
|
||||||
|
url('fonts/OpenSans-ExtraBoldItalic-webfont.svg#open_sansbold') format('svg');
|
||||||
|
font-weight: 800;
|
||||||
|
font-style: italic;
|
||||||
|
}*/
|
||||||
261
scss/_global.scss
Normal file
261
scss/_global.scss
Normal file
|
|
@ -0,0 +1,261 @@
|
||||||
|
/* --- 03. GLOBAL STYLING --- */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Les styles "globaux" touchant toute la page.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
@mixin li-no-margin() {
|
||||||
|
li {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin container-big() {
|
||||||
|
padding-left: $lineheight;
|
||||||
|
padding-right: $lineheight;
|
||||||
|
max-width: 1600px;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.no-pills {
|
||||||
|
list-style:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.align {
|
||||||
|
&-center {text-align: center;}
|
||||||
|
&-left {text-align: left;}
|
||||||
|
&-right {text-align: right;}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ------------------ HEADERS ------------------- */
|
||||||
|
|
||||||
|
#page-header {
|
||||||
|
background: $color-skyblue url('img/background.png') center bottom repeat-x;
|
||||||
|
border-top: 6px solid $color-dark2;
|
||||||
|
padding-bottom:3rem;
|
||||||
|
|
||||||
|
.header-collumns {
|
||||||
|
@include container-big();
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
grid-template-areas:
|
||||||
|
"nav"
|
||||||
|
"logo";
|
||||||
|
grid-template-rows: auto;
|
||||||
|
grid-gap: $lineheight;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
|
||||||
|
.navbar-area {
|
||||||
|
grid-area: nav;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo-area {
|
||||||
|
grid-area: logo;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include lg() {
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
grid-template-areas: "logo nav";
|
||||||
|
height:11*$lineheight;
|
||||||
|
padding-bottom:0;
|
||||||
|
.navbar-area {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include xxl() {
|
||||||
|
height:13*$lineheight;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
header h1 {
|
||||||
|
border-style:none !important;
|
||||||
|
color: $color-light;
|
||||||
|
font-weight: $fontweight_hyper;
|
||||||
|
font-size:5.4em;
|
||||||
|
font-style:oblique;
|
||||||
|
padding-bottom:0px;
|
||||||
|
line-height: 1.5em;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
margin-top:0.75rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar {
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
padding: 0.75rem;
|
||||||
|
color: $color-light;
|
||||||
|
a {
|
||||||
|
color: $color-light;
|
||||||
|
}
|
||||||
|
@include li-no-margin();
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
box-shadow: $narrow-shadow, $inset-shadow;
|
||||||
|
}
|
||||||
|
/* ------------------ CONTAINERS ------------------- */
|
||||||
|
|
||||||
|
.container-big {
|
||||||
|
@include container-big();
|
||||||
|
}
|
||||||
|
|
||||||
|
.container-blog {
|
||||||
|
@include container-big();
|
||||||
|
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
grid-template-rows: auto;
|
||||||
|
row-gap: $lineheight;
|
||||||
|
column-gap: 3rem;
|
||||||
|
grid-template-areas:
|
||||||
|
"main"
|
||||||
|
"side";
|
||||||
|
|
||||||
|
@include lg() {
|
||||||
|
grid-template-columns: auto 360px;
|
||||||
|
grid-template-areas: "main side";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mainpane {
|
||||||
|
grid-area: main;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
grid-area: side;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container-preview {
|
||||||
|
@include container-big();
|
||||||
|
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
grid-template-rows: auto;
|
||||||
|
row-gap: $lineheight;
|
||||||
|
column-gap: 3rem;
|
||||||
|
grid-template-areas:
|
||||||
|
"main"
|
||||||
|
"side";
|
||||||
|
|
||||||
|
@include lg() {
|
||||||
|
grid-template-columns: 360px auto;
|
||||||
|
grid-template-areas: "side main";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.container-onecolumn {
|
||||||
|
max-width:1280px;
|
||||||
|
margin: auto;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container-personnage {
|
||||||
|
@include container-big();
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(6, 1fr);
|
||||||
|
grid-template-rows: auto;
|
||||||
|
row-gap: 3rem;
|
||||||
|
column-gap: 3rem;
|
||||||
|
|
||||||
|
grid-template-areas:
|
||||||
|
"nomp nomp nomp nomp nomp nomp"
|
||||||
|
"info info info info meta meta"
|
||||||
|
"goss goss look look look look"
|
||||||
|
"aime aime aime dete dete dete"
|
||||||
|
"hist hist hist hist hist hist";
|
||||||
|
|
||||||
|
.card {
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.personnage {
|
||||||
|
&-nomp {grid-area: nomp;}
|
||||||
|
&-info {grid-area: info;}
|
||||||
|
&-meta {grid-area: meta;}
|
||||||
|
&-goss {grid-area: goss;}
|
||||||
|
&-look {grid-area: look;}
|
||||||
|
&-aime {grid-area: aime;}
|
||||||
|
&-dete {grid-area: dete;}
|
||||||
|
&-hist {grid-area: hist;}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ------------------ PAGE ------------------- */
|
||||||
|
|
||||||
|
#wrapper {
|
||||||
|
background-color: $color-light;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ------------------ FOOTER ------------------- */
|
||||||
|
|
||||||
|
$color-footer-back: $color-dark2;
|
||||||
|
$color-footer-text: $color-light;
|
||||||
|
|
||||||
|
body {
|
||||||
|
// On colorise le background de la page complete de la même
|
||||||
|
// couleur que le fond du footer.
|
||||||
|
background-color: $color-footer-back;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
@include angled-edge('outside top', 'upper left', $color-footer-back, 32);
|
||||||
|
color: $color-footer-text;
|
||||||
|
padding-top:1.5rem;
|
||||||
|
font-size: 0.8rem!important;
|
||||||
|
padding-bottom:1.5rem;
|
||||||
|
|
||||||
|
.footer-collumns {
|
||||||
|
@include container-big();
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
grid-template-rows: auto;
|
||||||
|
grid-gap: $lineheight;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
|
||||||
|
@include lg() {
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* social media */
|
||||||
|
|
||||||
|
ul.social {
|
||||||
|
font-size:1.5em;
|
||||||
|
padding-bottom:1.5em;
|
||||||
|
margin:auto;
|
||||||
|
text-align:center;
|
||||||
|
li {
|
||||||
|
margin:0;
|
||||||
|
list-style: none;
|
||||||
|
display: inline;
|
||||||
|
a {
|
||||||
|
color: $color-footer-back;
|
||||||
|
background-color: $color-footer-text;
|
||||||
|
padding:0.3em;
|
||||||
|
padding-left:0.36em;
|
||||||
|
padding-right:0.36em;
|
||||||
|
vertical-align:middle;
|
||||||
|
border-radius:100%;
|
||||||
|
&:hover {
|
||||||
|
color:$color-footer-text;
|
||||||
|
background-color: $color-footer-back;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
119
scss/_palette.scss
Normal file
119
scss/_palette.scss
Normal file
|
|
@ -0,0 +1,119 @@
|
||||||
|
/* --- 00. PALETTE --- */
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Les définitions globales des couleurs du theme.
|
||||||
|
*
|
||||||
|
* Elle permettent de définir rapidement à la fois les couleurs
|
||||||
|
* de base qui seront utilisée pour tout le theme, mais
|
||||||
|
* également celles spécifiques pour certains sujets (liens, texte)
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Couleurs de base du theme :
|
||||||
|
|
||||||
|
$color-blue: #268bd2;
|
||||||
|
$color-violet: #d33682;
|
||||||
|
$color-red: #dc322f;
|
||||||
|
$color-orange: #cb4b16;
|
||||||
|
$color-green: #859900;
|
||||||
|
$color-skyblue: #2aa198;
|
||||||
|
$color-dark: #002b36;
|
||||||
|
$color-light: #fdf6e3;
|
||||||
|
$color-yellow: #b58900;
|
||||||
|
$color-grey: #586e75;
|
||||||
|
|
||||||
|
$color-dark2: #073642;
|
||||||
|
$color-light2: #eee8d5;
|
||||||
|
|
||||||
|
$color-gray2: #657b83;
|
||||||
|
$color-gray3: #839496;
|
||||||
|
$color-gray4: #93a1a1;
|
||||||
|
|
||||||
|
$color-primary: $color-violet;
|
||||||
|
$color-secondary: $color-skyblue;
|
||||||
|
|
||||||
|
$color-link: $color-skyblue;
|
||||||
|
$color-selection: $color-skyblue;
|
||||||
|
$color-mark: $color-yellow;
|
||||||
|
|
||||||
|
$color-font: $color-dark2;
|
||||||
|
$color-warning: $color-orange;
|
||||||
|
$color-danger: $color-red;
|
||||||
|
$color-info: $color-skyblue;
|
||||||
|
$color-success: $color-green;
|
||||||
|
|
||||||
|
@mixin background-color($background-color, $text-color) {
|
||||||
|
background-color: $background-color!important;
|
||||||
|
color: $text-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin text-color($text-color) {
|
||||||
|
color: $text-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Colorize important elements
|
||||||
|
|
||||||
|
a, a:hover, a:active {
|
||||||
|
color: $color-link;
|
||||||
|
}
|
||||||
|
|
||||||
|
::selection {
|
||||||
|
@include background-color($color-selection, $color-light);
|
||||||
|
}
|
||||||
|
::-moz-selection {
|
||||||
|
@include background-color($color-selection, $color-light);
|
||||||
|
}
|
||||||
|
|
||||||
|
mark {
|
||||||
|
background-color: lighten($color-mark, 30%)
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote, pre {
|
||||||
|
border-color: $color-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Add generic colorizations classes
|
||||||
|
|
||||||
|
/* BACKGROUNDS */
|
||||||
|
|
||||||
|
.bg {
|
||||||
|
&-blue { @include background-color($color-blue, $color-light); }
|
||||||
|
&-violet { @include background-color($color-violet, $color-light); }
|
||||||
|
&-red { @include background-color($color-red, $color-light); }
|
||||||
|
&-orange { @include background-color($color-orange, $color-light); }
|
||||||
|
&-green { @include background-color($color-green, $color-light); }
|
||||||
|
&-skyblue { @include background-color($color-skyblue, $color-light); }
|
||||||
|
&-dark { @include background-color($color-dark, $color-light); }
|
||||||
|
&-light { @include background-color($color-light, $color-dark); }
|
||||||
|
&-yellow { @include background-color($color-yellow, $color-light); }
|
||||||
|
&-grey { @include background-color($color-grey, $color-light); }
|
||||||
|
|
||||||
|
&-primary { @include background-color($color-primary, $color-light); }
|
||||||
|
&-secondary { @include background-color($color-secondary, $color-light); }
|
||||||
|
&-warning { @include background-color($color-warning, $color-light); }
|
||||||
|
&-danger { @include background-color($color-danger, $color-light); }
|
||||||
|
&-info { @include background-color($color-info, $color-light); }
|
||||||
|
&-success { @include background-color($color-success, $color-light); }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* TEXT */
|
||||||
|
|
||||||
|
.text {
|
||||||
|
&-blue { @include text-color($color-blue); }
|
||||||
|
&-violet { @include text-color($color-violet); }
|
||||||
|
&-red { @include text-color($color-red); }
|
||||||
|
&-orange { @include text-color($color-orange); }
|
||||||
|
&-green { @include text-color($color-green); }
|
||||||
|
&-skyblue { @include text-color($color-skyblue); }
|
||||||
|
&-dark { @include text-color($color-dark); }
|
||||||
|
&-light { @include text-color($color-light); }
|
||||||
|
&-yellow { @include text-color($color-yellow); }
|
||||||
|
&-grey { @include text-color($color-grey); }
|
||||||
|
|
||||||
|
&-primary { @include text-color($color-primary); }
|
||||||
|
&-secondary { @include text-color($color-secondary); }
|
||||||
|
&-warning { @include text-color($color-warning); }
|
||||||
|
&-danger { @include text-color($color-danger); }
|
||||||
|
&-info { @include text-color($color-info); }
|
||||||
|
&-success { @include text-color($color-success); }
|
||||||
|
}
|
||||||
316
scss/_typography.scss
Normal file
316
scss/_typography.scss
Normal file
|
|
@ -0,0 +1,316 @@
|
||||||
|
/*
|
||||||
|
* 2 - Typography ( _typography.scss )
|
||||||
|
*
|
||||||
|
* This part of the (s)css handle everything related to the typography
|
||||||
|
* like paragraphs, blockquote, etc.
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
@import 'font-face';
|
||||||
|
|
||||||
|
/* 2.2 - Global Typography */
|
||||||
|
|
||||||
|
@mixin paragraph() {
|
||||||
|
padding:0;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: $basefont;
|
||||||
|
text-align: left;
|
||||||
|
font-size: $fontsize;
|
||||||
|
line-height: $lineheight;
|
||||||
|
color: $color-font;
|
||||||
|
font-weight: $fontweight_base;
|
||||||
|
}
|
||||||
|
|
||||||
|
.night-mode {
|
||||||
|
color: $color-light2;
|
||||||
|
}
|
||||||
|
|
||||||
|
strong {
|
||||||
|
font-weight: $fontweight_bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
em {
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: $fontweight_base;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $color-link;
|
||||||
|
text-decoration:none;
|
||||||
|
&:hover, &:active {
|
||||||
|
color: $color-link;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
@include paragraph();
|
||||||
|
&:last-child {
|
||||||
|
padding-bottom:0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ul, ol {
|
||||||
|
@include paragraph();
|
||||||
|
list-style: disc;
|
||||||
|
ul, ol {
|
||||||
|
padding-bottom:0;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
margin:0;
|
||||||
|
margin-left: $lineheight;
|
||||||
|
line-height: $lineheight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::selection { background: $color-selection; color: $color-light; }
|
||||||
|
::-moz-selection { background: $color-selection; color: $color-light; }
|
||||||
|
|
||||||
|
/* 2.2 - Text Wrapper */
|
||||||
|
|
||||||
|
.container-typographic {
|
||||||
|
p {
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
text-indent: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
p, em, p em {
|
||||||
|
font-weight:$fontweight_base;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.article-thumbnail {
|
||||||
|
padding-bottom: 1em;
|
||||||
|
text-align: center;
|
||||||
|
img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.article-excerpt {
|
||||||
|
padding: 0.5em 0.5em 0.5em 0.5em;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
.article-author {
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
.card-meta {
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bypass-flex-fontsize {
|
||||||
|
line-height: $lineheight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
article.maintext {
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2.3 - Titles */
|
||||||
|
|
||||||
|
@mixin newTitle($font, $size, $weight) {
|
||||||
|
$lineNumber: ceil($size / 1.5);
|
||||||
|
font-family: $font;
|
||||||
|
font-size: $size * 1rem;
|
||||||
|
line-height: $lineNumber * $lineheight;
|
||||||
|
padding: 0;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
font-weight: $weight;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6, h7 {
|
||||||
|
font-family: $basefont;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 1em;
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
font-weight: $fontweight_base;
|
||||||
|
|
||||||
|
&.page-title {
|
||||||
|
color: $color-primary;
|
||||||
|
|
||||||
|
i {
|
||||||
|
font-size: 0.55em;
|
||||||
|
position: relative;
|
||||||
|
top: -0.175em;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-flex {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-between;
|
||||||
|
& > span, & > i, & > a {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > a {
|
||||||
|
color: $color-primary;
|
||||||
|
&:hover, &:focus, &:active {
|
||||||
|
color: darken($color-primary, 10%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
//@include title(3.33em, 1.2em, 0.0em, 0.2em, 200);
|
||||||
|
@include newTitle($titlefont, 3.815, $fontweight_big);
|
||||||
|
color: $color-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
//@include title(2.725em, 1.125em, 0em, 0.5625em, 200);
|
||||||
|
@include newTitle($basefont, 2.441, $fontweight_big);
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
@include newTitle($basefont, 1.953, $fontweight_bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
h4 {
|
||||||
|
@include newTitle($basefont, 1.563, $fontweight_hyper);
|
||||||
|
}
|
||||||
|
|
||||||
|
h5 {
|
||||||
|
@include newTitle($basefont, 1.25, $fontweight_bold);
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 {
|
||||||
|
@include newTitle($basefont, 1, $fontweight_hyper);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2.4 - hr */
|
||||||
|
|
||||||
|
hr {
|
||||||
|
border-top: 0px;
|
||||||
|
border-left: 0px;
|
||||||
|
border-right: 0px;
|
||||||
|
border-bottom: 1px;
|
||||||
|
border-color: rgba(1,1,1,0.15);
|
||||||
|
border-style: solid;
|
||||||
|
margin: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2.5 - Wells and quotes */
|
||||||
|
|
||||||
|
@mixin well() {
|
||||||
|
border-width: 0 0 0 0em;
|
||||||
|
border-style: none;
|
||||||
|
border-radius: 0px;
|
||||||
|
|
||||||
|
margin: 0 0 $lineheight 0;
|
||||||
|
padding: $lineheight 1rem $lineheight 1rem;
|
||||||
|
|
||||||
|
max-width: 100%;
|
||||||
|
background-color: $color-light2;
|
||||||
|
font-style: italic;
|
||||||
|
color: $color-dark2;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote, .quote {
|
||||||
|
@include well();
|
||||||
|
&:before {
|
||||||
|
content:"";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.well, pre, .pre, .well-pre {
|
||||||
|
@include well();
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
code {
|
||||||
|
background:transparent;
|
||||||
|
color: $color-red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container-typographic {
|
||||||
|
max-width: 800px;
|
||||||
|
margin:auto;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* 2.6 - Special styling */
|
||||||
|
|
||||||
|
mark {
|
||||||
|
border-radius: 0.2em;
|
||||||
|
padding:0 0.2em 0 0.2em;
|
||||||
|
|
||||||
|
background-color: lighten($color-mark, 30%);
|
||||||
|
color: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.night-mode mark {
|
||||||
|
background-color: $color-primary;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
font-style: italic;
|
||||||
|
text-align: right;
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Table elements */
|
||||||
|
|
||||||
|
@mixin table-color($text-color) {
|
||||||
|
th {
|
||||||
|
color: $text-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
table, th, td {
|
||||||
|
border: 0;
|
||||||
|
padding:0px;
|
||||||
|
margin:0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
th, td {
|
||||||
|
vertical-align:center;
|
||||||
|
padding-top: 0.325em;
|
||||||
|
padding-bottom: 0.325em;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
font-weight: $fontweight_hyper;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table {
|
||||||
|
&-blue { @include table-color($color-blue); }
|
||||||
|
&-violet { @include table-color($color-violet); }
|
||||||
|
&-red { @include table-color($color-red); }
|
||||||
|
&-orange { @include table-color($color-orange); }
|
||||||
|
&-green { @include table-color($color-green); }
|
||||||
|
&-skyblue { @include table-color($color-skyblue); }
|
||||||
|
&-dark { @include table-color($color-dark); }
|
||||||
|
&-light { @include table-color($color-light); }
|
||||||
|
&-yellow { @include table-color($color-yellow); }
|
||||||
|
&-grey { @include table-color($color-grey); }
|
||||||
|
|
||||||
|
&-primary { @include table-color($color-primary); }
|
||||||
|
&-secondary { @include table-color($color-secondary); }
|
||||||
|
&-warning { @include table-color($color-warning); }
|
||||||
|
&-danger { @include table-color($color-danger); }
|
||||||
|
&-info { @include table-color($color-info); }
|
||||||
|
&-success { @include table-color($color-success); }
|
||||||
|
}
|
||||||
200
scss/components/_buttons.scss
Normal file
200
scss/components/_buttons.scss
Normal file
|
|
@ -0,0 +1,200 @@
|
||||||
|
/*
|
||||||
|
* 3. Buttons and labels
|
||||||
|
* All clickable elements
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
$color-button-light: $color-light;
|
||||||
|
$color-button-dark: $color-dark;
|
||||||
|
|
||||||
|
$button_large: $lineheight;
|
||||||
|
$button_small: $lineheight_quarter;
|
||||||
|
|
||||||
|
@mixin button($size) {
|
||||||
|
@include button-nobiseau($size);
|
||||||
|
@include biseau($size);
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin button-nobiseau($size) {
|
||||||
|
padding: $size;
|
||||||
|
padding-top: $size/3;
|
||||||
|
padding-bottom: $size/3;
|
||||||
|
margin:$size/2;
|
||||||
|
margin-top: $size/3;
|
||||||
|
margin-bottom: $lineheight;
|
||||||
|
//font-size: 4.75mm;
|
||||||
|
line-height:$lineheight;
|
||||||
|
height:auto;
|
||||||
|
@include borders();
|
||||||
|
@include border-radius();
|
||||||
|
font-weight: $fontweight_base;
|
||||||
|
|
||||||
|
background-color:transparent;
|
||||||
|
|
||||||
|
&:hover, &:active, &:focus, a:hover > &, a:active > &, a:focus > & {
|
||||||
|
text-decoration:none;
|
||||||
|
background-color:transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:focus {
|
||||||
|
outline: none;
|
||||||
|
box-shadow: $narrow-shadow, $inset-shadow, 0px 0px 0px 2px rgba(0, 0, 0, 0);
|
||||||
|
&:before {
|
||||||
|
box-shadow: $narrow-shadow, $inset-shadow, 0px 0px 0px 2px rgba(0, 0, 0, 0.3);
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin colorize-button($background-color, $text-color) {
|
||||||
|
//@include background-color($background-color, $text-color);
|
||||||
|
color: $text-color;
|
||||||
|
&:before {
|
||||||
|
background-color: $background-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin button-fullcontrol($background-color, $hover-color, $text-color) {
|
||||||
|
@include colorize-button($background-color, $text-color);
|
||||||
|
&:visited {
|
||||||
|
@include colorize-button($background-color, $text-color);
|
||||||
|
}
|
||||||
|
&, &:visited, &:not(.disabled):not(:disabled) {
|
||||||
|
&:hover, &:active, &:focus, a:hover > &, a:active > &, a:focus > & {
|
||||||
|
@include colorize-button($hover-color, lighten($text-color, 5%));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin button-color($background-color, $text-color) {
|
||||||
|
@include button-fullcontrol($background-color, darken($background-color, 7.5%), $text-color)
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
@include button($button_large);
|
||||||
|
&:hover, &:active {
|
||||||
|
@include borders();
|
||||||
|
}
|
||||||
|
|
||||||
|
p &:last-child {
|
||||||
|
margin-bottom:0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-small {
|
||||||
|
@include button($button_small);
|
||||||
|
padding-left: $button_small;
|
||||||
|
padding-right: $button_small;
|
||||||
|
text-decoration:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-label {
|
||||||
|
@include biseau($button_small);
|
||||||
|
padding-left: $button_small;
|
||||||
|
padding-right: $button_small;
|
||||||
|
}
|
||||||
|
|
||||||
|
// NAVBAR SPECIAL BUTTONS
|
||||||
|
|
||||||
|
.btn-navbar {
|
||||||
|
@include button-fullcontrol(transparent, rgba(0,0,0,0.1), $color-light);
|
||||||
|
padding-left: $button_small;
|
||||||
|
padding-right: $button_small;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-readmore {
|
||||||
|
@include button-fullcontrol(transparent, rgba(0,0,0,0.05), $color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
// BUTTONS GROUPS
|
||||||
|
|
||||||
|
$grouped-test: $button-large/1.5 - 0.05rem ;
|
||||||
|
|
||||||
|
.btn-toolbar {
|
||||||
|
padding: 0 $button-large;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-group {
|
||||||
|
padding: 0px;
|
||||||
|
background-color:transparent;
|
||||||
|
margin-bottom: 1.33em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-group .btn {
|
||||||
|
margin:0 $grouped-test 0 $grouped-test!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ------------------ BREADCRUMB ------------------- */
|
||||||
|
|
||||||
|
ul.breadcrumb, ol.breadcrumb, .breadcrumb {
|
||||||
|
padding-top: 0em;
|
||||||
|
background-color:transparent;
|
||||||
|
margin: 0;
|
||||||
|
padding-bottom:2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.breadcrumb li.breadcrumb-item {
|
||||||
|
padding:0;
|
||||||
|
&:before {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a, span {
|
||||||
|
display:inline-block;
|
||||||
|
@include button($button-large);
|
||||||
|
@include button-fullcontrol($color-light2, darken($color-light2, 5%), $color-dark2);
|
||||||
|
margin:0 $button-large/2.5 0 $button-large/2.5;
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
content: " "!important;
|
||||||
|
border-right:1px solid rgba(0,0,0,0.2);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
@include button-fullcontrol($color-primary, $color-primary, $color-light);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// COLORIZE BUTTONS
|
||||||
|
|
||||||
|
.btn, a.btn, .badge, .chip, a.chip, a.badge, .label, a.label, label.label {
|
||||||
|
&-blue { @include button-color($color-blue, $color-button-light); }
|
||||||
|
&-violet { @include button-color($color-violet, $color-button-light); }
|
||||||
|
&-red { @include button-color($color-red, $color-button-light); }
|
||||||
|
&-orange { @include button-color($color-orange, $color-button-light); }
|
||||||
|
&-green { @include button-color($color-green, $color-button-light); }
|
||||||
|
&-skyblue { @include button-color($color-skyblue, $color-button-light); }
|
||||||
|
&-dark { @include button-color($color-dark, $color-button-light); }
|
||||||
|
&-light { @include button-color($color-light2, $color-button-dark); }
|
||||||
|
&-yellow { @include button-color($color-yellow, $color-button-light); }
|
||||||
|
&-grey { @include button-color($color-grey, $color-button-light); }
|
||||||
|
|
||||||
|
&-primary { @include button-color($color-primary, $color-button-light); }
|
||||||
|
&-secondary { @include button-color($color-secondary, $color-button-light); }
|
||||||
|
&-warning { @include button-color($color-warning, $color-button-light); }
|
||||||
|
&-danger { @include button-color($color-danger, $color-button-light); }
|
||||||
|
&-info { @include button-color($color-info, $color-button-light); }
|
||||||
|
&-success { @include button-color($color-success, $color-button-light);}
|
||||||
|
&-link {@include button-color(transparent, $color-dark);}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ------------------ PARTAGE RESEAUX SOCIAUX ------------------- */
|
||||||
|
|
||||||
|
.share-buttons {
|
||||||
|
margin-top: $lineheight;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
}
|
||||||
|
|
||||||
|
.reagir {
|
||||||
|
text-align:right;
|
||||||
|
}
|
||||||
|
.btn, a.btn {
|
||||||
|
&-facebook {@include button-color(#3B5998, $color-button-light);}
|
||||||
|
&-twitter {@include button-color(#55ACEE, $color-button-light);}
|
||||||
|
&-googleplus {@include button-color(#d34836, $color-button-light);}
|
||||||
|
&-diaspora {@include button-color(#313739, $color-button-light);}
|
||||||
|
&-mastodon {@include button-color(#282c37, $color-button-light);}
|
||||||
|
}
|
||||||
240
scss/components/_cards.scss
Normal file
240
scss/components/_cards.scss
Normal file
|
|
@ -0,0 +1,240 @@
|
||||||
|
/*
|
||||||
|
* 2. Cards and containers
|
||||||
|
* All elements that are supposed to contain other stuff
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
$card-bigpad: $lineheight;
|
||||||
|
$card-smallpad: $lineheight_half;
|
||||||
|
|
||||||
|
@mixin card($size) {
|
||||||
|
@include border-radius();
|
||||||
|
background-color: $color-light2;
|
||||||
|
box-shadow: $large-shadow;
|
||||||
|
border: none;
|
||||||
|
margin:0;
|
||||||
|
margin-bottom:$lineheight;
|
||||||
|
padding: $size;
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin card-header($size) {
|
||||||
|
font-size:1.1em;
|
||||||
|
font-weight: $fontweight_big;
|
||||||
|
border-radius: 0;
|
||||||
|
padding: $size/2;
|
||||||
|
padding-left:0;
|
||||||
|
padding-right:0;
|
||||||
|
padding-bottom: $size/2!important;
|
||||||
|
margin-bottom:$lineheight_half;
|
||||||
|
line-height:$lineheight;
|
||||||
|
|
||||||
|
position:relative;
|
||||||
|
left: -$size*1.25;
|
||||||
|
|
||||||
|
width:95%;
|
||||||
|
|
||||||
|
@include biseau($size);
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6, h7, h8, h9, h10 {
|
||||||
|
font-family:$basefont;
|
||||||
|
font-size:1rem;
|
||||||
|
padding:0px;
|
||||||
|
margin:0px;
|
||||||
|
color:$color-light;
|
||||||
|
font-weight: $fontweight_big;
|
||||||
|
line-height:$lineheight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin card-color($background-color, $text-color) {
|
||||||
|
& .card-header, & .menu-header {
|
||||||
|
@include background-color($background-color, $text-color);
|
||||||
|
&:before {
|
||||||
|
@include background-color($background-color, $text-color);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card, .menu {
|
||||||
|
@include card($card-bigpad);
|
||||||
|
|
||||||
|
&-body {
|
||||||
|
padding:0!important;
|
||||||
|
margin:0!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-header {
|
||||||
|
@include card-header($card-bigpad);
|
||||||
|
.fa {
|
||||||
|
margin-right: 0.5em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Menu handling */
|
||||||
|
|
||||||
|
&-menu {
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
list-style: none;
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-element, .menu-element-link, li a {
|
||||||
|
display:flex;
|
||||||
|
line-height:$lineheight;
|
||||||
|
padding-right:$lineheight_half;
|
||||||
|
padding-left:$lineheight_quarter;
|
||||||
|
padding-top:$lineheight_quarter;
|
||||||
|
padding-bottom:$lineheight_quarter;
|
||||||
|
margin:0;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
word-wrap:none;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
overflow:hidden;
|
||||||
|
|
||||||
|
@include biseau($lineheight_half);
|
||||||
|
|
||||||
|
strong {
|
||||||
|
font-weight: 900;
|
||||||
|
color:$color-dark!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.noflex {
|
||||||
|
& :first-child {
|
||||||
|
min-width:2rem;
|
||||||
|
}
|
||||||
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration:none;
|
||||||
|
color: $color-violet;
|
||||||
|
background-color:transparent;
|
||||||
|
&:hover {
|
||||||
|
text-decoration:none;
|
||||||
|
color: $color-violet;
|
||||||
|
|
||||||
|
@include biseau($lineheight_half);
|
||||||
|
|
||||||
|
&:before {
|
||||||
|
background-color: darken($color-light2, 7.5%)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-divider {
|
||||||
|
position: relative;
|
||||||
|
left: -$lineheight_quarter;
|
||||||
|
font-weight: $fontweight_hyper;
|
||||||
|
padding-top:$lineheight_quarter;
|
||||||
|
padding-bottom:$lineheight_quarter;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* CARD LIST - Make a list part of a card */
|
||||||
|
|
||||||
|
|
||||||
|
@mixin list-symbol($symbol) {
|
||||||
|
li.list-element {
|
||||||
|
list-style: none;
|
||||||
|
&::before {
|
||||||
|
font-family: "ForkAwesome";
|
||||||
|
content:$symbol;
|
||||||
|
padding-right:$lineheight_half;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@mixin list-color($color) {
|
||||||
|
li.list-element {
|
||||||
|
&::before {
|
||||||
|
color: $color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
ul.card-list, .card > ul {
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
li.list-element {
|
||||||
|
line-height:$lineheight;
|
||||||
|
padding-right:$lineheight_half;
|
||||||
|
padding-left:$lineheight_quarter;
|
||||||
|
padding-top:$lineheight_quarter;
|
||||||
|
padding-bottom:$lineheight_quarter;
|
||||||
|
margin:0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list {
|
||||||
|
&-check {@include list-symbol("\f00c");}
|
||||||
|
&-cross {@include list-symbol("\f00d");}
|
||||||
|
|
||||||
|
&-danger{@include list-color($color-danger);}
|
||||||
|
&-success{@include list-color($color-success);}
|
||||||
|
}
|
||||||
|
|
||||||
|
.smallcard, .toast {
|
||||||
|
@include card($card-smallpad);
|
||||||
|
&-header {
|
||||||
|
@include card-header($card-bigpad);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* COLORIZE CARDS and TOASTS */
|
||||||
|
|
||||||
|
.card, .smallcard, .menu {
|
||||||
|
&-blue { @include card-color($color-blue, $color-light); }
|
||||||
|
&-violet { @include card-color($color-violet, $color-light); }
|
||||||
|
&-red { @include card-color($color-red, $color-light); }
|
||||||
|
&-orange { @include card-color($color-orange, $color-light); }
|
||||||
|
&-green { @include card-color($color-green, $color-light); }
|
||||||
|
&-skyblue { @include card-color($color-skyblue, $color-light); }
|
||||||
|
&-dark { @include card-color($color-dark, $color-light); }
|
||||||
|
&-light { @include card-color($color-light2, $color-dark); }
|
||||||
|
&-yellow { @include card-color($color-yellow, $color-light); }
|
||||||
|
&-grey { @include card-color($color-grey, $color-light); }
|
||||||
|
|
||||||
|
&-primary { @include card-color($color-primary, $color-light); }
|
||||||
|
&-secondary { @include card-color($color-secondary, $color-light); }
|
||||||
|
&-warning { @include card-color($color-warning, $color-light); }
|
||||||
|
&-danger { @include card-color($color-danger, $color-light); }
|
||||||
|
&-info { @include card-color($color-info, $color-light); }
|
||||||
|
&-success { @include card-color($color-success, $color-light); }
|
||||||
|
}
|
||||||
|
|
||||||
|
.toast {
|
||||||
|
&-blue { @include background-color($color-blue, $color-light); }
|
||||||
|
&-violet { @include background-color($color-violet, $color-light); }
|
||||||
|
&-red { @include background-color($color-red, $color-light); }
|
||||||
|
&-orange { @include background-color($color-orange, $color-light); }
|
||||||
|
&-green { @include background-color($color-green, $color-light); }
|
||||||
|
&-skyblue { @include background-color($color-skyblue, $color-light); }
|
||||||
|
&-dark { @include background-color($color-dark, $color-light); }
|
||||||
|
&-light { @include background-color($color-light2, $color-dark); }
|
||||||
|
&-yellow { @include background-color($color-yellow, $color-light); }
|
||||||
|
&-grey { @include background-color($color-grey, $color-light); }
|
||||||
|
|
||||||
|
&-primary { @include background-color($color-primary, $color-light); }
|
||||||
|
&-secondary { @include background-color($color-secondary, $color-light); }
|
||||||
|
&-warning { @include background-color($color-warning, $color-light); }
|
||||||
|
&-danger { @include background-color($color-danger, $color-light); }
|
||||||
|
&-info { @include background-color($color-info, $color-light); }
|
||||||
|
&-success { @include background-color($color-success, $color-light); }
|
||||||
|
}
|
||||||
250
scss/components/_previews.scss
Normal file
250
scss/components/_previews.scss
Normal file
|
|
@ -0,0 +1,250 @@
|
||||||
|
/*
|
||||||
|
* 4. Previews
|
||||||
|
* Special style for previews cards
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
$preview-height: 8*$lineheight;
|
||||||
|
|
||||||
|
.previews-section {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
grid-template-rows: auto;
|
||||||
|
grid-gap: $lineheight;
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
|
||||||
|
@include xl() {
|
||||||
|
grid-template-columns: 1fr 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include xxl() {
|
||||||
|
grid-template-columns: 1fr 1fr 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview-container {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media(max-width:767px){}
|
||||||
|
@media(min-width:768px){}
|
||||||
|
@media(min-width:992px){
|
||||||
|
|
||||||
|
.prev-col-2 .preview-container {
|
||||||
|
width:50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prev-col-3 .preview-container {
|
||||||
|
width:33%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.prev-col-4 .preview-container {
|
||||||
|
width:25%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-preview {
|
||||||
|
padding:0;
|
||||||
|
width:100%;
|
||||||
|
margin:auto;
|
||||||
|
box-shadow: $large-shadow, $inset-shadow;
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview-link:hover {
|
||||||
|
text-decoration:none!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview-item {
|
||||||
|
height: $preview-height;
|
||||||
|
font-size:0.9rem;
|
||||||
|
line-height: $lineheight !important;
|
||||||
|
text-align:justify;
|
||||||
|
background-color:rgba(0,0,0,0.00);
|
||||||
|
color:rgba(0,0,0,0.4);
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
-ms-flex-align: center !important;
|
||||||
|
align-items: center !important;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
.preview-overlay {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
position: absolute;
|
||||||
|
padding-top: $lineheight_half;
|
||||||
|
backdrop-filter: none;
|
||||||
|
transition: background-color 0.3s;
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
color: $color-light;
|
||||||
|
font-size: 1rem;
|
||||||
|
line-height: $lineheight;
|
||||||
|
font-weight:$fontweight_big;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
font-family: $basefont;
|
||||||
|
font-size: 1rem;
|
||||||
|
background-color: $color-primary;
|
||||||
|
@include card-header($lineheight_half);
|
||||||
|
font-weight: $fontweight_big;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.preview-overlay {
|
||||||
|
backdrop-filter: blur(2px);
|
||||||
|
background-color:rgba(0,0,0,0.4);
|
||||||
|
|
||||||
|
.metadata-pills {
|
||||||
|
opacity: .9;
|
||||||
|
transition: opacity .5s, height .5s;
|
||||||
|
height:135px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview-content {
|
||||||
|
max-height: $preview-height;
|
||||||
|
overflow:hidden;
|
||||||
|
background-size: cover;
|
||||||
|
min-height:100%;
|
||||||
|
min-width:100%;
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
margin-bottom:0px;
|
||||||
|
max-width:100%;
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
& > p {
|
||||||
|
width:100%;
|
||||||
|
margin:auto;
|
||||||
|
|
||||||
|
& > img {
|
||||||
|
max-width:100%;
|
||||||
|
height:auto;
|
||||||
|
vertical-align:middle;
|
||||||
|
margin:auto;
|
||||||
|
text-align:center;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.p-img {
|
||||||
|
text-align:center;
|
||||||
|
margin:auto;
|
||||||
|
padding:auto;
|
||||||
|
display: block;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.preview-metadata {
|
||||||
|
color: $color-light;
|
||||||
|
height:165px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.metadata-pills {
|
||||||
|
height:165px;
|
||||||
|
opacity: 0;
|
||||||
|
transition: opacity .3s, height .3s;
|
||||||
|
display:flex;
|
||||||
|
justify-content:space-between;
|
||||||
|
padding-left: $lineheight/2;
|
||||||
|
padding-right: $lineheight/2;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-preview.card-info {
|
||||||
|
.comment-text {
|
||||||
|
@include angled-edge('outside top', 'upper left', $color-skyblue, 16);
|
||||||
|
background-color:$color-skyblue;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-preview.card-grey {
|
||||||
|
.comment-text {
|
||||||
|
@include angled-edge('outside top', 'upper left', $color-grey, 16);
|
||||||
|
background-color:$color-grey;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.comment-text {
|
||||||
|
@include angled-edge('outside top', 'upper left', $color-violet, 16);
|
||||||
|
color: $color-light;
|
||||||
|
background-color:$color-violet;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-preview time {
|
||||||
|
margin-bottom:0.4em;
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Author area
|
||||||
|
|
||||||
|
.author-area {
|
||||||
|
display:flex;
|
||||||
|
|
||||||
|
img.author-avatar, img.avatar {
|
||||||
|
display:block;
|
||||||
|
height: 4.5rem;
|
||||||
|
width:auto;
|
||||||
|
border-radius:100%;
|
||||||
|
padding:0;
|
||||||
|
margin:0;
|
||||||
|
margin-right:$lineheight;
|
||||||
|
}
|
||||||
|
|
||||||
|
.author-metadata {
|
||||||
|
align-items:center;
|
||||||
|
display:flex;
|
||||||
|
flex-direction:column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.author-date {
|
||||||
|
font-style:italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(:last-child) {
|
||||||
|
margin-bottom:$lineheight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pigimg {
|
||||||
|
display:block;
|
||||||
|
max-width: 100%;
|
||||||
|
height:auto;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mwarea {
|
||||||
|
padding-bottom: $lineheight;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mwaimg {
|
||||||
|
width:100%;
|
||||||
|
height:auto;
|
||||||
|
display:block;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cover {
|
||||||
|
width:100%;
|
||||||
|
height:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.roman {
|
||||||
|
@include md() {
|
||||||
|
width:80%;
|
||||||
|
position:relative;
|
||||||
|
top:-240px;
|
||||||
|
margin:auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
27
scss/style.scss
Normal file
27
scss/style.scss
Normal file
|
|
@ -0,0 +1,27 @@
|
||||||
|
/*
|
||||||
|
Theme Name: Kazhnuz Space
|
||||||
|
Theme URI: https://git.kobold.cafe/kazhnuz/kspace-wordpress-theme
|
||||||
|
Author: Kazhnuz
|
||||||
|
Author URI: https://kazhnuz.space
|
||||||
|
Description: The default theme for Kazhnuz.space, my personnal blog. Made using spectre.css
|
||||||
|
Version: 0.1
|
||||||
|
License: GNU General Public License v3 or later
|
||||||
|
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
||||||
|
Tags: blog, two-columns, right-sidebar, artist, solarized
|
||||||
|
Text Domain: kspace-wordpress-theme
|
||||||
|
|
||||||
|
This theme is licensed under the GPLv3.
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
@import 'angled-edges';
|
||||||
|
|
||||||
|
@import 'palette';
|
||||||
|
|
||||||
|
@import 'definitions';
|
||||||
|
|
||||||
|
@import 'typography';
|
||||||
|
|
||||||
|
@import 'global';
|
||||||
|
|
||||||
|
@import 'drawing';
|
||||||
8
search.php
Normal file
8
search.php
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<h1 class="page-title"><i class="fa fa-fw fa-search"></i><?php _e('', 'sandbox') ?> Recherche pour le terme « <?php echo get_search_query(); ?> »</h1>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||||
|
</main>
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
||||||
3
sidebar.php
Normal file
3
sidebar.php
Normal file
|
|
@ -0,0 +1,3 @@
|
||||||
|
<aside class="sidebar">
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar-content.php'); ?>
|
||||||
|
</aside>
|
||||||
54
single.php
Normal file
54
single.php
Normal file
|
|
@ -0,0 +1,54 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
|
||||||
|
|
||||||
|
<article class="article" id="post-<?php the_ID(); ?>">
|
||||||
|
<h1 class="page-title"><?php the_title(); ?></h1>
|
||||||
|
|
||||||
|
<div class="article-entry">
|
||||||
|
<?php the_content(); ?>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<section class="card card-noheader">
|
||||||
|
<div class="author-area">
|
||||||
|
<? echo get_avatar( get_the_author_meta('user_email'), $size = '120'); ?>
|
||||||
|
<div class="author-metadata">
|
||||||
|
<div class="author-pseudo">Écrit par <a href="https://kazhnuz.space"><?php the_author() ?></a></div>
|
||||||
|
<small class="author-date">Le <?php the_time('l j F Y à H:i') ?></small>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<?php
|
||||||
|
$custom_fields = get_post_custom();
|
||||||
|
$my_custom_field = $custom_fields['description'];
|
||||||
|
if ($my_custom_field != null) {
|
||||||
|
foreach ( $my_custom_field as $key => $value ) {
|
||||||
|
echo " <div class='card-body'> " . $value . "</div>";
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
|
||||||
|
<div class="article-category">
|
||||||
|
<?php $categories = get_the_category();
|
||||||
|
foreach( $categories as $category ) {
|
||||||
|
echo "<a href= '" . esc_url( get_category_link( $category->term_id ) ) . "' class='btn-small btn-info'><i class='fa fa-folder'></i> " . $category->cat_name . "</a>";
|
||||||
|
} ?>
|
||||||
|
<?php $tags = get_the_tags();
|
||||||
|
if ($tags) {
|
||||||
|
foreach( $tags as $tag ) {
|
||||||
|
echo "<a href= '" . esc_url( get_tag_link( $tag->term_id ) ) . "' class='btn-small btn-primary'><i class='fa fa-tag'></i> " . $tag->name . "</a>";
|
||||||
|
}
|
||||||
|
} ?>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<?php comments_template(); ?>
|
||||||
|
|
||||||
|
<?php endwhile; ?>
|
||||||
|
<?php endif; ?>
|
||||||
|
</main>
|
||||||
|
<?php get_sidebar(); ?>
|
||||||
|
<?php get_footer(); ?>
|
||||||
2131
style.css
Normal file
2131
style.css
Normal file
File diff suppressed because one or more lines are too long
25
tag.php
Normal file
25
tag.php
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
<?php get_header(); ?> <!-- ouvrir header,php -->
|
||||||
|
<main class="col-md-8">
|
||||||
|
<?php $tag = get_category( get_query_var( 'tag' ) );
|
||||||
|
$tag_id = $tag->ID;?>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/posts-list.php'); ?>
|
||||||
|
</main>
|
||||||
|
<!-- Sidebar custom pour contenir la description -->
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="card card-info">
|
||||||
|
<div class="card-header"><i class="fa fa-fw fa-tag"></i> <?php echo single_cat_title(); ?></div>
|
||||||
|
<div class="card-body">
|
||||||
|
<?php echo tag_description();?>
|
||||||
|
<p><? echo '<a href="' . get_tag_link( $tag_id ) . 'feed/" title="RSS du tag" />Flux RSS</a> du tag'; ?></p>
|
||||||
|
<?php $infourl = get_term_meta(get_queried_object_id(), 'plus-dinfo', true);
|
||||||
|
if ($infourl != null) {
|
||||||
|
echo '<p class="align-center"><a href="' . $infourl . '" class="btn btn-readmore">Plus d\'info</a></p>';
|
||||||
|
}
|
||||||
|
?>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<?php include(TEMPLATEPATH . '/components/sidebar-content.php'); ?>
|
||||||
|
</aside>
|
||||||
|
<?php get_footer(); ?>
|
||||||
Reference in a new issue