Skip to content

Commit 3ffb930

Browse files
wesleycolewesleycole
committed
adding the blog roll component
1 parent 45934a9 commit 3ffb930

File tree

22 files changed

+661
-53
lines changed

22 files changed

+661
-53
lines changed

‎_component/blogroll/component.html

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<div itemscope itemtype="https://schema.org/Blog">
2+
<article id="post-<?php the_ID(); ?>" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
3+
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
4+
<img src="https://www.fillmurray.com/100/100" srcset="https://www.fillmurray.com/100/100 1x, https://www.fillmurray.com/200/200 2x" alt="header image" />
5+
<meta itemprop="url" content="https://www.fillmurray.com/100/100" />
6+
<meta itemprop="width" content="100" />
7+
<meta itemprop="height" content="100" />
8+
</div>
9+
<header class="PostHeader">
10+
<h2 class="PostTitle" itemprop="headline"><a href="http://objectiv.co" itemprop="url" rel="bookmark">Blog Post Title</a></h2>
11+
<p>
12+
<strong>Publish Date</strong>:
13+
<span itemprop="datePublished">
14+
<time datetime="2017-06-06" pubdate>June 6, 2017</time>
15+
</span>
16+
</p>
17+
<p>
18+
<strong>Author</strong>:
19+
<span itemprop="author">Wes Cole</span>
20+
</p>
21+
</header>
22+
<div itemprop="description">
23+
<p>This would be the "description" or the excerpt of the blog post content.</p>
24+
<a href="http://objectiv.co/" itemprop="url">Read More... <span class="screen-reader-text">Post Title</span></a>
25+
</div>
26+
</article>
27+
</div>

‎_component/blogroll/component.php

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<?php if( have_posts() ): ?>
2+
<div itemscope itemtype="https://schema.org/Blog">
3+
<?php while( have_posts() ): the_post(); ?>
4+
<article id="post-<?php the_ID(); ?>" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
5+
<?php
6+
if ( has_post_thumbnailI() ) {
7+
the_post_thumbnail();
8+
}
9+
?>
10+
<header class="PostHeader">
11+
<?php
12+
the_title( '<h2 class="PostTitle" itemprop="headline"><a href="' . esc_url( get_permalink() ) . '" itemprop="url" rel="bookmark">', '</a></h2>' ); ?>
13+
<p>
14+
<strong><?php esc_html_e( 'Publish Date', 'objectiv' ); ?></strong>:
15+
<span itemprop="datePublished">
16+
<time datetime="<?php echo esc_attr( get_the_time( 'Y-m-d' ) ); ?>" pubdate><?php the_date(); ?></time>
17+
</span>
18+
</p>
19+
<p>
20+
<strong><?php esc_html_e( 'Author', 'objectiv' ); ?></strong>:
21+
<span itemprop="author"><?php the_author_link(); ?></span>
22+
</p>
23+
</header>
24+
<div itemprop="description">
25+
<?php the_excerpt(); ?>
26+
</div>
27+
</article>
28+
<?php endwhile; ?>
29+
</div>
30+
<?php endif; ?>

‎_component/blogroll/component.twig

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
{% raw %}<div itemscope itemtype="https://schema.org/Blog">
2+
{% for post in posts %}
3+
{% import '_macros/_img.twig' as m_img %}
4+
<article id="post-{{post.id}}" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
5+
{% if post.thumbnail %}
6+
{% set image = post.thumbnail.id %}
7+
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
8+
{{m_img.responsive(image, {alt: 'post thumbnail', class: 'responsive'})}}
9+
<meta itemprop="url" content="{{post.thumbnail.src}}" />
10+
<meta itemprop="width" content="{{post.thumbnail.width}}" />
11+
<meta itemprop="height" content="{{post.thumbnail.height}}" />
12+
</div>
13+
{% endif %}
14+
<header class="PostHeader">
15+
<h2 class="PostTitle" itemprop="headline"><a href="{{post.link}}" itemprop="url" rel="bookmark">{{post.title}}</a></h2>
16+
<p>
17+
<strong>Publish Date</strong>:
18+
<span itemprop="datePublished">
19+
<time datetime="{{post.date('Y-m-d')}}" pubdate>{{post.date}}</time>
20+
</span>
21+
</p>
22+
<p>
23+
<strong>Author</strong>:
24+
<span itemprop="author">{{post.author}}</span>
25+
</p>
26+
</header>
27+
<div itemprop="description">
28+
{{post.get_preview(200)}}
29+
</div>
30+
</article>
31+
{% endfor %}
32+
</div>{% endraw %}

