From 58305c4f7d0b14c711a4154f3fc737564c6bce5b Mon Sep 17 00:00:00 2001
From: Thomas Wood <thomas.wood09@imperial.ac.uk>
Date: Fri, 25 Nov 2016 14:53:20 +0100
Subject: [PATCH] Prevent blog post images falling outside of column on
homepage.
---
_layouts/home.html | 8 +++++---
assets/blog.scss | 20 +++++++++++++-------
2 files changed, 18 insertions(+), 10 deletions(-)
diff --git a/_layouts/home.html b/_layouts/home.html
index ff29dae..10a87ce 100644
--- a/_layouts/home.html
+++ b/_layouts/home.html
@@ -16,9 +16,11 @@ layout: default
<div class="col-sm-6">
<h2>News</h2>
{% for post in site.posts %}
- <h3 class="blog-post-title"><a href="{{ post.url }}">{{ post.title }}</a></h3>
- <p class="blog-post-meta">{{ post.date | date: "%b %-d, %Y" }}</p>
- {{ post.excerpt}}
+ <div class="post-preview">
+ <h3 class="post-title"><a href="{{ post.url }}">{{ post.title }}</a></h3>
+ <p class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</p>
+ {{ post.excerpt}}
+ </div>
{% endfor %}
</div>
diff --git a/assets/blog.scss b/assets/blog.scss
index 60f551f..c172be4 100644
--- a/assets/blog.scss
+++ b/assets/blog.scss
@@ -277,14 +277,20 @@ h6, .h6 {
.post {
margin-bottom: 4rem;
+ .post-title {
+ margin-bottom: .75rem;
+ font-size: 2.5rem;
+ }
+ .post-meta {
+ margin-bottom: 1.25rem;
+ color: #999;
+ }
}
-.post-title {
- margin-bottom: .75rem;
- font-size: 2.5rem;
-}
-.post-meta {
- margin-bottom: 1.25rem;
- color: #999;
+
+.post-preview {
+ img {
+ width: 100%;
+ }
}
--
GitLab