Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
Amende committed Dec 7, 2019
1 parent e1ba372 commit a07ce78
Show file tree
Hide file tree
Showing 12 changed files with 3,449 additions and 1,197 deletions.
2,034 changes: 2,032 additions & 2 deletions assets/css/style.css

Large diffs are not rendered by default.

65 changes: 31 additions & 34 deletions author.hbs
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
{{!< default}}

{{#author}}
<header id="blog-header"{{#if cover_image}} class="has-cover"{{else}}{{#if @site.cover_image}} class="has-cover"{{/if}}{{/if}}>

<header class="blog-header{{#if cover_image}} has-cover{{else}}{{#if @site.cover_image}} has-cover{{/if}}{{/if}}">
<div class="inner">
<nav id="navigation">
{{#if @site.logo}}
Expand All @@ -19,6 +20,35 @@
</span>
{{/if}}
</nav>

<div class="archive archive-author">
<span class="archive-info">
<span class="archive-type">{{t "Author"}}</span>
<span class="archive-count">{{plural ../pagination.total empty=(t "No Posts") singular=(t "% Post") plural=(t "% Posts")}}</span>
</span>
<figure class="archive-avatar avatar">
{{#if profile_image}}
<img src="{{profile_image}}" alt="{{name}}" />
{{/if}}
</figure>
<h2 class="archive-title">{{name}}</h2>
{{#if bio}}
<span class="archive-description">{{{bio}}}</span>
{{/if}}
<span class="archive-links">
{{#if website}}
<a target="_blank" href="{{website}}" title="{{t "Website"}}"><i class="ic ic-link"></i><span>{{t "Website"}}</span></a>
{{/if}}
{{#if twitter}}
<a target="_blank" href="{{twitter_url}}" title="{{t "Twitter"}}"><i class="ic ic-twitter"></i><span>{{t "Twitter"}}</span></a>
{{/if}}
{{#if facebook}}
<a target="_blank" href="{{facebook_url}}" title="{{t "Facebook"}}"><i class="ic ic-facebook"></i><span>{{t "Facebook"}}</span></a>
{{/if}}
</span>
</div>


{{#if cover_image}}
<div class="blog-cover cover">
<img
Expand All @@ -45,39 +75,6 @@
</div>
</header>

<section id="blog-author"{{#if cover_image}} class="has-cover"{{else}}{{#if @site.cover_image}} class="has-cover"{{/if}}{{/if}}>
<div class="inner">

<aside class="post-author">
<figure class="post-author-avatar avatar">
{{#if profile_image}}
<img src="{{profile_image}}" alt="{{name}}" />
{{/if}}
</figure>
<div class="post-author-bio">
<h2 class="post-author-name">{{name}}</h2>
{{#if bio}}
<p class="post-author-about">{{{bio}}}</p>
{{/if}}
<span class="post-author-stats"><i class="ic ic-pencil"></i> {{plural ../pagination.total empty=(t "No Posts") singular=(t "% Post") plural=(t "% Posts")}}</span>
{{#if location}}
<span class="post-author-location"><i class="ic ic-location"></i> {{location}}</span>
{{/if}}
{{#if website}}
<span class="post-author-website"><i class="ic ic-link"></i> <a href="{{website}}">{{t "Website"}}</a></span>
{{/if}}
{{#if twitter}}
<span class="post-author-twitter"><i class="ic ic-twitter"></i> <a target="_blank" href="{{twitter_url}}">Twitter</a></span>
{{/if}}
{{#if facebook}}
<span class="post-author-facebook"><i class="ic ic-facebook"></i> <a target="_blank" href="{{facebook_url}}">Facebook</a></span>
{{/if}}
</div>
<div class="clear"></div>
</aside>
</div>
</section>

{{/author}}

<div id="index" class="container">
Expand Down
4 changes: 2 additions & 2 deletions default.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,12 @@

{{navigation}}

<section id="wrapper">
<section class="page-wrapper">
<a class="hidden-close"></a>
{{{body}}}
<div id="body-class" style="display: none;" class="{{body_class}}"></div>

<footer id="footer">
<footer class="page-footer">
<div class="inner">
<section class="credits">
<span class="credits-theme">{{t "Theme" }} <a href="https://github.com/zutrinken/attila">Attila</a> {{t "by"}} <a href="https://zutrinken.com" rel="nofollow">zutrinken</a></span>
Expand Down
16 changes: 2 additions & 14 deletions index.hbs
Original file line number Diff line number Diff line change
@@ -1,19 +1,7 @@
{{!< default}}
<header id="blog-header"{{#if @site.cover_image}} class="has-cover"{{/if}}>
<header class="blog-header {{#if @site.cover_image}} has-cover{{/if}}">
<div class="inner">
<nav id="navigation">
{{#if @site.logo}}
<span class="blog-logo">
<a href="{{@site.url}}"><img src="{{@site.logo}}" alt="{{t "Blog Logo"}}" /></a>
</span>
{{/if}}
{{#if @site.navigation}}
<span id="menu-button" class="nav-button">
<a class="menu-button"><i class="ic ic-menu"></i> {{t "Menu"}}</a>
</span>
{{/if}}
</nav>
<h1 class="blog-name"><a href="{{@site.url}}">{{@site.title}}</a></h1>
<h1 class="blog-name">{{@site.title}}</h1>
{{#if @site.description}}
<span class="blog-description">{{@site.description}}</span>
{{/if}}
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
"load-grunt-tasks": "^3.5.2"
},
"config": {
"posts_per_page": 10,
"posts_per_page": 3,
"image_sizes": {
"s": {
"width": 320
Expand Down
18 changes: 1 addition & 17 deletions page.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -2,24 +2,8 @@

{{#post}}

<header id="post-header"{{#if cover_image}} class="has-cover" {{/if}}>
<header class="post-header {{#if cover_image}} has-cover {{/if}}">
<div class="inner">
<nav id="navigation">
{{#if @site.logo}}
<span class="blog-logo">
<a href="{{@site.url}}"><img src="{{@site.logo}}" alt="{{t "Blog Logo"}}" /></a>
</span>
{{else}}
<span id="home-button" class="nav-button">
<a class="home-button" href="{{@site.url}}" title="{{t "Home"}}"><i class="ic ic-arrow-left"></i> {{t "Home"}}</a>
</span>
{{/if}}
{{#if @site.navigation}}
<span id="menu-button" class="nav-button">
<a class="menu-button"><i class="ic ic-menu"></i> {{t "Menu"}}</a>
</span>
{{/if}}
</nav>
<h1 class="post-title">{{{title}}}</h1>
{{#if cover_image}}<div class="post-cover cover" style="background-image: url('{{img_url cover_image}}');"></div>{{/if}}
</div>
Expand Down
18 changes: 9 additions & 9 deletions partials/loop.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,15 @@

<article class="{{post_class}}">
<div class="inner">
<header class="post-header">
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
<span class="post-meta">{{authors separator=", "}} {{tags prefix=(t "on ") separator=", "}} | <time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time></span>
<div class="clear"></div>
</header>

<section class="post-excerpt">
<p>{{excerpt}}&hellip;</p>
</section>
<h2 class="post-title"><a href="{{url}}">{{{title}}}</a></h2>
<span class="post-meta">
{{t "Posted by"}}
{{authors separator=", "}}
{{#primary_tag}}{{t "in"}} <a class="post-meta-tag" href="{{url}}">{{name}}</a>{{/primary_tag}}
{{t "on"}}
<time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time>
</span>
<p class="post-excerpt">{{excerpt}}&hellip;</p>
</div>
</article>

Expand Down
29 changes: 24 additions & 5 deletions partials/navigation.hbs
Original file line number Diff line number Diff line change
@@ -1,21 +1,40 @@
<nav id="navigation">
{{#if @site.logo}}
<span class="blog-logo">
<a href="{{@site.url}}"><img src="{{@site.logo}}" alt="{{t "Blog Logo"}}" /></a>
</span>
{{else}}
{{^is "home"}}
<span id="home-button" class="nav-button">
<a class="home-button" href="{{@site.url}}" title="{{t "Home"}}"><i class="ic ic-arrow-left"></i> {{t "Home"}}</a>
</span>
{{/is}}
{{/if}}
{{#if @site.navigation}}
<span id="menu-button" class="nav-button">
<a class="menu-button"><i class="ic ic-menu"></i> {{t "Menu"}}</a>
</span>
{{/if}}
</nav>

<nav id="menu">
<a class="close-button">{{t "Close"}}</a>
<div class="nav-wrapper">
<p class="nav-label">{{t "Menu"}}</p>
<ul>
{{#foreach navigation}}
<li class="nav-{{slug}}{{#if current}} active{{/if}}" role="presentation"><a href="{{url absolute="true"}}">{{label}}</a></li>
<li class="nav-{{slug}}{{#if current}} active{{/if}}" role="presentation"><a href="{{url absolute="true"}}"><span>{{label}}</span></a></li>
{{/foreach}}
{{#if @site.twitter}}
<li class="nav-twitter"><a href="{{twitter_url}}" title="{{@site.twitter}}"><i class="ic ic-twitter"></i> Twitter</a></li>
<li class="nav-twitter"><a href="{{twitter_url}}" title="{{@site.twitter}}"><span><i class="ic ic-twitter"></i> Twitter</span></a></li>
{{/if}}
{{#if @site.facebook}}
<li class="nav-facebook"><a href="{{facebook_url}}" title="{{@site.facebook}}"><i class="ic ic-facebook"></i> Facebook</a></li>
<li class="nav-facebook"><a href="{{facebook_url}}" title="{{@site.facebook}}"><span><i class="ic ic-facebook"></i> Facebook</span></a></li>
{{/if}}
{{#if @labs.subscribers}}
<li class="nav-subscribe"><a href="{{@site.url}}/subscribe/"><i class="ic ic-mail"></i> {{t "Subscribe"}}</a></li>
<li class="nav-subscribe"><a href="{{@site.url}}/subscribe/"><span><i class="ic ic-mail"></i> {{t "Subscribe"}}</span></a></li>
{{else}}
<li class="nav-rss"><a href="{{@site.url}}/rss/"><i class="ic ic-rss"></i> {{t "Subscribe"}}</a></li>
<li class="nav-rss"><a href="{{@site.url}}/rss/"><span><i class="ic ic-rss"></i> {{t "Subscribe"}}</span></a></li>
{{/if}}
</ul>
</div>
Expand Down
78 changes: 22 additions & 56 deletions post.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -6,26 +6,24 @@
<span class="progress-bar"></span>
</div>

<header id="post-header"{{#if feature_image}} class="has-cover" {{/if}}>
<header class="post-header {{#if feature_image}} has-cover {{/if}}">
<div class="inner">
<nav id="navigation">
{{#if @site.logo}}
<span class="blog-logo">
<a href="{{@site.url}}"><img src="{{@site.logo}}" alt="{{t "Blog Logo"}}" /></a>
</span>
{{else}}
<span id="home-button" class="nav-button">
<a class="home-button" href="{{@site.url}}" title="{{t "Home"}}"><i class="ic ic-arrow-left"></i> {{t "Home"}}</a>
</span>
{{/if}}
{{#if @site.navigation}}
<span id="menu-button" class="nav-button">
<a class="menu-button"><i class="ic ic-menu"></i> {{t "Menu"}}</a>
</span>
{{/if}}
</nav>
<h1 class="post-title">{{{title}}}</h1>
<span class="post-meta">{{authors separator=", "}} | <time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> | {{reading_time minute=(t "1 min read") minutes=(t "% min read")}}</span>
<div class="post-meta">
<div class="post-meta-avatars">
{{#foreach authors}}
<figure class="post-meta-avatar avatar">
{{#if profile_image}}
<a href="{{url}}" class="author-avatar">
<img class="author-profile-image" src="{{img_url profile_image size="xs"}}" alt="{{name}}" />
</a>
{{/if}}
</figure>
{{/foreach}}
</div>
<h4 class="post-meta-author">{{authors separator=", "}}</h4>
<time datetime="{{date format='YYYY-MM-DD'}}">{{date format="DD MMM YYYY"}}</time> • {{reading_time minute=(t "1 min read") minutes=(t "% min read")}}
</div>
{{#if feature_image}}
<div class="post-cover cover">
<img
Expand Down Expand Up @@ -58,6 +56,12 @@
<a class="facebook" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}" onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
<i class="ic ic-facebook"></i><span class="hidden">Facebook</span>
</a>
<a class="linkedin" href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{url absolute="true"}}/&amp;title={{title}}" onclick="window.open(this.href, 'linkedin-share', 'width=930,height=720');return false;">
<i class="ic ic-star"></i><span class="hidden">LinkedIn</span>
</a>
<a class="email" href="mailto:?subject=An%20Honest%20Guide%20to%20San%20Francisco&amp;body=https://astro-ghost.ecko.me/an-honest-guide-to-san-francisco/">
<i class="ic ic-mail"></i><span class="hidden">Email</span>
</a>
</div>

{{#if tags}}
Expand All @@ -67,44 +71,6 @@
</aside>
{{/if}}

<div class="clear"></div>

{{#has author="count:>1"}}
<aside class="post-authors">
<p class="post-authors-info">{{t "This post was a collaboration between:"}}</p>
<p class="post-authors-authors">{{authors separator=", "}}</p>
</aside>
{{else}}
{{#primary_author}}
<aside class="post-author">
<figure class="post-author-avatar avatar">
{{#if profile_image}}
<img src="{{profile_image}}" alt="{{name}}" />
{{/if}}
</figure>
<div class="post-author-bio">
<h4 class="post-author-name"><a href="{{url}}">{{name}}</a></h4>
{{#if bio}}
<p class="post-author-about">{{{bio}}}</p>
{{/if}}
{{#if location}}
<span class="post-author-location"><i class="ic ic-location"></i> {{location}}</span>
{{/if}}
{{#if website}}
<span class="post-author-website"><i class="ic ic-link"></i> <a href="{{website}}">{{t "Website"}}</a></span>
{{/if}}
{{#if twitter}}
<span class="post-author-twitter"><i class="ic ic-twitter"></i> <a target="_blank" href="{{twitter_url}}">Twitter</a></span>
{{/if}}
{{#if facebook}}
<span class="post-author-facebook"><i class="ic ic-facebook"></i> <a target="_blank" href="{{facebook_url}}">Facebook</a></span>
{{/if}}
</div>
<div class="clear"></div>
</aside>
{{/primary_author}}
{{/has}}

</section>


Expand Down
45 changes: 31 additions & 14 deletions src/sass/_colors.scss
Original file line number Diff line number Diff line change
@@ -1,20 +1,37 @@
$color-white: #ffffff;
$color-black: #000000;
@function hsb($h-hsb, $s-hsb, $b-hsb, $a: 1) {
@if $b-hsb == 0 {
@return hsla(0, 0, 0, $a)
} @else {
$l-hsl: ($b-hsb/2) * (2 - ($s-hsb/100));
$s-hsl: ($b-hsb * $s-hsb) / if($l-hsl < 50, $l-hsl * 2, 200 - $l-hsl * 2);
@return hsla($h-hsb, $s-hsl, $l-hsl, $a);
}
}

$color-gray-98: #faf9f7; // elements light background
$color-gray-95: #f2f2f0; // menu - background
$color-gray-90: #e5e4e1; // every elements border

$color-blue-80: #c2c7cc; // nav, menu, pagination - button border
$color-blue-60: #8a9199; // nav, menu, pagination - button font

$color-blue-30: #45484d;
$color-blue-15: #212226;
$color-neutral-98: hsb(215, 1, 98);
$color-neutral-90: hsb(215, 2, 90);
$color-neutral-80: hsb(215, 4, 80); // nav, menu, pagination - button border
$color-neutral-60: hsb(215, 6, 60); // nav, menu, pagination - button font
$color-neutral-25: hsb(215, 8, 25);
$color-neutral-15: hsb(215, 10, 15);

$color-yellow-100: #ffc336;
$color-red-95: #f26a3d;

$color-social-twitter: #3ea9dd;
$color-social-facebook: #3c5a98;
$color-social-twitter: #3ea9dd;
$color-social-facebook: #3c5a98;
$color-social-linkedin: #0e76a8;

$color-primary: $color-red-95; // define primary color

$color-text-primary: $color-neutral-15;
$color-text-primary-dark: #FFF;

$color-text-secondary: $color-neutral-60;
$color-text-secondary-dark: $color-neutral-80;

$color-border: $color-neutral-90;
$color-background: $color-neutral-98;

$primary-color: $color-red-95; // define primary color
$color-border-dark: $color-neutral-25;
$color-background-dark: $color-neutral-15;
Loading

0 comments on commit a07ce78

Please sign in to comment.