Rename classes for consistency
This commit is contained in:
Michael Rose
parent
a572dbaae0
commit
ddb78bf337
|
|
@ -4,14 +4,14 @@
|
|||
|
||||
<div itemscope itemtype="http://schema.org/Person">
|
||||
|
||||
{% if author.avatar contains 'http' %}
|
||||
<img src="{{ author.avatar }}" class="bio-photo" alt="{{ author.name }} bio photo">
|
||||
{% if author.avatar contains "http" %}
|
||||
<img src="{{ author.avatar }}" class="author-avatar" alt="{{ author.name }} photo">
|
||||
{% else %}
|
||||
<img src="{{ author.avatar | prepend: absurl }}" class="bio-photo" alt="{{ author.name }} bio photo">
|
||||
<img src="{{ author.avatar | prepend: absurl }}" class="author-avatar" alt="{{ author.name }} photo">
|
||||
{% endif %}
|
||||
|
||||
<h3 itemprop="name">{{ author.name }}</h3>
|
||||
{% if author.bio %}<p>{{ author.bio }}</p>{% endif %}
|
||||
<h3 itemprop="name" class="author-name">{{ author.name }}</h3>
|
||||
{% if author.bio %}<p class="author-bio">{{ author.bio }}</p>{% endif %}
|
||||
{% if author.email %}
|
||||
<a href="mailto:{{ author.email }}" class="author-social" target="_blank"><i class="fa fa-fw fa-envelope-square"></i> Email</a>
|
||||
{% endif %}
|
||||
|
|
@ -6,7 +6,7 @@
|
|||
{% include head.html %}
|
||||
</head>
|
||||
|
||||
<body class="{{ layout.class }}">
|
||||
<body>
|
||||
|
||||
{% include browser-upgrade.html %}
|
||||
{% include navigation.html %}
|
||||
|
|
@ -14,7 +14,7 @@
|
|||
{% if page.image.feature %}
|
||||
<div class="image-wrap">
|
||||
<img src=
|
||||
{% if page.image.feature contains 'http' %}
|
||||
{% if page.image.feature contains "http" %}
|
||||
"{{ page.image.feature }}"
|
||||
{% else %}
|
||||
"{{ page.image.feature | prepend: "/images/" | prepend: absurl }}"
|
||||
|
|
@ -27,8 +27,8 @@
|
|||
{% endif %}
|
||||
|
||||
<div id="main" role="main">
|
||||
<div class="article-author-side">
|
||||
{% include author-bio.html %}
|
||||
<div class="author-profile">
|
||||
{% include author-profile.html %}
|
||||
</div>
|
||||
{{ content }}
|
||||
</div><!-- /#main -->
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ layout: default
|
|||
|
||||
{% include absolute-url.liquid %}
|
||||
|
||||
<div id="index">
|
||||
<div class="archive">
|
||||
<h3><a href="{{ absurl }}/posts/">Recent Posts</a></h3>
|
||||
{% for post in site.posts limit:5 %}
|
||||
<article>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ layout: default
|
|||
|
||||
{% include absolute-url.liquid %}
|
||||
|
||||
<div id="index">
|
||||
<div class="archive">
|
||||
<h1>{{ page.title }}</h1>
|
||||
{% capture written_year %}'None'{% endcapture %}
|
||||
{% for post in site.posts %}
|
||||
|
|
@ -22,4 +22,4 @@ layout: default
|
|||
{% endif %}
|
||||
</article>
|
||||
{% endfor %}
|
||||
</div><!-- /#index -->
|
||||
</div><!-- /.archive -->
|
||||
121
_sass/page.scss
121
_sass/page.scss
|
|
@ -247,8 +247,8 @@ $button-size: 1.5rem;
|
|||
}
|
||||
}
|
||||
|
||||
/* Index listing specific styling */
|
||||
#index {
|
||||
/* Archive listing specific styling */
|
||||
.archive {
|
||||
@include container;
|
||||
@include grid(12,10);
|
||||
@include prefix(12,1);
|
||||
|
|
@ -342,23 +342,47 @@ $button-size: 1.5rem;
|
|||
clear: both;
|
||||
font-size: 80%;
|
||||
}
|
||||
.article-author-side,
|
||||
.article-author-bottom {
|
||||
h3 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
p {
|
||||
font-size: 80%;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* Author profile */
|
||||
.author-profile {
|
||||
display: none;
|
||||
a, a:hover {
|
||||
border-bottom: 0 solid transparent;
|
||||
}
|
||||
@media #{$small} {
|
||||
display: block;
|
||||
@include grid(12,2);
|
||||
@include prefix(12,0.5);
|
||||
@include suffix(12,0.5);
|
||||
}
|
||||
@media #{$x-large} {
|
||||
@include grid(12,1.5);
|
||||
@include prefix(12,2);
|
||||
}
|
||||
}
|
||||
|
||||
.author-name {
|
||||
margin-bottom: 0;
|
||||
@media #{$small} {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.author-bio {
|
||||
font-size: 80%;
|
||||
font-style: italic;
|
||||
@media #{$small} {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.author-avatar {
|
||||
max-width: 110px;
|
||||
@include rounded(150px);
|
||||
}
|
||||
|
||||
/* Default social media links in author sidebar */
|
||||
.author-social {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
@include font-rem(14);
|
||||
color: $black;
|
||||
|
|
@ -376,72 +400,17 @@ $button-size: 1.5rem;
|
|||
}
|
||||
}
|
||||
|
||||
/* Author sidebar */
|
||||
.article-author-side {
|
||||
display: none;
|
||||
.bio-photo {
|
||||
max-width: 110px;
|
||||
@include rounded(150px);
|
||||
}
|
||||
@media #{$small} {
|
||||
display: block;
|
||||
@include grid(12,2);
|
||||
@include prefix(12,0.5);
|
||||
@include suffix(12,0.5);
|
||||
h3,
|
||||
p,
|
||||
.author-social {
|
||||
display: block;
|
||||
max-width: 125px;
|
||||
}
|
||||
h3 {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
p {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.author-social {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
@media #{$large} {
|
||||
h3,
|
||||
.bio-photo,
|
||||
p,
|
||||
.author-social {
|
||||
max-width: 150px;
|
||||
}
|
||||
}
|
||||
@media #{$x-large} {
|
||||
@include grid(12,1.5);
|
||||
@include prefix(12,2);
|
||||
}
|
||||
@media #{$small} {
|
||||
display: block;
|
||||
max-width: 125px;
|
||||
}
|
||||
|
||||
/* Author module - mobile only */
|
||||
.article-author-bottom {
|
||||
margin-bottom: 1em;
|
||||
@media #{$small} {
|
||||
display: none;
|
||||
}
|
||||
.bio-photo {
|
||||
float: left;
|
||||
margin-right: 25px;
|
||||
max-width: 100px;
|
||||
@include rounded(150px);
|
||||
}
|
||||
@media #{$large} {
|
||||
.author-name,
|
||||
.author-avatar,
|
||||
.author-bio,
|
||||
.author-social {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
@media #{$large} {
|
||||
h3,
|
||||
.bio-photo,
|
||||
p,
|
||||
.author-social {
|
||||
max-width: 150px;
|
||||
}
|
||||
max-width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue