Skip to content

Commit 0765d2c

Browse files
r-brownr-brown
committed
Merge pull request #2 from Labs64/BRA-WEB-154
Bra web 154
2 parents bbdf5aa + ad85651 commit 0765d2c

File tree

2 files changed

+159
-42
lines changed

2 files changed

+159
-42
lines changed

‎_layouts/post.html

Lines changed: 71 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,53 @@ <h1 class="post-title">{{ page.title }}</h1>
2929
</ul>
3030
</div>
3131
</header>
32-
<article class="post-content">
32+
33+
34+
<div class="row">
35+
<div class="col-md-8 NL_post">
36+
<article class="post-content">
37+
{% if page.image.url %}
38+
{% unless page.image.hide %}
39+
{% if page.image.width %}
40+
{% assign image_width = page.image.width %}
41+
{% else %}
42+
{% assign image_width = '100%' %}
43+
{% endif %}
44+
<img src="{{ page.image.url }}" alt="{{ page.title }}" class="blog-thumbnail" width="{{ image_width }}">
45+
{% endunless %}
46+
{% endif %}
47+
{{ content }}
48+
</article>
49+
50+
<div class="NL_share_icons">{% include addthis.html %}</div>
51+
<div class="NL_disqus">{% include disqus.html %}</div>
52+
</div>
53+
<div class="col-md-3 col-md-offset-1 NL_other_posts">
54+
<div class="NL_previous_post">
55+
{% if page.previous.url %}
56+
<h4>Read previous article: </h4>
57+
<a class="prev" href="{{page.previous.url}}">
58+
<img src="{{ page.previous.image.url }}" alt="{{ page.previous.title }}" class="NL_post_img NL_img_hover" >
59+
<p><span>{{page.previous.title}}</span></p>
60+
</a>
61+
{% endif %}
62+
</div>
63+
64+
<div class="NL_next_post">
65+
{% if page.next.url %}
66+
<h4>Read next article: </h4>
67+
<a class="next" href="{{page.next.url}}">
68+
<img src="{{ page.next.image.url }}" alt="{{ page.next.title }}" class="NL_post_img NL_img_hover" >
69+
<p><span>{{page.next.title}}</span></p>
70+
</a>
71+
{% endif %}
72+
</div>
73+
</div>
74+
</div>
75+
76+
77+
78+
<!--<article class="post-content">
3379
{% if page.image.url %}
3480
{% if page.image.width %}
3581
{% assign image_width = page.image.width %}
@@ -40,6 +86,28 @@ <h1 class="post-title">{{ page.title }}</h1>
4086
{% endif %}
4187
{{ content }}
4288
</article>
89+
4390
{% include addthis.html %}
44-
{% include disqus.html %}
45-
</div>
91+
<div class="NL_disqus">{% include disqus.html %}</div>
92+
93+
<div class="NL_page_navigation">
94+
<h3>Read more:</h3>
95+
<div class="NL_previous_post">
96+
{% if page.previous.url %}
97+
<a class="prev" href="{{page.previous.url}}">
98+
<img src="{{ page.previous.image.url }}" alt="{{ page.previous.title }}" >
99+
<p>{{page.previous.title}}</p>
100+
</a>
101+
{% endif %}
102+
</div>
103+
<div class="NL_next_post">
104+
{% if page.next.url %}
105+
<a class="next" href="{{page.next.url}}">
106+
<img src="{{ page.next.image.url }}" alt="{{ page.next.title }}" >
107+
<p>{{page.next.title}}</p>
108+
</a>
109+
{% endif %}
110+
</div>
111+
</div>
112+
<div class="row"/>
113+
</div> -->

‎css/netlicensing.css

Lines changed: 88 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -112,33 +112,36 @@ p.blog_img_credit {
112112
margin: 5px 5% 30px 0;
113113
}
114114

