docs: website for LiquidJS

2026-10-02 16:45:14 -07:00 · 2020-03-28 17:21:07 +08:00
parent 0633dbeabb
commit 3e42d6b1b0
422 changed files with 14509 additions and 50335 deletions
@@ -0,0 +1,62 @@
+<header id="banner" class="wrapper">
+  <div class="inner">
+    <h2 id="banner-title">{{ page.subtitle }}</h2>
+    <div id="banner-start">
+      <code id="banner-start-command">npm install liquidjs</code><a id="banner-start-link" href="./tutorials/overview.html"><i class="icon-arrow-right"></i></a>
+    </div>
+    <div id="banner-share">{{ partial('partial/share') }}</div>
+  </div>
+</header>
+<div id="intro-news-list">
+  <div class="wrapper">
+    <div class="inner">
+      <div id="intro-news-flex">
+        {% for news in site.data.news %}
+        <a href="{{news.url}}" class="intro-news-wrap">
+          <div class="intro-news-time">{{news.date}}</div>
+          <div class="intro-news-title">{{news.title[page.lang]}}</div>
+        </a>
+        {% endfor %}
+      </div>
+    </div>
+  </div>
+</div>
+<div id="content-wrap">
+  <div class="wrapper">
+    <div class="inner">
+      {{ page.content }}
+      <ul id="intro-cmd-wrap">
+        <li class="intro-code-item"><span class="hl">import</span> { Liquid } <span class="hl">from</span> 'liquidjs'</li>
+        <li class="intro-code-item"><span class="hl">const</span> engine = <span class="hl">new</span> Liquid()</li>
+        <li class="intro-code-item"><span class="hl">const</span> tpl = engine.parse(<span class="hl-str">'Welcome to &#x7b;&#x7b;v}}!'</span>))</li>
+        <li class="intro-code-item"><span class="hl">const</span> html = <span class="hl">await</span> engine.render(tpl, {v: "Liquid"})</li>
+        <li class="intro-code-item"><span class="hl-comment">// html === "Welcome to Liquid!"</span></li>
+      </ul>
+      <div id="intro-get-started-wrap">
+        <a href="tutorials/overview.html" id="intro-get-started-link">{{ __('index.get_started') }}</a>
+      </div>
+    </div>
+  </div>
+</div>
+<div id="contributors-wrap">
+  <div class="wrapper">
+    <div class="inner">
+      <h3>{{__('index.contributors.title')}}</h3>
+      <p class="description">{{__('index.contributors.description')}}</p>
+      <div class="all-contributors">
+        {{ partial('partial/all-contributors') }}
+      </div>
+    </div>
+  </div>
+</div>
+<div id="sponsors-wrap">
+  <div class="wrapper">
+    <div class="inner">
+      <h3>{{__('index.sponsors.title')}}</h3>
+      <p class="description">{{__('index.sponsors.description')}}</p>
+      <div class="open-collective">
+        <object type="image/svg+xml" data="https://opencollective.com/liquidjs/tiers/backer.svg?avatarHeight=72"></object>
+      </div>
+    </div>
+  </div>
+</div>
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="{{ page.lang }}">
+{{ partial('partial/head') }}
+<body>
+  <div id="container">
+    {{ partial('partial/header') }}
+    {{ body }}
+    {{ partial('partial/footer') }}
+  </div>
+  <div id="mobile-nav-dimmer"></div>
+  {{ partial('partial/mobile_nav') }}
+  {{ partial('partial/after_footer') }}
+</body>
+</html>
@@ -0,0 +1,35 @@
+<div id="content-wrap">
+  <div id="content" class="wrapper">
+    <div id="content-inner">
+      {{ partial('partial/sidebar') }}
+      <article class="article-container" itemscope itemtype="http://schema.org/Article">
+        <div class="article-inner">
+          <div class="article">
+            <div class="inner">
+              <header class="article-header">
+                <h1 class="article-title" itemprop="name">{{ page.title }}</h1>
+                <a href="{{ raw_link(page.source) }}" class="article-edit-link" title="{{ __('page.improve') }}"><i class="icon-pencil"></i></a>
+              </header>
+              <div class="article-content" itemprop="articleBody">
+                {{ page_anchor(page.content) }}
+              </div>
+              <footer class="article-footer">
+                <time class="article-footer-updated" datetime="{{ date_xml(page.updated) }}" itemprop="dateModified">{{ __('page.last_updated', date(page.updated)) }}</time>
+                {{ page_nav() }}
+              </footer>
+            </div>
+          </div>
+          <aside id="article-toc" role="navigation">
+            <div id="article-toc-inner">
+              <div id="article-toc-inner-list">
+                <strong class="sidebar-title">{{ __('page.contents') }}</strong>
+                {{ toc(page.content, {list_number: false}) }}
+              </div>
+              <a href="#" id="article-toc-top">{{ __('page.back_to_top') }}</a>
+            </div>
+          </aside>
+        </div>
+      </article>
+    </div>
+  </div>
+</div>
@@ -0,0 +1,18 @@
+{% if page.layout === 'playground' %}
+<script src="https://cdn.jsdelivr.net/npm/liquidjs/dist/liquid.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/src-min/ace.js"></script>
+{% endif %}
+
+{{ js('js/main') }}
+
+{% if config.algolia[page.lang] %}
+<script src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script>
+<script>
+document.getElementById('search-input-wrap').classList.add('on');
+docsearch({
+  apiKey: '{{ config.algolia[page.lang].api_key }}',
+  indexName: '{{ config.algolia[page.lang].index_name }}',
+  inputSelector: '#search-input'
+});
+</script>
+{% endif %}
@@ -0,0 +1,38 @@
+<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
+<!-- prettier-ignore-start -->
+<!-- markdownlint-disable -->
+<table>
+  <tr>
+    <td align="center"><a href="https://harttle.land"><img src="https://avatars3.githubusercontent.com/u/4427974?v=4" width="100px;" alt="Jun Yang"/></a></td>
+    <td align="center"><a href="https://github.com/chenos"><img src="https://avatars0.githubusercontent.com/u/2993310?v=4" width="100px;" alt="chenos"/></a></td>
+    <td align="center"><a href="https://zachleat.com/"><img src="https://avatars2.githubusercontent.com/u/39355?v=4" width="100px;" alt="Zach Leatherman"/></a></td>
+    <td align="center"><a href="https://github.com/thardy"><img src="https://avatars3.githubusercontent.com/u/120636?v=4" width="100px;" alt="Tim Hardy"/></a></td>
+    <td align="center"><a href="https://paulrobertlloyd.com/"><img src="https://avatars3.githubusercontent.com/u/813383?v=4" width="100px;" alt="Paul Robert Lloyd"/></a></td>
+    <td align="center"><a href="https://twitter.com/alecdotbiz"><img src="https://avatars2.githubusercontent.com/u/1925840?v=4" width="100px;" alt="Alec Larson"/></a></td>
+    <td align="center"><a href="https://github.com/pmalouin"><img src="https://avatars1.githubusercontent.com/u/1411117?v=4" width="100px;" alt="Patrick Malouin"/></a></td>
+    <td align="center"><a href="https://jaswrks.com"><img src="https://avatars3.githubusercontent.com/u/1563559?v=4" width="100px;" alt="jaswrks"/></a></td>
+    <td align="center"><a href="https://oott123.com"><img src="https://avatars2.githubusercontent.com/u/905663?v=4" width="100px;" alt="三三"/></a></td>
+    <td align="center"><a href="https://github.com/ssendev"><img src="https://avatars0.githubusercontent.com/u/450793?v=4" width="100px;" alt="ssendev"/></a></td>
+    <td align="center"><a href="https://github.com/wojtask9"><img src="https://avatars3.githubusercontent.com/u/6099236?v=4" width="100px;" alt="wojtask9"/></a></td>
+    <td align="center"><a href="https://github.com/thelornenelson"><img src="https://avatars3.githubusercontent.com/u/24596583?v=4" width="100px;" alt="Andrew Barclay"/></a></td>
+    <td align="center"><a href="https://www.stam.pr/"><img src="https://avatars2.githubusercontent.com/u/142338?v=4" width="100px;" alt="Cory Mawhorter"/></a></td>
+    <td align="center"><a href="https://github.com/thehappybug"><img src="https://avatars0.githubusercontent.com/u/3393530?v=4" width="100px;" alt="Mehdi Jaffery"/></a></td>
+    <td align="center"><a href="https://github.com/robinbijlani"><img src="https://avatars0.githubusercontent.com/u/2503108?v=4" width="100px;" alt="Robin Bijlani"/></a></td>
+    <td align="center"><a href="https://www.rmkennedy.com"><img src="https://avatars3.githubusercontent.com/u/8356669?v=4" width="100px;" alt="Ryan Kennedy"/></a></td>
+    <td align="center"><a href="https://github.com/strax"><img src="https://avatars2.githubusercontent.com/u/587213?v=4" width="100px;" alt="Sami Kukkonen"/></a></td>
+    <td align="center"><a href="https://ScottFreeCode.github.io/"><img src="https://avatars3.githubusercontent.com/u/16506071?v=4" width="100px;" alt="Scott Santucci"/></a></td>
+    <td align="center"><a href="http://stevenrescigno.com"><img src="https://avatars3.githubusercontent.com/u/8505293?v=4" width="100px;" alt="Steven "/></a></td>
+    <td align="center"><a href="https://efcl.info/"><img src="https://avatars1.githubusercontent.com/u/19714?v=4" width="100px;" alt="azu"/></a></td>
+    <td align="center"><a href="https://github.com/wyozi"><img src="https://avatars3.githubusercontent.com/u/4894573?v=4" width="100px;" alt="Joonas"/></a></td>
+    <td align="center"><a href="https://github.com/jamelait"><img src="https://avatars1.githubusercontent.com/u/14369255?v=4" width="100px;" alt="Jamel A."/></a></td>
+    <td align="center"><a href="https://brandonpittman.net"><img src="https://avatars0.githubusercontent.com/u/967145?v=4" width="100px;" alt="Brandon Pittman"/></a></td>
+    <td align="center"><a href="https://github.com/tgrandgent"><img src="https://avatars3.githubusercontent.com/u/17069042?v=4" width="100px;" alt="tgrandgent"/></a></td>
+    <td align="center"><a href="https://github.com/mastodon0"><img src="https://avatars1.githubusercontent.com/u/7924332?v=4" width="100px;" alt="Martin Schuster"/></a></td>
+    <td align="center"><a href="http://js.chenlei.me"><img src="https://avatars0.githubusercontent.com/u/6339390?v=4" width="100px;" alt="Ray"/></a></td>
+    <td align="center"><a href="https://github.com/CriGoT"><img src="https://avatars0.githubusercontent.com/u/1936786?v=4" width="100px;" alt="Cristofer Gonzales"/></a></td>
+  </tr>
+</table>
+
+<!-- markdownlint-enable -->
+<!-- prettier-ignore-end -->
+<!-- ALL-CONTRIBUTORS-LIST:END -->
@@ -0,0 +1,11 @@
+{% assign people = "alice, bob, carol" | split: ", " -%}
+
+<ul>
+{%- for person in people %}
+  <li>
+    <a href="{{person | prepend: "http://example.com/"}}">
+      {{ person | captilize }}
+    </a>
+  </li>
+{%- endfor%}
+</ul>
@@ -0,0 +1,14 @@
+<footer id="footer" class="wrapper">
+  <div class="inner">
+    <div id="footer-copyright">
+      &copy; {{ moment(Date.now()).year() }} <a href="https://github.com/harttle/liquidjs/graphs/contributors" target="_blank">{{ config.author }}</a><br>
+      {{__('footer.license')}}
+    </div>
+    <div id="footer-links">
+      <a href="https://twitter.com/{{ config.twitter }}" class="footer-link" target="_blank"><i class="icon-twitter"></i></a>
+      <a href="https://www.patreon.com/{{ config.patreon }}" class="footer-link" target="_blank"><i class="icon-patreon"></i></a>
+      <a href="https://opencollective.com/{{ config.oc }}" class="footer-link" target="_blank"><i class="icon-opencollective"></i></a>
+      <a href="https://github.com/{{ config.github }}" class="footer-link" target="_blank"><i class="icon-github"></i></a>
+    </div>
+  </div>
+</footer>
@@ -0,0 +1,33 @@
+<head prefix="og: http://ogp.me/ns#">
+  <meta charset="utf-8">
+  <title>{% if page.title %}{{ page.title }} | {% endif %}{{ config.title }}</title>
+  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="dns-prefetch" href="https://cdn.jsdelivr.net/">
+  <!-- Canonical links -->
+  <link rel="canonical" href="{{ url }}">
+  <!-- Alternative links -->
+  {% if page.layout == 'page' or page.layout == 'index' %}
+    {% for lang in site.data.languages %}
+      <link rel="alternative" hreflang="{{ loop.key }}" href="{{ canonical_url(loop.key) }}">
+    {% endfor %}
+  {% endif %}
+  <!-- Icon -->
+  <link rel="apple-touch-icon" sizes="57x57" href="{{ url_for('icon/apple-touch-icon-57x57.png') }}">
+  <link rel="apple-touch-icon" sizes="114x114" href="{{ url_for('icon/apple-touch-icon-114x114.png') }}">
+  <link rel="apple-touch-icon" sizes="72x72" href="{{ url_for('icon/apple-touch-icon-72x72.png') }}">
+  <link rel="apple-touch-icon" sizes="144x144" href="{{ url_for('icon/apple-touch-icon-144x144.png') }}">
+  <link rel="apple-touch-icon" sizes="60x60" href="{{ url_for('icon/apple-touch-icon-60x60.png') }}">
+  <link rel="apple-touch-icon" sizes="120x120" href="{{ url_for('icon/apple-touch-icon-120x120.png') }}">
+  <link rel="apple-touch-icon" sizes="76x76" href="{{ url_for('icon/apple-touch-icon-76x76.png') }}">
+  <link rel="apple-touch-icon" sizes="152x152" href="{{ url_for('icon/apple-touch-icon-152x152.png') }}">
+  <link rel="icon" type="image/png" href="{{ url_for('icon/favicon-196x196.png') }}" sizes="196x196">
+  <link rel="icon" type="image/png" href="{{ url_for('icon/favicon-160x160.png') }}" sizes="160x160">
+  <link rel="icon" type="image/png" href="{{ url_for('icon/favicon-96x96.png') }}" sizes="96x96">
+  <link rel="icon" type="image/png" href="{{ url_for('icon/favicon-16x16.png') }}" sizes="16x16">
+  <link rel="icon" type="image/png" href="{{ url_for('icon/favicon-32x32.png') }}" sizes="32x32">
+  <meta name="msapplication-TileColor" content="#2f83cd">
+  <meta name="msapplication-TileImage" content="{{ url_for('icon/mstile-144x144.png') }}">
+  {{ css('css/navy') }}
+  {{ feed_tag('atom.xml') }}
+</head>
@@ -0,0 +1,28 @@
+<header id="header" class="wrapper">
+  <div id="header-inner" class="inner">
+    <h1 id="logo-wrap">
+      <a href="{{ url_for_lang('/') }}" id="logo">LiquidJS</a>
+    </h1>
+    <nav id="main-nav">
+      {{ header_menu('main-nav') }}
+      <div id="search-input-wrap">
+        <i id="search-input-icon" class="icon-search"></i>
+        <input type="search" id="search-input" placeholder="{{__('menu.search')}}...">
+      </div>
+    </nav>
+    <div id="lang-select-wrap" class="main-nav-link">
+      <label><i class="icon-network"></i>{{ lang_name(page.lang) }}</label>
+      <select id="lang-select" data-canonical="{{ canonical_path_for_nav() }}">
+        {% for lang in site.data.languages %}
+          <option value="{{ loop.key }}"{% if page.lang === loop.key %} selected{% endif %}>{{ lang_name(loop.key) }}</option>
+        {% endfor %}
+      </select>
+    </div>
+    <a href="https://github.com/{{ config.github }}" id="github-link-wrap" class="main-nav-link"><i class="icon-github"></i>Github</a>
+    <a id="mobile-nav-toggle">
+      <span class="mobile-nav-toggle-bar"></span>
+      <span class="mobile-nav-toggle-bar"></span>
+      <span class="mobile-nav-toggle-bar"></span>
+    </a>
+  </div>
+</header>
@@ -0,0 +1,23 @@
+<nav id="mobile-nav">
+  <div id="mobile-nav-inner">
+    <ul id="mobile-nav-list">
+      {{ header_menu('mobile-nav') }}
+      <li class="mobile-nav-item">
+        <a href="https://github.com/{{ config.github }}" class="mobile-nav-link" rel="external" target="_blank">GitHub</a>
+      </li>
+    </ul>
+    {% if page.layout == 'page' %}
+    <div class="mobile-sidebar-list">
+      {{ doc_sidebar('mobile-nav') }}
+    </div>
+    {% endif %}
+  </div>
+  <div id="mobile-lang-select-wrap">
+    <span id="mobile-lang-select-label"><i class="icon-network"></i><span>{{ lang_name(page.lang) }}</span></span>
+    <select id="mobile-lang-select" data-canonical="{{ canonical_path_for_nav() }}">
+      {% for lang in site.data.languages %}
+        <option value="{{ loop.key }}"{% if page.lang === loop.key %} selected{% endif %}>{{ lang_name(loop.key) }}</option>
+      {% endfor %}
+    </select>
+  </div>
+</nav>
@@ -0,0 +1,8 @@
+<!-- GitHub star -->
+<a href="https://github.com/harttle/liquidjs" target="_blank" aria-label="Star harttle/liquidjs on GitHub"><img src="https://img.shields.io/github/stars/harttle/liquidjs?style=flat-square" alt="Star"></a>
+<!-- NPM Download -->
+<a href="https://www.npmjs.com/package/liquidjs" target="_blank" aria-label="LiquidJS on NPM"><img src ="https://img.shields.io/npm/dm/liquidjs?logo=npm&style=flat-square" alt="NPM Downloads"></a>
+<!-- Contributors button -->
+<a href="https://github.com/harttle/liquidjs/graphs/contributors" target="_blank" aria-label="Contributors of LiquidJS on Github"><img src="https://img.shields.io/github/contributors/harttle/liquidjs.svg?style=flat-square" alt="Contributors of LiquidJS on Github"></a>
+<!-- Open Collective button -->
+<a href="https://opencollective.com/liquidjs/" target="_blank" aria-label="Donate to LiquidJS on Open Collective"><img src="https://img.shields.io/opencollective/all/liquidjs?style=flat-square" alt="Donate to LiquidJS on Open Collective"></a>
@@ -0,0 +1,5 @@
+<aside id="sidebar" role="navigation">
+  <div class="inner">
+    {{ doc_sidebar('sidebar') }}
+  </div>
+</aside>
@@ -0,0 +1,10 @@
+<div id="playground" role="main">
+  <div class="wrapper">
+    <h1 class="inner">{{__('playground.title')}}</h1>
+    <div class="row inner">
+      <div id="editorEl">{{__('playground.loading')}}</div>
+      <div id="previewEl">{{__('playground.loading')}}</div>
+    </div>
+    <script id="sourceEl" type="text/plain">{{ raw('partial/demo.liquid') }}</script>
+  </div>
+</div>