Skip to content

Commit

Permalink
feat: author page is ready
Browse files Browse the repository at this point in the history
  • Loading branch information
@bigbrozer
bigbrozer committed May 1, 2023
1 parent 49dd96c commit aad752a
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 164 deletions.
173 changes: 24 additions & 149 deletions author.hbs
View file
Original file line number Diff line number Diff line change
@@ -1,152 +1,27 @@
{{! Author page; this file renders a tag page containing a list of the latest posts }}
{{! Author page }}

{{> head}}
{{> navbar}}
<main>

{{! indicates the author's context }}
{{#author}}

{{! author featured image }}
{{#featuredImage}}
{{! checks if an image exists }}
{{#if url}}
<figure>
<img
src="{{url}}"
{{! checks if the Responsive Images option (located in Site Settings -> Website Speed) is enabled }}
{{#if @config.site.responsiveImages}}
{{responsiveImageAttributes 'authorImage' srcset sizes}}
{{/if}}
{{! generates a native loading attribute; if the Media Lazy Load option (located in Site Settings -> Website Speed) is disabled, the loading attribute is not generated }}
{{lazyload "lazy"}}
height="{{height}}"
width="{{width}}"
alt="{{alt}}">

{{! checks if a caption and credits exist }}
{{#checkIfAny caption credits}}
<figcaption>
{{caption}}
{{credits}}
</figcaption>
{{/checkIfAny}}
{{! /checks if a caption and credits exist }}

</figure>
{{/if}}
{{! /checks if an image exists }}
{{/featuredImage}}
{{! /author featured image }}

{{! check if an author avatar exists }}
{{#if avatar}}
<img
src="{{avatarImage.url}}"
{{ lazyload "eager" }}
alt="{{avatarImage.alt}}"
height="{{avatarImage.height}}"
width="{{avatarImage.width}}">
{{/if}}
{{! /check if an author avatar exists }}

<h1>
{{name}}
<sup>({{postsNumber}})</sup>
</h1>

{{! check if an author description exists }}
{{#if description}}
<p>{{description}}</p>
{{/if}}
{{! /check if a author description exists }}

{{! check if an author email address exists }}
{{#if email}}
<p>{{email}}</p>
{{/if}}
{{! /check if a author email address exists }}

{{! check if an author website URL exists }}
{{#if website}}
<p>{{website}}</p>
{{/if}}
{{! /check if a author website URL exists }}

{{/author}}
{{! /indicates the author's context }}


{{! loop that generates a list of posts }}
{{#each posts}}
<article>

{{! featured image }}
{{#featuredImage}}
{{! checks if an image exists }}
{{#if url}}
<img
src="{{url}}"
{{! checks if the Responsive Images option (located in Site Settings -> Website Speed) is enabled }}
{{#if @config.site.responsiveImages}}
{{responsiveImageAttributes 'featuredImage' srcset sizes}}
{{/if}}
{{! generates a native loading attribute; if the Media Lazy Load option (located in Site Settings -> Website Speed) is disabled, the loading attribute is not generated }}
{{lazyload "lazy"}}
height="{{height}}"
width="{{width}}"
alt="{{alt}}">
{{/if}}
{{! /checks if an image exists }}
{{/featuredImage}}
{{! /featured image }}

{{! post title }}
<h2>
<a href="{{url}}">{{title}}</a>
</h2>
{{! /post title }}

{{! post creation date }}
<time datetime="{{date createdAt 'YYYY-MM-DDTHH:mm'}}">
{{date createdAt}}
</time>
{{! /post creation date }}

{{! post author }}
{{#author}}
<img
src="{{avatarImage.url}}"
{{lazyload "lazy"}}
alt="{{avatarImage.alt}}"
height="{{avatarImage.height}}"
width="{{avatarImage.width}}">
<a href="{{url}}">{{name}}</a>
{{/author}}
{{! /post author }}

{{! main tag - if not selected, the first tag in the list of all tags
will be displayed }}
{{#if mainTag}}
<a href="{{mainTag.url}}">{{mainTag.name}}</a>
{{/if}}
{{! /main tag }}

{{! post excerpt - the Custom excerpt is generated when the Read More button is used when editing a post }}
{{#if hasCustomExcerpt}}
{{{ excerpt }}}
{{else}}
<p>{{{ excerpt }}}</p>
{{/if}}
{{! /post excerpt }}

</article>
{{/each}}
{{! /loop that generates a list of posts }}

</main>
<aside>
{{> sidebar}}
</aside>

{{> pagination}}
{{> footer}}
{{#author}}
<div class="uk-section uk-background-cover uk-background-top-right" style="background-image: url({{asset "images/about-me-image.png"}})" uk-scrollspy="cls: uk-animation-fade">
<a id="about-me"></a>

<div
class="uk-container uk-container-expand"
uk-height-match=".uk-overlay-primary > div">
<div class="uk-grid-large uk-child-width-1-2@m" uk-grid>
<div>
<div class="uk-padding uk-overlay-primary" uk-scrollspy="cls: uk-animation-slide-left; delay: 500">
<h2 class="uk-heading-divider">{{name}}</h2>

<div class="uk-hidden@m">{{{description}}}</div>
<div class="uk-visible@m uk-text-large">{{{description}}}</div>
</div>
</div>
</div>
</div>
</div>
{{/author}}

{{> footer}}
21 changes: 6 additions & 15 deletions index.hbs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,14 +8,17 @@
<div class="uk-section uk-background-cover uk-background-top-right" style="background-image: url({{asset "images/about-me-image.png"}})" uk-scrollspy="cls: uk-animation-fade">
<a id="about-me"></a>

<div class="uk-container uk-container-expand uk-height-large">
<div class="uk-grid-large uk-child-width-1-2@m" uk-grid>
<div class="uk-container uk-container-expand uk-height-large" uk-height-match=".uk-overlay-primary > div" uk-height-viewport="min-height: 600">
<div class="uk-grid-large uk-child-width-1-2@s" uk-grid>
<div>
<div class="uk-padding uk-overlay-primary" uk-scrollspy="cls: uk-animation-slide-left; delay: 500">
<h2 class="uk-heading-divider">{{@config.custom.heroTitle}}</h2>

<div class="uk-hidden@m">{{{@config.custom.heroBody}}}</div>
<div class="uk-visible@m uk-text-large">{{{@config.custom.heroBody}}}</div>
{{#getAuthor 1}}
<a href="{{url}}" class="uk-button uk-button-text">Read more</a>
{{/getAuthor}}
</div>
</div>
</div>
Expand All @@ -30,7 +33,7 @@
<div class="uk-container uk-dark" uk-scrollspy="cls: uk-animation-slide-right">
<h2 class="uk-heading-divider">Readings</h2>

<div class="uk-grid-small uk-child-width-1-3@s" uk-grid uk-height-match=".uk-card-body > p">
<div class="uk-grid-small uk-child-width-1-3@m" uk-grid uk-height-match=".uk-card-body > p">
{{#each posts}}
<div uk-scrollspy="cls: uk-animation-fade">
<div class="uk-card uk-card-secondary">
Expand Down Expand Up @@ -69,15 +72,3 @@
{{! /Posts }}

{{> footer}}

<!--
<main class="uk-container uk-width-large">
<div>
<aside>
{{> sidebar}}
</aside>
{{> pagination}}
</div>
</main>
-->

0 comments on commit aad752a

Please sign in to comment.