Skip to content

Commit

Permalink
Correct image credit link display bug. Fixes barryclark#13
Browse files Browse the repository at this point in the history
  • Loading branch information
@mmistakes
mmistakes committed Feb 26, 2014
1 parent a6a884c commit 75e72eb
Show file tree
Hide file tree
Showing 7 changed files with 41 additions and 83 deletions.
5 changes: 3 additions & 2 deletions _layouts/page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,9 @@

{% if page.image.feature %}
<div class="entry-header">
<div class="entry-image"><img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
<div class="entry-image">
<img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
</div><!-- /.entry-image -->
</div><!-- /.entry-header -->
{% endif %}
Expand Down
5 changes: 3 additions & 2 deletions _layouts/post-index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,10 @@
{% include navigation.html %}

<div class="entry-header">
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
{% if page.image.feature %}
<div class="entry-image"><img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
<div class="entry-image">
<img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
</div><!-- /.entry-image -->
{% endif %}
<div class="header-title">
Expand Down
5 changes: 3 additions & 2 deletions _layouts/post.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,9 @@

{% if page.image.feature %}
<div class="entry-header">
<div class="entry-image"><img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
{% if page.image.credit %}<div class="image-credit">Image source: <a href="{{ page.image.creditlink }}">{{ page.image.credit }}</a></div><!-- /.image-credit -->{% endif %}
<div class="entry-image">
<img src="{{ site.url }}/images/{{ page.image.feature }}" alt="{{ page.title }}">
</div><!-- /.entry-image -->
</div><!-- /.entry-header -->
{% endif %}
Expand Down
63 changes: 17 additions & 46 deletions assets/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -332,50 +332,6 @@ figcaption {
color: #3c3c3c;
}

.image-credit {
max-width: 440px;
padding-top: 5px;
padding-right: 20px;
padding-left: 20px;
margin: 0 auto;
font-size: 14px;
font-size: 0.875rem;
line-height: 1.8571;
line-height: 1.3;
color: #6f6f6f;
text-align: right;
*zoom: 1;
}

.image-credit:before,
.image-credit:after {
display: table;
line-height: 0;
content: "";
}

.image-credit:after {
clear: both;
}

@media only screen and (min-width: 48em) {
.image-credit {
max-width: 760px;
padding-right: 60px;
padding-left: 60px;
}
}

@media only screen and (min-width: 62.5em) {
.image-credit {
max-width: 960px;
}
}

.image-credit a {
color: #6f6f6f;
}

.notice {
padding: .5em 1em;
margin-top: 1.5em;
Expand Down Expand Up @@ -3833,6 +3789,7 @@ body {
}

.entry-header {
position: relative;
width: 100%;
overflow: hidden;
}
Expand Down Expand Up @@ -3884,7 +3841,7 @@ body {
top: 0;
display: table;
width: 100%;
height: 440px;
height: 400px;
margin-top: 0;
overflow: hidden;
}
Expand Down Expand Up @@ -3930,7 +3887,7 @@ body {
left: -50%;
width: 200%;
height: 200%;
min-height: 440px;
min-height: 400px;
overflow: hidden;
}

Expand Down Expand Up @@ -3960,7 +3917,9 @@ body {
right: 0;
bottom: 0;
z-index: 10;
max-width: 440px;
padding: 10px 15px;
margin: 0 auto;
font-size: 12px;
font-size: 0.75rem;
color: #ffffff;
Expand All @@ -3983,6 +3942,18 @@ body {
background-clip: padding-box;
}

@media only screen and (min-width: 48em) {
.image-credit {
max-width: 760px;
}
}

@media only screen and (min-width: 62.5em) {
.image-credit {
max-width: 960px;
}
}

.image-credit a {
color: #ffffff;
text-decoration: none;
Expand Down
4 changes: 2 additions & 2 deletions assets/css/main.min.css
View file

Large diffs are not rendered by default.

16 changes: 13 additions & 3 deletions assets/less/page.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ body {
.entry-header {
width: 100%;
overflow: hidden;
position: relative;
}
.header-title {
text-align: center;
Expand Down Expand Up @@ -60,7 +61,7 @@ body {
display: table;
margin-top: 0;
width: 100%;
height: 440px;
height: 400px;
overflow: hidden;
.header-title-wrap {
display: table-cell;
Expand Down Expand Up @@ -97,7 +98,7 @@ body {
left: -50%;
width: 200%;
height: 200%;
min-height: 440px;
min-height: 400px;
overflow: hidden;
&:after {
content: '';
Expand All @@ -119,17 +120,26 @@ body {
min-height: 50%;
}
}
// Feature Image Caption
.image-credit {
position: absolute;
bottom: 0;
right: 0;
margin: 0 auto;
max-width: 440px;
padding: 10px 15px;
color: @white;
background-color: fade(@base-color,50);
color: @white;
.font-rem(12);
text-align: right;
.border-radius(3px,0,0,3px);
z-index: 10;
@media @medium {
max-width: 760px;
}
@media @large {
max-width: 960px;
}
a {
color: @white;
text-decoration: none;
Expand Down
26 changes: 0 additions & 26 deletions assets/less/typography.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -50,32 +50,6 @@ figcaption {
color: lighten(@text-color, 10);
}

// Feature Image Caption
// --------------------------------------------------
.image-credit {
margin: 0 auto;
max-width: 440px;
padding-top: 5px;
padding-right: 20px;
padding-left: 20px;
text-align: right;
.font(14);
line-height: 1.3;
color: lighten(@text-color, 30);
.clearfix();
@media @medium {
max-width: 760px;
padding-right: 60px;
padding-left: 60px;
}
@media @large {
max-width: 960px;
}
a {
color: lighten(@text-color, 30);
}
}

// Note text
// --------------------------------------------------
.notice {
Expand Down

0 comments on commit 75e72eb

Please sign in to comment.