From e06c12268c8ce249d3b74d615495588fb6d9af5c Mon Sep 17 00:00:00 2001
From: Kazhnuz <kazhnuz@kobold.cafe>
Date: Wed, 30 Dec 2020 22:42:54 +0100
Subject: [PATCH] fix: correction de l'affichage des articles

---
 comments.php                   | 122 ++++++++++++++-------------------
 scss/_drawing.scss             |  12 ++++
 scss/components/_previews.scss |   2 +-
 single.php                     |  59 ++++++----------
 style.css                      |  11 ++-
 5 files changed, 98 insertions(+), 108 deletions(-)

diff --git a/comments.php b/comments.php
index 262932b..050d553 100644
--- a/comments.php
+++ b/comments.php
@@ -22,24 +22,20 @@ $oddcomment = 'alt';
 <section class="comment-list">
 
   <?php if ($comments) : ?>
-    <h1 class="page-title" id="comments"><i class="fa fa-fw fa-comments"></i> <?php comments_number('Pas de commentaire', 'Un commentaire', '% commentaires' );?></h1>
+    <h1 class="page-title" id="comments"><?php comments_number('Pas de commentaire', 'Un commentaire', '% commentaires' );?></h1>
     <?php foreach ($comments as $comment) : ?>
-      <article class="card card-comment <?php echo $oddcomment; ?>" id="comment-<?php comment_ID() ?>">
-        <aside class="media card-meta">
-	        <div class="media-left">  <? echo get_avatar( get_the_author_meta('user_email'), $size = '50'); ?></div>
-	        <div class="media-body"><author class="media-heading">Post&eacute; par <?php comment_author_link() ?></author><time> Le <?php comment_date('j F, Y') ?> <?php _e('&agrave;');?> <?php comment_time() ?> </time></div>
-        </aside>
-        <?php if ($comment->comment_approved == '0') : ?>
-		      <div class="alert alert-warning"><?php _e('Votre commentaire est en cours de mod&eacute;ration'); ?></div>
- 		    <?php endif; ?>
-        
-        <div class="comment-body">
-        
-          <?php comment_text() ?>
-          
-          <p class="mb-0 align-right"><?php edit_comment_link('<i class="fa fa-fw fa-pencil"></i>','',''); ?></p>
-        </div>
-      </article>
+			<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 = '';
@@ -55,71 +51,59 @@ $oddcomment = 'alt';
 	<?php else : // comments are closed ?>
 
 	<!-- If comments are closed. -->
-<p class="nocomments alert alert-danger">Les commentaires sont fermŽs !</p>
+<p class="nocomments toast toast-danger">Les commentaires sont fermŽs !</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>
 
-<h1 id="respond" class="page-title"><i class="fa fa-fw fa-plus"></i> Laissez un commentaire</h1>
+		<!-- 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&eacute;</a> pour laisser un commentaire.</p>
 
-<?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&eacute;</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 ) : ?>
 
-<?php else : ?>
+		<div class="toast toast-info alert-flex" role="alert">
+		  <p class="mb-0"><i class="fa fa-info fa-fw" ></i> Connect&eacute; 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&eacute;connect&eacute; de ce compte"><i class="fa fa-fw fa-power-off"></i></a></p>
+		</div>
 
-<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">
-<?php if ( $user_ID ) : ?>
+		<!-- 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="alert alert-info alert-flex" role="alert">
-  <p class="mb-0"><i class="fa fa-info fa-fw" ></i> Connect&eacute; 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&eacute;connect&eacute; de ce compte"><i class="fa fa-fw fa-power-off"></i></a></p>
-</div>
+		<div class="input-group mb-3">
+		  <input type="text" class="form-control" name="email" id="email" placeholder="Courriel (ne sera pas publi&eacute;) <?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>
 
