From efa3a25d9cc33cf08f335c79d32211b5ba62ab14 Mon Sep 17 00:00:00 2001
From: cupcakearmy <nicco.borgioli@gmail.com>
Date: Sun, 2 Jun 2019 12:05:20 +0200
Subject: [PATCH] support for widgets

---
 liquet/functions.php | 13 ++++++++
 liquet/singular.php  | 70 +++++++++++++++++++++++++++++++-------------
 liquet/style.css     |  9 ++++++
 3 files changed, 71 insertions(+), 21 deletions(-)

diff --git a/liquet/functions.php b/liquet/functions.php
index f8d7357..9dd8348 100644
--- a/liquet/functions.php
+++ b/liquet/functions.php
@@ -14,6 +14,19 @@ add_action( 'wp_enqueue_scripts', function () {
 	wp_enqueue_style( 'fonts', get_template_directory_uri() . '/vendor/fonts/import.css' );
 } );
 
+add_action( 'widgets_init', function () {
+
+	register_sidebar( array(
+		'name'          => 'Below posts',
+		'id'            => 'below_posts',
+		'before_widget' => '<div class="widget">',
+		'after_widget'  => '</div>',
+		'before_title'  => '<h3 class="alt-font">',
+		'after_title'   => '</h3>',
+	) );
+
+} );
+
 
 add_action( 'admin_init', function () {
 	add_settings_section( 'section-link', 'Links', null, 'theme-options' );
diff --git a/liquet/singular.php b/liquet/singular.php
index 1b72ba7..8dfd645 100644
--- a/liquet/singular.php
+++ b/liquet/singular.php
@@ -22,36 +22,64 @@ $dates = getDates();
                     <div class="alt-font">previous</div>
                 </a>
 
-                <div class="flex item grow" id="main">
+                <div class="flex item grow container vertical middle" id="main">
+
+                    <!-- Title -->
                     <div class="flex container vertical middle">
                         <div class="box" id="header">
                             <h1 class="alt-font"><?= the_title() ?></h1>
                         </div>
                     </div>
-                    <div class="flex container vertical middle" id="content">
-                        <div class="flex container horizontal">
-                            <div>
-                                <b><?= $dates['created'] ?></b>
-								<?php if ( $dates['different'] ) { ?>
-                                    <br/>
-                                    <small>updated on <?= $dates['modified'] ?></small>
-								<?php } ?>
-                            </div>
-                            <div class="flex item grow"></div>
-                            <div class="text-align-right">
-                                <b>~<?= do_shortcode( '[rt_reading_time]' ); ?> min</b>
-								<?= getCurrentPageViews() ?>
-                            </div>
-                        </div>
-                        <br><br>
-						<?php the_content(); ?>
 
+                    <!-- Content Body -->
+                    <div class="flex container vertical middle" id="content">
+
+                        <!-- Reading time and date -->
+						<?php if ( is_singular( 'post' ) ) : ?>
+                            <div class="flex container horizontal">
+                                <div>
+                                    <b><?= $dates['created'] ?></b>
+									<?php if ( $dates['different'] ) { ?>
+                                        <br/>
+                                        <small>updated on <?= $dates['modified'] ?></small>
+									<?php } ?>
+                                </div>
+                                <div class="flex item grow"></div>
+                                <div class="text-align-right">
+                                    <b>~<?= do_shortcode( '[rt_reading_time]' ); ?> min</b>
+									<?= getCurrentPageViews() ?>
+                                </div>
+                            </div>
+                            <br><br>
+						<?php endif; ?>
+
+                        <!-- Content -->
+						<?php the_content(); ?>
                     </div>
-                    <div class="flex container vertical middle">
-                        <br>
-						<?php render_current_tags(); ?>
+
+                    <!-- Tags -->
+					<?php if ( is_singular( 'post' ) ) : ?>
+                        <div class="auto-width text-align-center">
+                            <br>
+							<?php render_current_tags(); ?>
+                            <br>
+                        </div>
+					<?php endif; ?>
+
+                    <!-- Links -->
+                    <div class="flex container vertical middle auto-width">
 						<?php render_links( true ); ?>
                     </div>
+
+                    <!-- Bottom Widgets -->
+					<?php if ( is_singular( 'post' ) ) : ?>
+						<?php if ( is_active_sidebar( 'below_posts' ) ) : ?>
+                            <br><br><br><br><br><br>
+                            <div class="auto-width widget-area text-align-center">
+								<?php dynamic_sidebar( 'below_posts' ); ?>
+                            </div>
+						<?php endif; ?>
+					<?php endif; ?>
                 </div>
 
                 <a class="flex item shrink links" href="<?= getNextURL( true ) ?>">
diff --git a/liquet/style.css b/liquet/style.css
index e2d1264..aabc517 100644
--- a/liquet/style.css
+++ b/liquet/style.css
@@ -69,6 +69,10 @@ hr {
     text-align: left;
 }
 
+.text-align-center {
+    text-align: center;
+}
+
 #app {
     width: 100vw;
     height: 100vh;
@@ -107,4 +111,9 @@ img.icon {
     height: 1em;
     display: inline-block;
     vertical-align: middle;
+}
+
+.auto-width {
+    max-width: var(--text-width);
+    width: 100%;
 }
\ No newline at end of file