refactor & simplify featured posts markup & styles

This commit is contained in:
Matthias Kretschmann 2016-03-10 14:01:12 +01:00
parent b66c5a4e02
commit 1ff581d67b
2 changed files with 50 additions and 32 deletions

View File

@ -111,3 +111,26 @@
}
}
}
//
// Featured Blog Posts
//
.subtemplate--featured {
@media (@screen-sm) {
.grid__col { flex: 33%; }
}
}
.subtemplate--featured--more {
&:extend(.text-center);
margin-bottom: 0;
}
.featured {
}
.featured__title {
&:extend(.h4);
}

View File

@ -349,14 +349,20 @@ class Subtemplate {
return $result;
}
public function blogFeatures($page = "home") {
//
// Subtemplate: Featured Blog Posts
//
public function blogFeatures() {
$blogFeatures = '';
$subtemplateTitle = get_sub_field('section_title');
$subtemplateTitle = get_sub_field('section_title');
if (have_rows('blog_features','option')) {
while (have_rows('blog_features','option')) {
the_row();
$title = get_sub_field('feature_title');
$feature = get_sub_field('post');
$postTitle = $feature->post_title;
$url = get_permalink($feature->ID);
@ -364,43 +370,32 @@ class Subtemplate {
$date = date('F Y', strtotime($feature->post_date));
$image = wp_get_attachment_image_src(get_post_thumbnail_id($feature->ID),'blog-feature-crop')[0];
if ($page == "home") {
$blogFeatures .= "<a href='{$url}'><article class='blog'><div>
<img src='{$image}' alt='{$postTitle} Image'>
<h2>{$title}</h2>
<h1>{$postTitle}</h1></div>
</article></a>";
}
else {
$blogFeatures .= "<a href='{$url}'><article class='blog'>
<h1>{$postTitle}</h1>
<time>{$date}</time>
<div>{$content}</div>
</article></a>";
}
$blogFeatures .= "<div class='grid__col'>
<a href='{$url}'>
<article class='featured'>
<img class='featured__image' src='{$image}' alt='{$postTitle} Image'>
<h1 class='featured__title'>{$postTitle}</h1>
</article>
</a>
</div>";
}
}
if ($page == "home") {
$result = "<section class='subtemplate blog-features'>
<div class='row'>
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
<div class='column-container'>
$result = "<section class='subtemplate row subtemplate--featured'>
<h1 class='subtemplate__title'>{$subtemplateTitle}</h1>
<div class='grid grid--gutters grid--full grid-small--fit'>
{$blogFeatures}
</div>
</div>
</section>";
}
else {
$result = "<section class='sidebar-blog-features'>
{$blogFeatures}
</section>";
}
<p class='subtemplate--featured--more'><a class='button small white-blue' href=''>Go to Blog</a></p>
</section>";
return $result;
}
//
// Subtemplate: Team
//
public function team($subtemplateTitle) {
$content = get_sub_field('content');
$meetTeamLink = get_sub_field('meet_the_team_link');