-<?php else : ?>
-
-<div class="input-group mb-3">
-  <div class="input-group-prepend">
-    <span class="input-group-text" id="basic-addon1"><i class="fa fa-fw fa-user"></i></span>
-  </div>
-  <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">
-  <div class="input-group-prepend">
-    <span class="input-group-text" id="basic-addon1"><i class="fa fa-fw fa-envelope"></i></span>
-  </div>
-  <input type="text" class="form-control" name="email" id="email" placeholder="Courriel (ne sera pas publi&eacute;) <?php if ($req) echo "(requis)"; ?>" value="<?php echo $comment_author_email; ?>" size="40" tabindex="2" />
-</div>
-
-<div class="input-group mb-3">
-  <div class="input-group-prepend">
-    <span class="input-group-text" id="basic-addon1"><i class="fa fa-fw fa-globe"></i></span>
-  </div>
-  <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">
-  <div class="input-group-prepend">
-    <span class="input-group-text"><i class="fa fa-fw fa-comment"></i></span>
-  </div>
-  <textarea class="form-control" name="comment" id="comment" aria-label="Contenu du commentaire" placeholder="Contenu du commentaire" tabindex="4"></textarea>
-</div>
-
-<p class="comment-info">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>
-
-<p class="align-right"><input name="submit" class="btn btn-primary" type="submit" id="submit" tabindex="5" value="Envoyer" />
-<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
-</p>
-
-<?php do_action('comment_form', $post->ID); ?>
-
-</form>
+	</div>
 
 
 
diff --git a/scss/_drawing.scss b/scss/_drawing.scss
index 0757664..7d08895 100644
--- a/scss/_drawing.scss
+++ b/scss/_drawing.scss
@@ -95,3 +95,15 @@ a.article-nav-link-wrap {
 .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;
+  }
+}
diff --git a/scss/components/_previews.scss b/scss/components/_previews.scss
index 7d2c7d9..b583b30 100644
--- a/scss/components/_previews.scss
+++ b/scss/components/_previews.scss
@@ -190,7 +190,7 @@ $preview-height: 8*$lineheight;
 .author-area {
   display:flex;
 
-  img.author-avatar {
+  img.author-avatar, img.avatar {
     display:block;
     height: 4.5rem;
     width:auto;
diff --git a/single.php b/single.php
index c5cf23a..bdf1322 100644
--- a/single.php
+++ b/single.php
@@ -1,47 +1,32 @@
 <?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"><i class="fa fa-fw fa-file-text"></i> <?php the_title(); ?></h1>
-  
-  <aside class="article-metadata">
-    <div class="article-thumbnail" ><?php the_post_thumbnail(); ?></div>
-    <aside class="card card-darker article-author bypass-flex-fontsize">
-      <div class="media card-meta">
-	      <div class="media-left">  <? echo get_avatar( get_the_author_meta('user_email'), $size = '50'); ?></div>
-	      <div class="media-body"><author class="media-heading">Écrit par <?php the_author() ?></author><time> Le <?php the_time('l j F Y à H:i') ?> </time></div>
-      </div>
-    </aside>
-    <div class="article-excerpt"><?php the_excerpt(); ?></div>
-    
-    <section class="article-taxonomies">
-        <div class="article-categories article-taxonomies-container">
-          <?php $categories = get_the_category();
-          foreach( $categories as $category ) {
-            echo "<a href= '" . esc_url( get_category_link( $category->term_id ) ) . "' class='badge badge-category'>" . $category->cat_name . "</a>";
-          } ?>
-        </div>
-      
-        <div class="article-tags article-taxonomies-container">
-          <?php $tags = get_the_tags();
-          if ($tags) {
-            foreach( $tags as $tag ) {
-              echo "<a href= '" . esc_url( get_tag_link( $tag->term_id ) ) . "' class='badge badge-tag'>" . $tag->name . "</a>";
-            }
-          } ?>
-        </div>
-    </section>
-    <hr />
-  </aside>
-    
-    <div class="article-body">
+
+  <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 $categories = get_the_category();
+      foreach( $categories as $category ) {
+        echo "<a href= '" . esc_url( get_category_link( $category->term_id ) ) . "' class=''>" . $category->cat_name . "</a>";
+      } ?>
+    </section>
+
   </article>
-  
+
   <?php comments_template(); ?>
-  
+
   <?php endwhile; ?>
   <?php endif; ?>
 </main>
diff --git a/style.css b/style.css
index 9c81c95..9cf9812 100644
--- a/style.css
+++ b/style.css
@@ -2038,7 +2038,7 @@ ul.breadcrumb, ol.breadcrumb, .breadcrumb {
 
 .author-area {
   display: flex; }
-  .author-area img.author-avatar {
+  .author-area img.author-avatar, .author-area img.avatar {
     display: block;
     height: 4.5rem;
     width: auto;
@@ -2413,3 +2413,12 @@ a.article-nav-link-wrap {
 
 .card-select {
   width: 100%; }
+
+.input-group {
+  padding-bottom: 1.5rem; }
+  .input-group input, .input-group textarea {
+    width: 100%;
+    background-color: #fdf6e3;
+    border-radius: 0px;
+    border: 1px solid rgba(0, 0, 0, 0.2);
+    padding: 0.375rem; }