forked from jadlimcaco/design-systems-repo
-
Notifications
You must be signed in to change notification settings - Fork 0
/
articles.html
51 lines (44 loc) · 2.36 KB
/
articles.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
---
layout: default
title: Articles
permalink: /articles/
description: This is not a comprehensive list of every design system that I have come across. Rather, it's a collection of ones that I personally found to be helpful and inspiring for my work.
---
<article class="post post-articles">
<header class="post-header clearfix">
<div class="post-head-wrap">
<div class="post-head-content">
<h1 class="post-title">{{ page.title | escape }}</h1>
<p>An index of insightful articles about design systems. If you've written an article that you want to add here, just tweet me at <a href="https://twitter.com/jadlimcaco" title="My Twitter">@jadlimcaco</a>.</p>
</div>
<img class="illustration" src="{{ site.baseurl }}/images/illustration-articles.svg" width="94" height="86" alt="Design System Articles" />
</div>
</header>
<!-- Tags -->
<ul class="filter">
<li class="active"><a href="#" class="all">All <span class="number">({{site.articles | size}})</span></a></li>
<li><a href="#" class="animation">Animation</a></li>
<li><a href="#" class="code">Code</a></li>
<li><a href="#" class="contribution">Contribution</a></li>
<li><a href="#" class="design-tokens">Design Tokens</a></li>
<li><a href="#" class="figma">Figma</a></li>
<li><a href="#" class="leadership">Leadership</a></li>
<li><a href="#" class="patterns">Patterns</a></li>
<li><a href="#" class="process">Process</a></li>
<li><a href="#" class="sketch">Sketch</a></li>
</ul>
<div class="post-content holder">
{%- assign articles = site.articles | sort: 'date' | reverse %}
{%- for article in articles %}
<!-- Block -->
<a class="block block-ds{% for item in article.tags %} {{ item }}{% endfor %}" href="{{ article.link }}" title="{{ article.title }}" target="_blank">
<div class="content">
<h3>{{ article.author }}</h3>
<h2>{{ article.title }}</h2>
<p class="clamp">{{ article.description }}</p>
<span class="date">{{ article.date | date: '%B %d, %Y' }}</span>
</div>
</a>
{% endfor %}
</div>
</article>