‎_component/blogroll/example.html

+37
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
<!DOCTYPE html>
2+
<html lang="en-US" class="no-js">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Accordion</title>
6+
<link rel="stylesheet" href="css/component.css" />
7+
</head>
8+
<body>
9+
<div itemscope itemtype="https://schema.org/Blog">
10+
<article id="post-<?php the_ID(); ?>" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
11+
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
12+
<img src="https://www.fillmurray.com/100/100" srcset="https://www.fillmurray.com/100/100 1x, https://www.fillmurray.com/200/200 2x" alt="header image" />
13+
<meta itemprop="url" content="https://www.fillmurray.com/100/100" />
14+
<meta itemprop="width" content="100" />
15+
<meta itemprop="height" content="100" />
16+
</div>
17+
<header class="PostHeader">
18+
<h2 class="PostTitle" itemprop="headline"><a href="http://objectiv.co" itemprop="url" rel="bookmark">Blog Post Title</a></h2>
19+
<p>
20+
<strong>Publish Date</strong>:
21+
<span itemprop="datePublished">
22+
<time datetime="2017-06-06" pubdate>June 6, 2017</time>
23+
</span>
24+
</p>
25+
<p>
26+
<strong>Author</strong>:
27+
<span itemprop="author">Wes Cole</span>
28+
</p>
29+
</header>
30+
<div itemprop="description">
31+
<p>This would be the "description" or the excerpt of the blog post content.</p>
32+
<a href="http://objectiv.co/" itemprop="url">Read More... <span class="screen-reader-text">Post Title</span></a>
33+
</div>
34+
</article>
35+
</div>
36+
</body>
37+
</html>

‎_component/blogroll/index.md

+6-1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,11 @@ title: Blog Roll
33
layout: component
44
path_slug: blogroll
55
category: content
6+
iframe_height: medium
67
---
78

8-
## Blog Roll
9+
<iframe {% if page.iframe_height %}class="h-{{ page.iframe_height }}"{% endif %} src="{{ site.baseurl }}/component/{{ page.path_slug }}/example.html"></iframe>
10+
11+
## Markup
12+
13+
{% include partials/tabs.md %}

‎_component/button/index.md

-8
This file was deleted.

‎_component/macros/index.md

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
title: Macros
3+
layout: component
4+
path_slug: macros
5+
category: twig
6+
---

‎_data/categories.yml

+3
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,6 @@
66

77
- slug: content
88
pretty: Content
9+
10+
- slug: twig
11+
pretty: Twig

‎_site/README.md

+20-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,22 @@
11
# Objectiv Component Library
22

3-
https://objectivco.github.io/component-library/
3+
https://objectivco.github.io/component-library/
4+
5+
This is currently in development. We will be adding a new component a day, until we are happy with our full library.
6+
7+
## Contributing
8+
Please feel free to contribute to this library.
9+
1. Fork it, first :)
10+
2. Create a feature branch
11+
3. Commit your changes
12+
4. Push to the branch
13+
5. Submit a pull request
14+
15+
## Setting up locally
16+
```
17+
gem install bundler
18+
bundle install
19+
bundle exec jekyll serve -w
20+
```
21+
22+
You will be able to view the site at `http://127.0.0.1:4000/component-library/`

‎_site/component/accordion/index.html

+27-4
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,6 @@ <h4>UI</h4>
4141

4242

4343

44-
<li class="ComponentList-item"><a href="/component-library/component/button/index.html">Button</a></li>
45-
4644

4745

4846

@@ -95,8 +93,6 @@ <h4>Content</h4>
9593

9694

9795

98-
99-
10096
<li class="ComponentList-item"><a href="/component-library/component/image/index.html">Image</a></li>
10197

10298

@@ -107,9 +103,36 @@ <h4>Content</h4>
107103

108104

109105

106+
107+
110108
<li class="ComponentList-item"><a href="/component-library/component/testimonial/index.html">Testimonial</a></li>
111109

112110

111+
</ul>
112+
</div>
113+
114+
<div class="CategoryLink">
115+
<h4>Twig</h4>
116+
<ul class="ComponentList">
117+
118+
119+
120+
121+
122+
123+
124+
125+
126+
127+
128+
129+
<li class="ComponentList-item"><a href="/component-library/component/macros/index.html">Macros</a></li>
130+
131+
132+
133+
134+
135+
113136
</ul>
114137
</div>
115138

