yann/liebling
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Bugfixes and changes to improve speed and accessibility 💪🏼

Browse source
This commit is contained in:
Eduardo 2019-03-17 17:16:17 +01:00
parent 5c043d3d5e
commit 6b248c88cd
13 changed files with 61 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/css/app.css
View file

File diff suppressed because one or more lines are too long

2
assets/js/app.js
View file

File diff suppressed because one or more lines are too long

2
assets/js/home.js
View file

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[3],{36:function(n,t,s){n.exports=s(37)},37:function(n,t,s){"use strict";s.r(t);var r=s(0),o=s.n(r);s(4);o()(document).ready(function(){var n=o()(".js-featured-articles");n.length>0&&n.slick({arrows:!0,infinite:!0,prevArrow:'<button class="m-icon-button in-featured-articles slick-prev"><span class="icon-arrow-left"></span></button>',nextArrow:'<button class="m-icon-button in-featured-articles slick-next"><span class="icon-arrow-right"></span></button>',mobileFirst:!0})})}},[[36,0,1]]]); (window.webpackJsonp=window.webpackJsonp||[]).push([[3],{36:function(n,t,r){n.exports=r(37)},37:function(n,t,r){"use strict";r.r(t);var a=r(0),s=r.n(a);r(4);s()(document).ready(function(){var n=s()(".js-featured-articles");n.length>0&&n.slick({arrows:!0,infinite:!0,prevArrow:'<button class="m-icon-button in-featured-articles slick-prev" aria-label="Previous"><span class="icon-arrow-left"></span></button>',nextArrow:'<button class="m-icon-button in-featured-articles slick-next" aria-label="Next"><span class="icon-arrow-right"></span></button>',mobileFirst:!0})})}},[[36,0,1]]]);

2
assets/js/page.js
View file

File diff suppressed because one or more lines are too long

2
assets/js/post.js
View file

File diff suppressed because one or more lines are too long

6
author.hbs
View file