115-
.post img.blog-center {
116-
width: 100%;
115+
.NL_post {
116+
padding: 0;
117+
}
118+
119+
.NL_other_posts > h4 {
120+
margin-top: 0;
121+
}
122+
123+
.blog-center {
124+
width: auto;
125+
max-width: 100%;
126+
margin: 15px auto;
117127
clear: both;
118128
display: block;
119-
margin-left: auto;
120-
margin-right: auto;
121129
text-align: center;
122130
}
123131

124-
.post img.blog-left {
125-
width: 100%;
132+
.NL_disqus {
133+
margin-top: 40px;
126134
}
127135

128-
.post img.blog-right {
129-
width: 100%;
136+
.post-content > table,
137+
.post-content > pre,
138+
.post-content > ol {
139+
margin: 15px 0;
130140
}
131141

132-
.post-content > p,
133-
.post-content > h3,
134-
.post-content > ul,
135-
.post-content > blockquote,
136-
.post-content > h2,
137-
.post-content > table {
138-
display: block;
139-
width: 65%;
140-
float: right;
141-
list-style-type: square;
142+
.post-content > table tr td,
143+
.post-content > table tr th {
144+
padding-left: 15px;
142145
}
143146

144147
.post-content ul li {
@@ -154,22 +157,71 @@ p.blog_img_credit {
154157
color: #3f4549;
155158
}
156159

157-
.post-content > div {
158-
width: 65%;
159-
float: right;
160-
}
160+
blockquote {
161+
border-left: 3px solid #f08b53;
162+
}
161163

162-
.post-content > div a img {
163-
margin: 20px 0;
164+
.NL_share_icons {
165+
padding: 30px 0 0 0;
166+
}
167+
168+
.NL_previous_post,
169+
.NL_next_post {
170+
display: block;
171+
margin-bottom: 70px;
164172
}
165173

166-
.post-content > img,
167-
.addthis_sharing_toolbox {
168-
width: 30%;
174+
.NL_previous_post a,
175+
.NL_next_post a {
176+
border-bottom: none;
169177
}
170178

171-
blockquote {
172-
border-left: 3px solid #f08b53;
179+
.NL_previous_post a,
180+
.NL_next_post a {
181+
cursor: pointer;
182+
}
183+
184+
img.NL_post_img {
185+
width: 100%;
186+
}
187+
188+
img.NL_img_hover {
189+
width: 100%;
190+
-webkit-transition: all 1s ease;
191+
-moz-transition: all 1s ease;
192+
-o-transition: all 1s ease;
193+
-ms-transition: all 1s ease;
194+
transition: all 1s ease;
195+
196+
}
197+
.NL_previous_post a:hover img,
198+
.NL_next_post a:hover img {
199+
-webkit-filter: grayscale(30%);
200+
}
201+
202+
.NL_previous_post p,
203+
.NL_next_post p {
204+
display: block;
205+
text-align: center;
206+
padding: 15px 10px;
207+
margin: 0;
208+
background-color: #fafafa;
209+
}
210+
211+
.NL_previous_post p span,
212+
.NL_next_post p span {
213+
color: #853E29;
214+
border-bottom: 1px dotted #853E29;
215+
-webkit-transition: all 1s ease;
216+
-moz-transition: all 1s ease;
217+
-o-transition: all 1s ease;
218+
-ms-transition: all 1s ease;
219+
transition: all 1s ease;
220+
}
221+
222+
.NL_previous_post a:hover p span,
223+
.NL_next_post a:hover p span {
224+
border-bottom-color: #fafafa;
173225
}
174226

175227
/*---------- Blog Search -----------*/
@@ -1664,16 +1716,9 @@ a.NL_pricing_tooltip {
16641716
margin-top: 50px;
16651717
}
16661718

1667-
.post-content p,
1668-
.post-content h3,
1669-
.post-content ul,
1670-
.post-content > div,
1671-
.post-content > img,
1672-
.addthis_sharing_toolbox,
1673-
.post-content > blockquote,
1674-
.post-content > h2,
1675-
.post-content > table {
1676-
width: 100%;
1719+
.NL_previous_post,
1720+
.NL_next_post {
1721+
margin-bottom: 40px;
16771722
}
16781723
}
16791724

@@ -1749,6 +1794,10 @@ a.NL_pricing_tooltip {
17491794
margin-right: 0;
17501795
margin-bottom: 15px;
17511796
}
1797+
1798+
.NL_other_posts > h4 {
1799+
margin-top: 40px;
1800+
}
17521801
}
17531802

17541803
@media screen and (max-width: 479px) {

0 commit comments

Comments
 (0)