‎_site/component/blogpost/index.html

+27-4
Original file line numberDiff line numberDiff line change
@@ -41,8 +41,6 @@ <h4>UI</h4>
4141

4242

4343

44-
<li class="ComponentList-item"><a href="/component-library/component/button/index.html">Button</a></li>
45-
4644

4745

4846

@@ -95,8 +93,6 @@ <h4>Content</h4>
9593

9694

9795

98-
99-
10096
<li class="ComponentList-item"><a href="/component-library/component/image/index.html">Image</a></li>
10197

10298

@@ -107,9 +103,36 @@ <h4>Content</h4>
107103

108104

109105

106+
107+
110108
<li class="ComponentList-item"><a href="/component-library/component/testimonial/index.html">Testimonial</a></li>
111109

112110

111+
</ul>
112+
</div>
113+
114+
<div class="CategoryLink">
115+
<h4>Twig</h4>
116+
<ul class="ComponentList">
117+
118+
119+
120+
121+
122+
123+
124+
125+
126+
127+
128+
129+
<li class="ComponentList-item"><a href="/component-library/component/macros/index.html">Macros</a></li>
130+
131+
132+
133+
134+
135+
113136
</ul>
114137
</div>
115138

‎_site/component/blogroll/component.html

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<div itemscope itemtype="https://schema.org/Blog">
2+
<article id="post-<?php the_ID(); ?>" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
3+
<div itemprop="image" itemscope itemtype="http://schema.org/ImageObject">
4+
<img src="https://www.fillmurray.com/100/100" srcset="https://www.fillmurray.com/100/100 1x, https://www.fillmurray.com/200/200 2x" alt="header image" />
5+
<meta itemprop="url" content="https://www.fillmurray.com/100/100" />
6+
<meta itemprop="width" content="100" />
7+
<meta itemprop="height" content="100" />
8+
</div>
9+
<header class="PostHeader">
10+
<h2 class="PostTitle" itemprop="headline"><a href="http://objectiv.co" itemprop="url" rel="bookmark">Blog Post Title</a></h2>
11+
<p>
12+
<strong>Publish Date</strong>:
13+
<span itemprop="datePublished">
14+
<time datetime="2017-06-06" pubdate>June 6, 2017</time>
15+
</span>
16+
</p>
17+
<p>
18+
<strong>Author</strong>:
19+
<span itemprop="author">Wes Cole</span>
20+
</p>
21+
</header>
22+
<div itemprop="description">
23+
<p>This would be the "description" or the excerpt of the blog post content.</p>
24+
<a href="http://objectiv.co/" itemprop="url">Read More... <span class="screen-reader-text">Post Title</span></a>
25+
</div>
26+
</article>
27+
</div>

‎_site/component/blogroll/component.php

+30
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<?php if( have_posts() ): ?>
2+
<div itemscope itemtype="https://schema.org/Blog">
3+
<?php while( have_posts() ): the_post(); ?>
4+
<article id="post-<?php the_ID(); ?>" class="Post" itemscope itemtype="http://schema.org/BlogPosting">
5+
<?php
6+
if ( has_post_thumbnailI() ) {
7+
the_post_thumbnail();
8+
}
9+
?>
10+
<header class="PostHeader">
11+
<?php
12+
the_title( '<h2 class="PostTitle" itemprop="headline"><a href="' . esc_url( get_permalink() ) . '" itemprop="url" rel="bookmark">', '</a></h2>' ); ?>
13+
<p>
14+
<strong><?php esc_html_e( 'Publish Date', 'objectiv' ); ?></strong>:
15+
<span itemprop="datePublished">
16+
<time datetime="<?php echo esc_attr( get_the_time( 'Y-m-d' ) ); ?>" pubdate><?php the_date(); ?></time>
17+
</span>
18+
</p>
19+
<p>
20+
<strong><?php esc_html_e( 'Author', 'objectiv' ); ?></strong>:
21+
<span itemprop="author"><?php the_author_link(); ?></span>
22+
</p>
23+
</header>
24+
<div itemprop="description">
25+
<?php the_excerpt(); ?>
26+
</div>
27+
</article>
28+
<?php endwhile; ?>
29+
</div>
30+
<?php endif; ?>

0 commit comments

Comments
 (0)