@ -20,21 +20,21 @@
<ul class="m-hero-social"> <ul class="m-hero-social">
{{#if website}} {{#if website}}
<li> <li>
<a href="{{website}}" target="_blank" rel="noopener"> <a href="{{website}}" target="_blank" rel="noopener" aria-label="Website">
<span class="icon-globe"></span> <span class="icon-globe"></span>
</a> </a>
</li> </li>
{{/if}} {{/if}}
{{#if facebook}} {{#if facebook}}
<li> <li>
<a href="https://facebook.com/{{facebook}}" target="_blank" rel="noopener"> <a href="https://facebook.com/{{facebook}}" target="_blank" rel="noopener" aria-label="Facebook">
<span class="icon-facebook"></span> <span class="icon-facebook"></span>
</a> </a>
</li> </li>
{{/if}} {{/if}}
{{#if twitter}} {{#if twitter}}
<li> <li>
<a href="https://twitter.com/{{twitter}}" target="_blank" rel="noopener"> <a href="https://twitter.com/{{twitter}}" target="_blank" rel="noopener" aria-label="Twitter">
<span class="icon-twitter"></span> <span class="icon-twitter"></span>
</a> </a>
</li> </li>

16
default.hbs
View file

@ -11,15 +11,29 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
{{!-- Styles'n'Scripts --}} {{!-- Styles'n'Scripts --}}
<link rel="stylesheet" type="text/css" href="{{asset "css/app.css"}}" /> <link rel="stylesheet" type="text/css" href="{{asset "css/app.css"}}" media="screen" />
{{{block "herobackground"}}} {{{block "herobackground"}}}
{{!-- This tag outputs SEO meta+structured data and other important settings --}} {{!-- This tag outputs SEO meta+structured data and other important settings --}}
{{ghost_head}} {{ghost_head}}
<script> <script>
const ghostHost = "{{@site.url}}" const ghostHost = "{{@site.url}}"
</script> </script>
<script>
WebFontConfig = {
google: { families: ['Source+Sans+Pro:400,600,700'] }
};
(function (d) {
var wf = d.createElement('script'), s = d.scripts[0];
wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js';
wf.async = true;
s.parentNode.insertBefore(wf, s);
})(document);
</script>
</head> </head>
<body class="{{body_class}}"> <body class="{{body_class}}">
{{!-- All the main content gets inserted here, index.hbs, post.hbs, etc --}} {{!-- All the main content gets inserted here, index.hbs, post.hbs, etc --}}

13
index.hbs
View file

@ -22,9 +22,9 @@
{{#get "posts" filter="featured:true" include="authors,tags" limit="5" as |featured|}} {{#get "posts" filter="featured:true" include="authors,tags" limit="5" as |featured|}}
{{#if featured}} {{#if featured}}
<div class="m-featured-slider"> <div class="m-featured-slider">
<ul class="m-featured-slider__list js-featured-articles"> <div class="m-featured-slider__list js-featured-articles">
{{#foreach featured}} {{#foreach featured}}
<li class="m-featured-slider__list__item"> <div class="m-featured-slider__list__item">
{{#if feature_image}} {{#if feature_image}}
<article class="m-featured-article"> <article class="m-featured-article">
{{else}} {{else}}
@ -36,8 +36,7 @@
{{/if}} {{/if}}
</div> </div>
<div class="m-featured-article__meta"> <div class="m-featured-article__meta">
<a href="{{primary_author.url}}" class="m-featured-article__author js-tooltip" <a href="{{primary_author.url}}" class="m-featured-article__author js-tooltip" aria-label="Authors" data-tippy-content="Posted by {{primary_author.name}} {{authors autolink="false" from="2" prefix="<br> Among with " separator=" , "}}">
data-tippy-content="Posted by {{primary_author.name}} {{authors autolink="false" from="2" prefix="<br> Among with " separator=" , "}}">
{{#if primary_author.profile_image}} {{#if primary_author.profile_image}}
<div style="background-image: url({{primary_author.profile_image}});"></div> <div style="background-image: url({{primary_author.profile_image}});"></div>
{{else}} {{else}}
@ -55,15 +54,15 @@
<a href="{{url}}" class="m-featured-article__content"> <a href="{{url}}" class="m-featured-article__content">
<h1 class="m-featured-article__title">{{title}}</h1> <h1 class="m-featured-article__title">{{title}}</h1>
<div class="m-featured-article__timestamp"> <div class="m-featured-article__timestamp">
<time datetime="{{published_at}}">{{date published_at timeago="true"}}</time> <span>{{date published_at timeago="true"}}</span>
<span>&bull;</span> <span>&bull;</span>
<span>{{reading_time}}</span> <span>{{reading_time}}</span>
</div> </div>
</a> </a>
</article> </article>
</li> </div>
{{/foreach}} {{/foreach}}
</ul> </div>
</div> </div>
{{/if}} {{/if}}
{{/get}} {{/get}}

8
partials/loop.hbs
View file

@ -1,6 +1,6 @@
{{#foreach posts}} {{#foreach posts}}
{{#is "post"}} {{#is "post"}}
<li class="m-recommended-slider__item"> <div class="m-recommended-slider__item">
{{/is}} {{/is}}
{{#if feature_image}} {{#if feature_image}}
<article class="m-article-card {{post_class}}"> <article class="m-article-card {{post_class}}">
@ -10,7 +10,7 @@
<div class="m-article-card__picture"> <div class="m-article-card__picture">
{{/if}} {{/if}}
<a href="{{url}}" class="m-article-card__picture-link" aria-label="Article"></a> <a href="{{url}}" class="m-article-card__picture-link" aria-label="Article"></a>
<a href="{{primary_author.url}}" class="m-article-card__author js-tooltip" data-tippy-content="Posted by {{primary_author.name}} {{authors autolink="false" from="2" prefix="<br>Among with " separator=" , "}}"> <a href="{{primary_author.url}}" class="m-article-card__author js-tooltip" aria-label="Authors" data-tippy-content="Posted by {{primary_author.name}} {{authors autolink="false" from="2" prefix="<br>Among with " separator=" , "}}">
{{#if primary_author.profile_image}} {{#if primary_author.profile_image}}
<div style="background-image: url({{primary_author.profile_image}});"></div> <div style="background-image: url({{primary_author.profile_image}});"></div>
{{else}} {{else}}
@ -34,7 +34,7 @@
<h2 class="m-article-card__title">{{title}}</h2> <h2 class="m-article-card__title">{{title}}</h2>
</div> </div>
<div class="m-article-card__timestamp"> <div class="m-article-card__timestamp">
<time datetime="{{published_at}}">{{date published_at timeago="true"}}</time> <span>{{date published_at timeago="true"}}</span>
<span>&bull;</span> <span>&bull;</span>
<span>{{reading_time}}</span> <span>{{reading_time}}</span>
</div> </div>
@ -42,7 +42,7 @@
</div> </div>
</article> </article>
{{#is "post"}} {{#is "post"}}
</li> </div>
{{/is}} {{/is}}
{{else}} {{else}}
<header class="m-heading"> <header class="m-heading">

2
partials/search.hbs
View file

@ -6,7 +6,7 @@
<form class="m-search__form"> <form class="m-search__form">
<fieldset> <fieldset>
<span class="icon-search m-search-icon"></span> <span class="icon-search m-search-icon"></span>
<input type="text" class="m-input in-search js-input-search" placeholder="Type to search"> <input type="text" class="m-input in-search js-input-search" placeholder="Type to search" aria-label="Type to search">
</fieldset> </fieldset>
</form> </form>
<div class="js-search-results"></div> <div class="js-search-results"></div>

1
partials/subscribe_form.hbs
View file

@ -2,6 +2,7 @@
{{hidden}} {{hidden}}
<fieldset> <fieldset>
<label for="{{input_id}}" class="sr-only">{{placeholder}}</label>
{{input_email id=input_id class=input_class placeholder=placeholder value=email autofocus=autofocus}} {{input_email id=input_id class=input_class placeholder=placeholder value=email autofocus=autofocus}}
</fieldset> </fieldset>
<button id="{{button_id}}" class="{{button_class}}" type="submit">Subscribe</button> <button id="{{button_id}}" class="{{button_class}}" type="submit">Subscribe</button>

35
post.hbs
View file

@ -12,8 +12,12 @@
<article> <article>
<div class="l-content"> <div class="l-content">
{{#post}} {{#post}}
<div class="l-wrapper in-post js-wrapper-aos" data-aos="fade-up" data-aos-delay="300"> <div class="l-wrapper in-post js-aos-wrapper" data-aos="fade-up" data-aos-delay="300">
<div class="l-post-content js-progress-content"> {{#if @labs.subscribers}}
<div class="l-post-content has-subscribe-form js-progress-content">
{{else}}
<div class="l-post-content js-progress-content"></div>
{{/if}}
<header class="m-heading"> <header class="m-heading">
<h1 class="m-heading__title in-post">{{title}}</h1> <h1 class="m-heading__title in-post">{{title}}</h1>
<div class="m-heading__meta"> <div class="m-heading__meta">
@ -21,22 +25,22 @@
<a href="{{primary_tag.url}}" class="m-heading__meta__tag">{{primary_tag.name}}</a> <a href="{{primary_tag.url}}" class="m-heading__meta__tag">{{primary_tag.name}}</a>
<span class="m-heading__meta__divider">&bull;</span> <span class="m-heading__meta__divider">&bull;</span>
{{/if}} {{/if}}
<time class="m-heading__meta__time">{{date published_at}}</time> <span class="m-heading__meta__time">{{date published_at}}</span>
</div> </div>
</header> </header>
<div class="pos-relative js-post-content"> <div class="pos-relative js-post-content">
<div class="m-share"> <div class="m-share">
<div class="m-share__content js-sticky"> <div class="m-share__content js-sticky">
<a href="#" class="m-icon-button filled in-share"> <a href="#" class="m-icon-button filled in-share" aria-label="Facebook">
<span class="icon-facebook"></span> <span class="icon-facebook"></span>
</a> </a>
<a href="#" class="m-icon-button filled in-share"> <a href="#" class="m-icon-button filled in-share" aria-label="Twitter">
<span class="icon-twitter"></span> <span class="icon-twitter"></span>
</a> </a>
<button class="m-icon-button filled in-share progress js-scrolltop"> <button class="m-icon-button filled in-share progress js-scrolltop" aria-label="Scroll to top">
<span class="icon-arrow-top"></span> <span class="icon-arrow-top"></span>
<svg> <svg>
<circle class="progress-ring__circle js-progress" stroke="#04aeee" fill="transparent" /> <circle class="progress-ring__circle js-progress" stroke="#04aeee" fill="transparent" r="0" />
</svg> </svg>
</button> </button>
</div> </div>
@ -45,6 +49,7 @@
</div> </div>
</div> </div>
</div> </div>
{{#if @labs.subscribers}}
<section class="m-subscribe-section"> <section class="m-subscribe-section">
<div class="l-wrapper in-post"> <div class="l-wrapper in-post">
<div class="m-subscribe-section__content"> <div class="m-subscribe-section__content">
@ -56,8 +61,11 @@
</div> </div>
<div class="m-subscribe-section__form"> <div class="m-subscribe-section__form">
{{subscribe_form {{subscribe_form
form_id="subscribe-form"
form_class="m-subscribe-section__form" form_class="m-subscribe-section__form"
input_id="subscribe_input"
input_class="m-input in-subscribe-section" input_class="m-input in-subscribe-section"
button_id="subscribe_button"
button_class="m-button primary block" button_class="m-button primary block"
placeholder="Your email address" placeholder="Your email address"
}} }}
@ -65,10 +73,11 @@
</div> </div>
</div> </div>
</section> </section>
{{/if}}
<section class="m-author"> <section class="m-author">
<div class="m-author__content"> <div class="m-author__content">
<div class="m-author__picture"> <div class="m-author__picture">
<a href="{{primary_author.url}}" class="m-author-picture"> <a href="{{primary_author.url}}" class="m-author-picture" aria-label="Author picture">
{{#if primary_author.profile_image}} {{#if primary_author.profile_image}}
<div style="background-image: url({{primary_author.profile_image}});"></div> <div style="background-image: url({{primary_author.profile_image}});"></div>
{{else}} {{else}}
@ -91,21 +100,21 @@
<ul class="m-author-links"> <ul class="m-author-links">
{{#if primary_author.website}} {{#if primary_author.website}}
<li> <li>
<a href="{{primary_author.website}}" target="_blank" rel="noopener"> <a href="{{primary_author.website}}" target="_blank" rel="noopener" aria-label="Website">
<span class="icon-globe"></span> <span class="icon-globe"></span>
</a> </a>
</li> </li>
{{/if}} {{/if}}
{{#if primary_author.facebook}} {{#if primary_author.facebook}}
<li> <li>
<a href="https://facebook.com/{{primary_author.facebook}}" target="_blank" rel="noopener"> <a href="https://facebook.com/{{primary_author.facebook}}" target="_blank" rel="noopener" aria-label="Facebook">
<span class="icon-facebook"></span> <span class="icon-facebook"></span>
</a> </a>
</li> </li>
{{/if}} {{/if}}
{{#if primary_author.twitter}} {{#if primary_author.twitter}}
<li> <li>
<a href="https://twitter.com/{{primary_author.twitter}}" target="_blank" rel="noopener"> <a href="https://twitter.com/{{primary_author.twitter}}" target="_blank" rel="noopener" aria-label="Twitter">
<span class="icon-twitter"></span> <span class="icon-twitter"></span>
</a> </a>
</li> </li>
@ -145,9 +154,9 @@
<div class="l-wrapper in-recommended"> <div class="l-wrapper in-recommended">
<h3 class="m-section-title in-recommended">Recommended for you</h3> <h3 class="m-section-title in-recommended">Recommended for you</h3>
<div class="m-recommended-articles"> <div class="m-recommended-articles">
<ul class="m-recommended-slider js-recommended-articles"> <div class="m-recommended-slider js-recommended-articles">
{{> "loop"}} {{> "loop"}}
</ul> </div>
</div> </div>
</div> </div>
</section> </section>

3
subscribe.hbs
View file

@ -18,8 +18,11 @@
</p> </p>
</header> </header>
{{subscribe_form {{subscribe_form
form_id="subscribe-form"
form_class="m-subscribe-section__form" form_class="m-subscribe-section__form"
input_id="subscribe_input"
input_class="m-input in-subscribe-section" input_class="m-input in-subscribe-section"
button_id="subscribe_button"
button_class="m-button primary block" button_class="m-button primary block"
placeholder="Your email address" placeholder="Your email address"
autofocus="true" autofocus="true"