Merge pull request #52 from welpo/refactor/macros
♻️ refactor: split macros.html in different files
main
Óscar
2 years ago
committed by
GitHub
commit
2367c793bc
@ -0,0 +1,41 @@
|
||||
{% macro cards_posts(pages) %}
|
||||
<div class="cards">
|
||||
{%- for page in pages %}
|
||||
<div class="card">
|
||||
{% if page.extra.local_image %}
|
||||
<img class="card-image" alt={{ page.extra.local_image }} src="{{ get_url(path=page.extra.local_image) }}">
|
||||
{% elif page.extra.remote_image %}
|
||||
<img class="card-image" alt={{ page.extra.remote_image }} src="{{ page.extra.remote_image }}">
|
||||
{% else %}
|
||||
<div class="card-image-placeholder"></div>
|
||||
{% endif %}
|
||||
|
||||
<div class="card-info">
|
||||
<h1 class="card-title">
|
||||
{% if page.extra.link_to %}
|
||||
<a rel="noopener noreferrer" target="_blank" href={{ page.extra.link_to }}>{{page.title}}</a>
|
||||
{% else %}
|
||||
<a href={{ page.permalink }}>{{page.title}}</a>
|
||||
{% endif %}
|
||||
</h1>
|
||||
|
||||
<div class="meta">
|
||||
{%- if page.date %}
|
||||
{{ macros_format_date::format_date(date=page.date) }}
|
||||
{% endif -%}
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="card-description">
|
||||
{% if page.description %}
|
||||
{{ page.description }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endfor -%}
|
||||
</div>
|
||||
{% endmacro cards_posts %}
|
||||
@ -0,0 +1,79 @@
|
||||
{% macro content(page, separator='•') %}
|
||||
<main>
|
||||
<article>
|
||||
<div>
|
||||
<div class="article-title">
|
||||
{{ page.title }}
|
||||
</div>
|
||||
<div class="meta">
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
|
||||
{% if page.date %}
|
||||
{{ macros_format_date::format_date(date=page.date) }}
|
||||
{{ separator }}
|
||||
{% endif %}
|
||||
|
||||
<span title="{{ page.word_count }} words">{{ page.reading_time }} min read</span>
|
||||
|
||||
{% if page.taxonomies and page.taxonomies.tags %}
|
||||
<nav class="nav tags"> {{ separator }} Categories:
|
||||
{% for tag in page.taxonomies.tags %}
|
||||
<a href={{ get_taxonomy_url(kind='tags' , name=tag) | safe }}>{{ tag }}</a>{% if not loop.last %},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if page.extra.tldr %}
|
||||
<div class="tldr">
|
||||
<h3>TL;DR:</h3>
|
||||
<p>{{ page.extra.tldr }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{# Optional table of contents #}
|
||||
{% if page.extra.toc | default(value=false) %}
|
||||
{% if page.toc %}
|
||||
<div class="toc-container">
|
||||
<h3>Table of Contents</h3>
|
||||
<ul>
|
||||
{% for h1 in page.toc %}
|
||||
<li>
|
||||
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
|
||||
{% if h1.children %}
|
||||
<ul>
|
||||
{% for h2 in h1.children %}
|
||||
<li>
|
||||
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
|
||||
{% if h2.children %}
|
||||
<ul>
|
||||
{% for h3 in h2.children %}
|
||||
<li>
|
||||
<a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<section class="body">
|
||||
{{ page.content | safe }}
|
||||
</section>
|
||||
|
||||
</article>
|
||||
</main>
|
||||
{% endmacro content %}
|
||||
@ -0,0 +1,22 @@
|
||||
{% macro format_date(date) %}
|
||||
{% if config.extra.date_format %}
|
||||
{{ date | date(format=config.extra.date_format) }}
|
||||
{% else %}
|
||||
{% set day = date | date(format='%-d') | int %}
|
||||
{% if day in [11, 12, 13] %}
|
||||
{% set suffix = "th" %}
|
||||
{% else %}
|
||||
{% set last_digit = day % 10 %}
|
||||
{% if last_digit == 1 %}
|
||||
{% set suffix = "st" %}
|
||||
{% elif last_digit == 2 %}
|
||||
{% set suffix = "nd" %}
|
||||
{% elif last_digit == 3 %}
|
||||
{% set suffix = "rd" %}
|
||||
{% else %}
|
||||
{% set suffix = "th" %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{{ date | date(format="%-d") }}{{ suffix }} {{ date | date(format="%B %Y") }}
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
@ -0,0 +1,38 @@
|
||||
{% macro list_posts(pages) %}
|
||||
<div class="bloglist-container">
|
||||
{% for page in pages %}
|
||||
<section class="bloglist-table-row">
|
||||
<div class="bloglist-title">
|
||||
<a href="{{ page.permalink }}">{{ page.title }}</a>
|
||||
</div>
|
||||
|
||||
<div class="card-meta">
|
||||
{% if page.date %}
|
||||
{{ macros_format_date::format_date(date=page.date) }}
|
||||
{% endif %}
|
||||
|
||||
<br/>
|
||||
<span>{{ page.reading_time }} min read</span>
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<br/>
|
||||
<div class="description">
|
||||
{% if page.description %}
|
||||
{{ page.description }}
|
||||
{% elif page.summary %}
|
||||
{{ page.summary | safe }}…
|
||||
{% else %}
|
||||
{% set hide_read_more = true %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if not hide_read_more %}
|
||||
<a class="readmore" href={{ page.permalink }}>Read more ⟶</a>
|
||||
{% endif %}
|
||||
</section>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
@ -0,0 +1,16 @@
|
||||
{% macro list_title(pages, tag_name=false) %}
|
||||
{% if tag_name %}
|
||||
<h1 class="title-container">Entries tagged - "{{ term.name }}"</h1>
|
||||
{% else %}
|
||||
<h1 class="page-title">All articles</h1>
|
||||
{% endif %}
|
||||
|
||||
<ul class="posts">
|
||||
{% for page in pages %}
|
||||
<li class="post">
|
||||
<a href="{{ page.permalink }}">{{ page.title }}</a>
|
||||
<span class="meta">{{ macros_format_date::format_date(date=page.date) }}</span>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endmacro list_title %}
|
||||
@ -1,242 +0,0 @@
|
||||
{% macro format_date(date) %}
|
||||
{% if config.extra.date_format %}
|
||||
{{ date | date(format=config.extra.date_format) }}
|
||||
{% else %}
|
||||
{% set day = date | date(format='%-d') | int %}
|
||||
{% set suffix = "" %}
|
||||
{% if day in [11, 12, 13] %}
|
||||
{% set suffix = "th" %}
|
||||
{% else %}
|
||||
{% set last_digit = day % 10 %}
|
||||
{% if last_digit == 1 %}
|
||||
{% set suffix = "st" %}
|
||||
{% elif last_digit == 2 %}
|
||||
{% set suffix = "nd" %}
|
||||
{% elif last_digit == 3 %}
|
||||
{% set suffix = "rd" %}
|
||||
{% else %}
|
||||
{% set suffix = "th" %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{{ date | date(format="%-d") }}{{ suffix }} {{ date | date(format="%B %Y") }}
|
||||
{% endif %}
|
||||
{% endmacro %}
|
||||
|
||||
{% macro list_posts(pages) %}
|
||||
<div class="bloglist-container">
|
||||
{%- for page in pages %}
|
||||
<section class="bloglist-table-row">
|
||||
<div class="bloglist-title">
|
||||
<a href={{ page.permalink }}>{{page.title}}</a>
|
||||
</div>
|
||||
|
||||
<div class="card-meta">
|
||||
{%- if page.date %}
|
||||
{{ post_macros::format_date(date=page.date, format=config.extra.date_format) }}
|
||||
{% endif -%}
|
||||
<br />
|
||||
<span>{{ page.reading_time }} minute read</span>
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<div class="description">
|
||||
{% if page.description %}
|
||||
{{ page.description }}
|
||||
{% elif page.summary %}
|
||||
{{ page.summary | safe }}…
|
||||
{% else %}
|
||||
{% set hide_read_more = true %}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if not hide_read_more %}
|
||||
<a class="readmore" href={{ page.permalink }}>Read more ⟶</a>
|
||||
{% endif %}
|
||||
</section>
|
||||
|
||||
{% endfor -%}
|
||||
</div>
|
||||
{% endmacro list_posts %}
|
||||
|
||||
{% macro tags(page, short=false) %}
|
||||
{%- if page.taxonomies and page.taxonomies.tags %}
|
||||
<span class="post-tags-inline">
|
||||
{%- if short %}
|
||||
::
|
||||
{%- set sep = "," -%}
|
||||
{% else %}
|
||||
:: tags:
|
||||
{%- set sep = " " -%}
|
||||
{% endif -%}
|
||||
{%- for tag in page.taxonomies.tags %}
|
||||
<a class="post-tag" href="{{ get_taxonomy_url(kind='tags', name=tag) | safe }}">#{{ tag }}</a>
|
||||
{%- if not loop.last %}{{ sep | safe }}{% endif -%}
|
||||
{% endfor -%}
|
||||
</span>
|
||||
{% endif -%}
|
||||
{% endmacro tags %}
|
||||
|
||||
{% macro page_header(title) %}
|
||||
<div class="title-container section-title">
|
||||
{{ title }}
|
||||
</div>
|
||||
{% endmacro page_header %}
|
||||
|
||||
|
||||
{% macro page_desc(desc, page) %}
|
||||
<div id="banner-container-home">
|
||||
<div id="home-banner-text">
|
||||
<div class="home-banner-header">{{ desc.title }}</div>
|
||||
<section id="banner-home-subtitle">
|
||||
{{ page.content | safe }}
|
||||
</section>
|
||||
</div>
|
||||
<div class="image-container-home">
|
||||
<img alt="the owner" class="banner-home-img" src={{ desc.img | safe | replace(from="$BASE_URL", to=config.base_url) }} />
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro page_desc %}
|
||||
|
||||
|
||||
{% macro content(page) %}
|
||||
<main>
|
||||
<article>
|
||||
<div>
|
||||
<div class="article-title">
|
||||
{{ page.title }}
|
||||
</div>
|
||||
<div class="meta">
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
|
||||
{% if page.date %}
|
||||
{{ post_macros::format_date(date=page.date) }}
|
||||
•
|
||||
{% endif %}
|
||||
|
||||
<span title="{{ page.word_count }} words">{{ page.reading_time }} min read{% if page.taxonomies and page.taxonomies.tags %} • {%endif %}</span>
|
||||
|
||||
{% if page.taxonomies and page.taxonomies.tags %}
|
||||
<nav class="nav tags">Categories:
|
||||
{% for tag in page.taxonomies.tags %}
|
||||
<a href={{ get_taxonomy_url(kind='tags' , name=tag) | safe }}>{{ tag }}</a>{% if not loop.last %},
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</nav>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if page.extra.tldr %}
|
||||
<div class="tldr">
|
||||
<h3>TL;DR:</h3>
|
||||
<p>{{ page.extra.tldr }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{# Optional table of contents #}
|
||||
{% if page.extra.toc | default(value=false) %}
|
||||
{% if page.toc %}
|
||||
<div class="toc-container">
|
||||
<h3>Table of Contents</h3>
|
||||
<ul>
|
||||
{% for h1 in page.toc %}
|
||||
<li>
|
||||
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
|
||||
{% if h1.children %}
|
||||
<ul>
|
||||
{% for h2 in h1.children %}
|
||||
<li>
|
||||
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
|
||||
{% if h2.children %}
|
||||
<ul>
|
||||
{% for h3 in h2.children %}
|
||||
<li>
|
||||
<a href="{{ h3.permalink | safe }}">{{ h3.title }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<section class="body">
|
||||
{{ page.content | safe }}
|
||||
</section>
|
||||
|
||||
</article>
|
||||
</main>
|
||||
{% endmacro content %}
|
||||
|
||||
{% macro cards_posts(pages) %}
|
||||
<div class="cards">
|
||||
{%- for page in pages %}
|
||||
<div class="card">
|
||||
{% if page.extra.local_image %}
|
||||
<img class="card-image" alt={{ page.extra.local_image }} src="{{ get_url(path=page.extra.local_image) }}">
|
||||
{% elif page.extra.remote_image %}
|
||||
<img class="card-image" alt={{ page.extra.remote_image }} src="{{ page.extra.remote_image }}">
|
||||
{% else %}
|
||||
<div class="card-image-placeholder"></div>
|
||||
{% endif %}
|
||||
|
||||
<div class="card-info">
|
||||
<h1 class="card-title">
|
||||
{% if page.extra.link_to %}
|
||||
<a rel="noopener noreferrer" target="_blank" href={{ page.extra.link_to }}>{{page.title}}</a>
|
||||
{% else %}
|
||||
<a href={{ page.permalink }}>{{page.title}}</a>
|
||||
{% endif %}
|
||||
</h1>
|
||||
|
||||
<div class="meta">
|
||||
{%- if page.date %}
|
||||
{{ post_macros::format_date(date=page.date) }}
|
||||
{% endif -%}
|
||||
{% if page.draft %}
|
||||
<span class="draft-label">DRAFT</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="card-description">
|
||||
{% if page.description %}
|
||||
{{ page.description }}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endfor -%}
|
||||
</div>
|
||||
{% endmacro cards_posts %}
|
||||
|
||||
{% macro list_title(pages, tag_name=false) %}
|
||||
{% if tag_name %}
|
||||
<h1 class="title-container">Entries tagged - "{{ term.name }}"</h1>
|
||||
{% else %}
|
||||
<h1 class="page-title">All articles</h1>
|
||||
{% endif %}
|
||||
|
||||
<ul class="posts">
|
||||
{% for page in pages %}
|
||||
<li class="post">
|
||||
<a href="{{ page.permalink }}">{{ page.title }}</a>
|
||||
<span class="meta">{{ post_macros::format_date(date=page.date) }}</span>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endmacro list_title %}
|
||||
@ -0,0 +1,13 @@
|
||||
{% macro page_desc(desc, page) %}
|
||||
<div id="banner-container-home">
|
||||
<div id="home-banner-text">
|
||||
<div class="home-banner-header">{{ desc.title }}</div>
|
||||
<section id="banner-home-subtitle">
|
||||
{{ page.content | safe }}
|
||||
</section>
|
||||
</div>
|
||||
<div class="image-container-home">
|
||||
<img alt="the owner" class="banner-home-img" src={{ desc.img | replace(from="$BASE_URL", to=config.base_url) | safe}} />
|
||||
</div>
|
||||
</div>
|
||||
{% endmacro %}
|
||||
@ -0,0 +1,5 @@
|
||||
{% macro page_header(title) %}
|
||||
<div class="title-container section-title">
|
||||
{{ title }}
|
||||
</div>
|
||||
{% endmacro page_header %}
|
||||
@ -1,5 +1,5 @@
|
||||
{% extends "base.html" %}
|
||||
|
||||
{% block main_content %}
|
||||
{{ post_macros::content(page=page)}}
|
||||
{{ macros_content::content(page=page)}}
|
||||
{% endblock main_content %}
|
||||
|
||||
Loading…
Reference in New Issue