support for thumbnails

This commit is contained in:
cupcakearmy 2019-07-03 10:32:05 +02:00
parent 882fc5e323
commit 8c70403a1c
4 changed files with 33 additions and 9 deletions

View File

@ -53,14 +53,32 @@
} }
#home #list > .item:hover { #home #list > .item:hover {
box-shadow: 0 0.2em 0.5em -0.1em #00000014; box-shadow: var(--small-shadow);
transform: scale(1.05); transform: scale(1.05);
padding-bottom: 1em;
} }
#home #list > .item .title { #home #list > .item .title {
margin-bottom: .25em; margin-bottom: .25em;
} }
#home #list > .item .thumbnail img {
width: 100%;
height: 12em;
object-fit: cover;
object-position: center;
border-radius: .5em;
transition: var(--animation);
transform: scale(1);
}
#home #list > .item:hover .thumbnail img {
transform: scale(1.2) translateY(-1em);
height: 16em;
margin: 1em 0;
box-shadow: var(--small-shadow);
}
#home #list hr { #home #list hr {
margin: 0 1.5em; margin: 0 1.5em;
} }

View File

@ -4,6 +4,7 @@ include_once( 'logos.php' );
add_theme_support( 'align-wide' ); add_theme_support( 'align-wide' );
add_theme_support( 'title-tag' ); add_theme_support( 'title-tag' );
add_theme_support( 'post-thumbnails' );
add_action( 'wp_enqueue_scripts', function () { add_action( 'wp_enqueue_scripts', function () {
wp_enqueue_style( 'flex', get_template_directory_uri() . '/css/flex.css' ); wp_enqueue_style( 'flex', get_template_directory_uri() . '/css/flex.css' );

View File

@ -1,13 +1,17 @@
<?php <?php
include_once('loop-utils.php'); include_once( 'loop-utils.php' );
$dates = getDates(); $dates = getDates();
?> ?>
<a href="<?= get_permalink() ?>" class="item"> <a href="<?= get_permalink() ?>" class="item">
<div class="flex container vertical"> <div class="flex container vertical">
<?php if ( has_post_thumbnail() ) : ?>
<div class="thumbnail">
<?= get_the_post_thumbnail(); ?>
</div>
<?php endif; ?>
<h2 class="alt-font title"><?php the_title(); ?></h2> <h2 class="alt-font title"><?php the_title(); ?></h2>
<div class="flex container horizontal"> <div class="flex container horizontal">
<div> <div>
@ -15,10 +19,10 @@ $dates = getDates();
</div> </div>
<div class="flex item grow"></div> <div class="flex item grow"></div>
<div> <div>
~<?= do_shortcode('[rt_reading_time]'); ?> min ~<?= do_shortcode( '[rt_reading_time]' ); ?> min
</div> </div>
</div> </div>
<?php if(has_excerpt()){ <?php if ( has_excerpt() ) {
the_excerpt(); the_excerpt();
} ?> } ?>
</div> </div>

View File

@ -2,7 +2,7 @@
Theme Name: Liquet Theme Name: Liquet
Author: Niccolo Borgioli Author: Niccolo Borgioli
Description: Minimalistic clean theme Description: Minimalistic clean theme
Version: 0.8 Version: 0.9
License: MIT License: MIT
Tags: minimal, simple, typography, clean Tags: minimal, simple, typography, clean
Author URI: https://nicco.io Author URI: https://nicco.io
@ -20,6 +20,7 @@ Theme URI: https://github.com/cupcakearmy/liquet
--clr-ligher: #eeeeee; --clr-ligher: #eeeeee;
--text-width: 35rem; --text-width: 35rem;
--animation: all 100ms ease; --animation: all 100ms ease;
--small-shadow: 0 0.2em 0.5em -0.1em #00000014;
} }
html, body { html, body {