jekyll-text-theme 2.1.0 → 2.2.0

data/_layouts/home.html

@@ -1,14 +1,20 @@
 ---
-layout: page
+layout: articles
 titles:
   en: Home
   zh: 主页
   zh-Hans: 主頁
   zh-Hant: 主頁
 show_title: false
+articles:
+  data_source: paginator.posts
+  article_type: BlogPosting
+  show_cover: false
+  show_excerpt: true
+  show_readmore: true
+  show_info: true
 ---
 <div class="layout--home">
-  {%- include article-list.html articles=paginator.posts type='common' show_excerpt=true excerpt_type=site.excerpt_type -%}
   {%- include paginator.html -%}
 </div>
 <script>

data/_layouts/landing.html

@@ -1,50 +1,23 @@
 ---
 layout: page
-title: TeXt
-show_title: false
-show_header: false
+header: false
 full_width: true
+article_header:
+  type: overlay
+  align: center
+  height: 80vh
 ---
-{%- include snippets/page-title.html -%}
-{%- assign _title = __return -%}
-
 <div class="layout--landing">
-{%- include snippets/get-nav-url.html path=page.data.background_image.src -%}
-{%- assign _url = __return -%}
-{%- if page.data.theme == 'light' -%}
-  <section class="section section--light overlay" style="background-image: url({{ _url }});">
-{%- elsif page.data.theme == 'dark' -%}
-  <section class="section section--dark overlay" style="background-image: url({{ _url }});">
-{%- else -%}
-  <section class="section overlay" style="background-image: url({{ _url }});">
-{%- endif -%}
-    <div class="section__content">
-      <h1>{{ _title }}</h1>
-      {%- if page.data.sub_title -%}
-      <h2 itemprop="alternativeHeadline">{{ page.data.sub_title }}</h2>
-      {%- endif -%}
-      {%- if page.data.actions -%}
-      <ul class="menu menu--center">
-      {%- for _action in page.data.actions -%}
-        {%- include snippets/get-nav-url.html path=_action.url -%}
-        {%- assign _url = __return -%}
-        {%- assign _type = _action.type | default: 'info' -%}
-        <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
-      {%- endfor -%}
-      </ul>
-      {%- endif -%}
-    </div>
-  </section>
-
+  <div class="heros">
   {%- for _section in page.data.sections -%}
     {%- include snippets/get-nav-url.html path=_section.background_image.src -%}
     {%- assign _url = __return -%}
     {%- if _section.theme == 'light' -%}
-      <section class="section section--light feature" id="section-{{ forloop.index }}"
+      <section class="hero hero--center hero--light" id="hero-{{ forloop.index }}"
     {%- elsif _section.theme == 'dark' -%}
-      <section class="section section--dark feature" id="section-{{ forloop.index }}"
+      <section class="hero hero--center hero--dark" id="hero-{{ forloop.index }}"
     {%- else -%}
-      <section class="section feature" id="section-{{ forloop.index }}"
+      <section class="hero hero--center" id="hero-{{ forloop.index }}"
     {%- endif -%}
     {%- if _section.background_color -%}
         style="background-image: url({{ _url }}); background-color: {{ _section.background_color }};">
@@ -52,16 +25,16 @@ full_width: true
         style="background-image: url({{ _url }});">
     {%- endif -%}
 
-        <div class="section__content">
-          <div class="content__row">
+        <div class="hero__content">
+          <div class="mb-5">
 
             <h3>{{ _section.title }}</h3>
-              {%- if _section.description-%}
-            <p>{{ _section.description }}</p>
+              {%- if _section.excerpt-%}
+            <p>{{ _section.excerpt }}</p>
             {%- endif -%}
 
             {%- if _section.actions -%}
-              <ul class="menu menu--center">
+              <ul class="menu">
               {%- for _action in _section.actions -%}
                 {%- include snippets/get-nav-url.html path=_action.url -%}
                 {%- assign _url = __return -%}
@@ -75,67 +48,67 @@ full_width: true
 
           {%- if _section.children -%}
             {%- assign _size = _section.children | size  -%}
-            <div class="grid">
-              <div class="row">
-
-
-              {%- for child in _section.children -%}
-                <div class="content__col col-{{ 12 | divided_by: _size }} col-sm-12">
-
-                  <div class="content__row">
-                    <h4>{{ child.title }}</h4>
-
-                    {%- if child.description-%}
-                      <p>{{ child.description }}</p>
+            <div class="grid--container">
+              <div class="grid grid--p-3">
+
+                {%- for child in _section.children -%}
+                  <div class="cell cell--{{ 12 | divided_by: _size }} cell--sm-12">
+
+                    <div class="mb-5">
+                      <h4>{{ child.title }}</h4>
+
+                      {%- if child.excerpt-%}
+                        <p>{{ child.excerpt }}</p>
+                      {%- endif -%}
+
+                      {%- if child.actions -%}
+                        <ul class="menu">
+                          {%- for _action in child.actions -%}
+                            {%- include snippets/get-nav-url.html path=_action.url -%}
+                            {%- assign _url = __return -%}
+                            {%- assign _type = _action.type | default: 'outline-info' -%}
+                            <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
+                          {%- endfor -%}
+                        </ul>
+                      {%- endif -%}
+                    </div>
+
+                    {%- if child.image -%}
+
+                      {%- if child.image.url -%}
+                        {%- include snippets/get-nav-url.html path=child.image.url -%}
+                        {%- assign _item_image_url = __return -%}
+                      {%- else -%}
+                        {%- assign _item_image_url = nil -%}
+                      {%- endif -%}
+
+                      {%- if child.image.src -%}
+                        {%- include snippets/get-nav-url.html path=child.image.src -%}
+                        {%- assign _item_image_src = __return -%}
+                      {%- else -%}
+                        {%- assign _item_image_src = nil -%}
+                      {%- endif -%}
+                      {%- if child.image.is_row -%}
+                        <div class="mb-5">
+                      {%- endif -%}
+                          <div class="mx-auto" style="{{ child.image.style }}">
+                      {%- if _item_image_url -%}
+                            <a href="{{ _item_image_url }}">
+                      {%- endif -%}
+                      {%- if _item_image_src -%}
+                              <img src="{{ _item_image_src }}"/>
+                      {%- endif -%}
+                      {%- if _item_image_url -%}
+                            </a>
+                      {%- endif -%}
+                          </div>
+                      {%- if child.image.is_row -%}
+                        </div>
+                      {%- endif -%}
                     {%- endif -%}
 
-                    {%- if child.actions -%}
-                      <ul class="menu menu--center">
-                        {%- for _action in child.actions -%}
-                          {%- include snippets/get-nav-url.html path=_action.url -%}
-                          {%- assign _url = __return -%}
-                          {%- assign _type = _action.type | default: 'outline-info' -%}
-                          <li><a class="button button--{{ _type }} button--pill button--lg" href="{{ _url }}">{{ _action.text }}</a></li>
-                        {%- endfor -%}
-                      </ul>
-                    {%- endif -%}
                   </div>
-
-                  {%- if child.image -%}
-
-                    {%- if child.image.url -%}
-                      {%- include snippets/get-nav-url.html path=child.image.url -%}
-                      {%- assign _item_image_url = __return -%}
-                    {%- else -%}
-                      {%- assign _item_image_url = nil -%}
-                    {%- endif -%}
-
-                    {%- if child.image.src -%}
-                      {%- include snippets/get-nav-url.html path=child.image.src -%}
-                      {%- assign _item_image_src = __return -%}
-                    {%- else -%}
-                      {%- assign _item_image_src = nil -%}
-                    {%- endif -%}
-
-                    {%- if child.image.is_row -%}
-                      <div class="content__row">
-                    {%- endif -%}
-                    {%- if _item_image_url -%}
-                        <a href="{{ _item_image_url }}">
-                    {%- endif -%}
-                    {%- if _item_image_src -%}
-                          <img class="content__cover" src="{{ _item_image_src }}" style="{{ child.image.style }}"></img>
-                    {%- endif -%}
-                    {%- if _item_image_url -%}
-                        </a>
-                    {%- endif -%}
-                    {%- if child.image.is_row -%}
-                      </div>
-                    {%- endif -%}
-                  {%- endif -%}
-
-                </div>
-              {%- endfor-%}
+                {%- endfor-%}
 
               </div>
             </div>
@@ -143,12 +116,14 @@ full_width: true
 
           {%- if _section.image -%}
             {%- if _section.image.is_row -%}
-              <div class="content__row">
+              <div class="mb-5">
             {%- endif -%}
               {%- if child.image.url -%}
                 <a href="{{ child.image.url }}">
               {%- endif -%}
-                  <img class="content__cover" src="{{ _section.image.src }}" style="{{ _section.image.style }}"></img>
+                  {%- include snippets/get-nav-url.html path=_section.image.src -%}
+                  {%- assign _url = __return -%}
+                  <img class="hero__cover" src="{{ _url }}" style="{{ _section.image.style }}" />
               {%- if child.image.url -%}
                 </a>
               {%- endif -%}
@@ -160,6 +135,7 @@ full_width: true
         </div>
       </section>
   {%- endfor -%}
+  </div>
 </div>
 
 {{ content }}

data/_layouts/page.html

@@ -1,15 +1,14 @@
 ---
 layout: base
 ---
+{%- assign _page_mode = page.mode | default: layout.mode | default: site.data.variables.default.page.mode -%}
 {%- assign _page_type = page.type | default: layout.type | default: site.data.variables.default.page.type -%}
-
-{%- include snippets/page-title.html -%}
-{%- assign _page_title = __return -%}
+{%- assign _header_type = page.header.type | default: layout.header.type | default: site.data.variables.default.page.header.type -%}
+{%- assign _article_header_type = page.article_header.type | default: layout.article_header.type -%}
 
 {%- include snippets/assign.html
-  target=site.data.variables.default.page.show_header
-  source0=layout.show_header source1=page.show_header -%}
-{%- assign _show_header = __return -%}
+  target=layout.header source0=page.header -%}
+{%- assign _header = __return -%}
 
 {%- include snippets/assign.html
   target = site.data.variables.default.page.full_width
@@ -17,106 +16,191 @@ layout: base
 {%- assign _full_width = __return -%}
 
 {%- include snippets/assign.html
-  target=site.data.variables.default.page.show_title
-  source0=layout.show_title source1=page.show_title -%}
-{%- assign _show_title = __return -%}
+  target = site.data.variables.default.page.comment
+  source0=layout.comment source1=page.comment -%}
+{%- assign _comment = __return -%}
 
-{%- include snippets/assign.html
-  target=site.data.variables.default.page.show_edit_on_github
-  source0=layout.show_edit_on_github source1=page.show_edit_on_github -%}
-{%- assign _show_edit_on_github = __return -%}
+
+{%- assign _article_header_excerpt_truncate = include.excerpt_truncate | default: 200 -%}
 
 {%- if page.sidebar -%}
 <div class="layout--page layout--page--sidebar clearfix js-page-root">
   <div class="page__actions">
-    <div class="button button--circle  button--lg box-shadow-2 sidebar-button js-sidebar-show">
+    <div class="button button--circle button--lg box-shadow-2 sidebar-button js-sidebar-show">
       <i class="fas fa-bars icon--show"></i>
     </div>
   </div>
+  <div class="page__mask js-sidebar-hide"></div>
+
   <div class="page__sidebar">
     {%- include sidebar/toc.html -%}
   </div>
-  <div class="page__mask js-sidebar-hide"></div>
 
 {%- else -%}
-<div class="layout--page clearfix js-page-root">
+<div class="layout--page js-page-root">
 {%- endif -%}
 
-  {%- if _full_width -%}
-  <div class="page__main js-page-main full-width">
-  {%- elsif page.aside -%}
-  <div class="page__main js-page-main has-aside">
-  {%- else -%}
-  <div class="page__main js-page-main">
+  {%- assign _page_main_class = 'page__main js-page-main' -%}
+  {%- if _page_mode == 'immersive' -%}
+    {%- assign _page_main_class = _page_main_class | append: ' page__main--immersive' -%}
   {%- endif -%}
+  {%- if page.aside -%}
+    {%- assign _page_main_class = _page_main_class | append: ' has-aside' -%}
+  {%- elsif _full_width -%}
+    {%- assign _page_main_class = _page_main_class | append: ' full-width' -%}
+  {%- endif -%}
+  <div class="{{ _page_main_class }}">
 
     <div class="page__main-inner">
-    <div></div>
-    {%- if _show_header -%}
-      <div class="page__header">{%- include header.html -%}</div>
+      <div></div>
+    {%- if _header != false -%}
+      <div class="page__header">
+      {%- if _header_type == 'normal' -%}
+        {%- include header.html -%}
+      {%- elsif _header_type == 'translucent' -%}
+        {%- assign _header_theme = page.header.theme | default: layout.header.theme | default: site.data.variables.default.page.header.theme -%}
+        {%- if _header_theme == 'dark'-%}
+          {%- include header.html theme='dark'-%}
+        {%- else -%}
+          {%- include header.html theme='light'-%}
+        {%- endif -%}
+      {%- endif -%}
+      </div>
     {%- endif -%}
+
+
       <div class="page__content">
-      {%- if _full_width == false -%}
-        <div class ="main">
-      {%- endif -%}
+      {%- if _article_header_type == 'overlay' or _article_header_type == 'cover' -%}
+
+        {%- if _article_header_type == 'overlay' -%}
+
+          {%- assign _article_header_height = page.article_header.height | default: layout.article_header.height -%}
+          {%- assign _article_header_align = page.article_header.align | default: layout.article_header.align | default: site.data.variables.default.page.article_header.align -%}
+          {%- assign _article_header_theme = page.article_header.theme | default: layout.article_header.theme | default: site.data.variables.default.page.article_header.theme -%}
 
-          <div class="col-aside js-col-aside">
-            {%- if page.aside -%}
-              <aside class="page__aside js-page-aside">
-                {%- include aside/toc.html -%}
-              </aside>
+          {%- if page.article_header.background_image.src -%}
+            {%- assign _header_background_image_src = page.article_header.background_image.src -%}
+          {%- elsif page.article_header.background_image != false and page.cover -%}
+            {%- assign _header_background_image_src = page.cover -%}
+          {%- endif -%}
+
+          {%- if page.article_header.background_image.gradient -%}
+            {%- assign _header_background_image = page.article_header.background_image.gradient -%}
+            {%- if _header_background_image_src -%}
+              {%- assign _header_background_image = _header_background_image | append: ',' -%}
             {%- endif -%}
-          </div>
+          {%- endif -%}
+
+          {%- if _header_background_image_src -%}
+            {%- include snippets/get-nav-url.html path=_header_background_image_src -%}
+            {%- assign _header_background_image_src = __return -%}
+            {%- assign _header_background_image = _header_background_image
+              | append: 'url(' | append: _header_background_image_src  | append: ')'-%}
+          {%- endif -%}
+
+          {%- assign _header_style = 'background-image:' | append: _header_background_image | append: ';' -%}
+
+          {%- if page.article_header.background_color -%}
+            {%- assign _header_style = _header_style | append: 'background-color:' | append: page.article_header.background_color | append: ';' -%}
+          {%- endif -%}
 
-          <div class="col-main">
-            {%- if _page_type == 'article' -%}
-              <article itemscope itemtype="http://schema.org/Article">
-            {%- elsif _page_type == 'webpage' -%}
-              <article itemscope itemtype="http://schema.org/WebPage">
+          {%- if _article_header_height -%}
+            {%- assign _header_style = _header_style | append: 'min-height:' | append: _article_header_height | append: ';' -%}
+          {%- endif -%}
+
+          <div class="article__header--overlay">
+
+          {%- if _article_header_theme == 'light' -%}
+            {%- if _article_header_align == 'center' -%}
+              <div class="hero hero--center hero--light overlay" style="{{ _header_style }}">
             {%- else -%}
-              <article>
+              <div class="hero hero--light overlay" style="{{ _header_style }}">
             {%- endif -%}
-              {%- if _show_title or _show_edit_on_github -%}
-                <div class="article__header">
-              {%- endif -%}
-                  {%- if _show_title -%}
-                    <header><h1 itemprop="headline">{{ _page_title }}</h1></header>
-                  {%- else -%}
-                    <header style="display: none;"><h1 itemprop="headline">{{ _page_title }}</h1></header>
-                  {%- endif-%}
-                  {%- if _show_edit_on_github -%}
-                    {%- if site.repository and site.repository_tree -%}
-                      {%- include snippets/is_collection.html page=page -%}
-                      {%- assign _is_page_collection = __return -%}
-                      {%- include snippets/locale-to-string.html locale=site.data.locale.POST_ON_GITHUB -%}
-                      {%- assign _locale_post_on_github = __return -%}
-                      {%- if _is_page_collection -%}
-                        {%- include snippets/prepend-path.html path=page.path prepend_path=site.collections_dir -%}
-                        {%- assign _page_path = __return -%}
-                      {%- else -%}
-                        {%- assign _page_path = page.path -%}
-                      {%- endif -%}
-                      {%- assign _github_path = site.repository | append: '/tree/' | append: site.repository_tree | append: '/' | append: _page_path | replace:'//','/' -%}
-                      <span class="split-space">&nbsp;</span>
-                      <a class="edit-on-github"
-                        title="{{ _locale_post_on_github }}"
-                        href="https://github.com/{{ _github_path }}">
-                        <i class="far fa-edit"></i></a>
+          {%- elsif _article_header_theme == 'dark' -%}
+            {%- if _article_header_align == 'center' -%}
+              <div class="hero hero--center hero--dark overlay" style="{{ _header_style }}">
+            {%- else -%}
+              <div class="hero hero--dark overlay" style="{{ _header_style }}">
+            {%- endif -%}
+          {%- else -%}
+            {%- if _article_header_align == 'center' -%}
+              <div class="hero hero--center overlay" style="{{ _header_style }}">
+            {%- else -%}
+              <div class="hero overlay" style="{{ _header_style }}">
+            {%- endif -%}
+          {%- endif -%}
+                <div class="hero__content">
+                  {%- if _full_width == false -%}
+                    <div class ="main">
+                  {%- endif -%}
+                    {%- include article-info.html article=page semantic=false -%}
+                    {%- include article-header.html article=page semantic=false -%}
+                    {%- if page.excerpt -%}
+                      <p class="overlay__excerpt">{{ page.excerpt | strip_html | strip_newlines | strip | truncate: _article_header_excerpt_truncate }}</p>
                     {%- endif -%}
+                    {%- if page.article_header.actions -%}
+                      <ul class="menu">
+                        {%- for _action in page.article_header.actions -%}
+                          {%- include snippets/get-nav-url.html path=_action.url -%}
+                          {%- assign _url = __return -%}
+                          {%- assign _type = _action.type | default: 'info' -%}
+                          <li><a class="button button--{{ _type }} button--rounded button--xl" href="{{ _url }}">{{ _action.text }}</a></li>
+                        {%- endfor -%}
+                      </ul>
+                    {%- endif -%}
+                  {%- if _full_width == false -%}
+                    </div>
                   {%- endif -%}
-              {%- if _show_title or _show_edit_on_github -%}
                 </div>
-              {%- endif -%}
+              </div>
+          </div>
+        {%- elsif _article_header_type == 'cover' -%}
+          {%- if page.article_header.image.src -%}
+            {%- include snippets/get-nav-url.html path=page.article_header.image.src -%}
+            {%- assign _header_image_src = __return -%}
+            <img class="article__header--cover" src="{{ _header_image_src }}"></img>
+          {%- endif -%}
+        {%- endif -%}
+
+      {%- endif -%}
 
-              {%- include article-info.html article=page -%}
 
-              <div class="js-article-content">{{ content }}</div>
+      {%- if _full_width == false -%}
+        <div class ="main">
+      {%- endif -%}
+          <div class="grid grid--reverse">
+
+             <div class="col-aside js-col-aside">
+              {%- if page.aside -%}
+                <aside class="page__aside js-page-aside">
+                  {%- include aside/toc.html -%}
+                </aside>
+              {%- endif -%}
+            </div>
+
+            <div class="col-main cell--auto">
+              {%- if _page_type == 'article' -%}
+                <article itemscope itemtype="http://schema.org/Article">
+              {%- elsif _page_type == 'webpage' -%}
+                <article itemscope itemtype="http://schema.org/WebPage">
+              {%- else -%}
+                <article>
+              {%- endif -%}
 
-              {%- if jekyll.environment != "development" and page.comment != false -%}
-                <section class="page__comments">{%- include comments.html -%}</section>
+              {%- if _article_header_type == 'overlay' or page.article_header == false -%}
+                {%- include article-header.html article=page html=false -%}
+                {%- include article-info.html article=page html=false -%}
+              {%- else -%}
+                {%- include article-header.html article=page -%}
+                {%- include article-info.html article=page -%}
               {%- endif -%}
 
-            </article>
+                  <div class="js-article-content">{{ content }}</div>
+                  {%- if jekyll.environment != "development" and _comment != false -%}
+                    <section class="page__comments">{%- include comments.html -%}</section>
+                  {%- endif -%}
+              </article>
+            </div>
           </div>
 
       {%- if _full_width == false -%}
@@ -127,7 +211,7 @@ layout: base
       <div class="page__footer">{%- include footer.html -%}</div>
     </div>
   </div>
-  {%- if _show_header -%}
+  {%- if _header != false -%}
     <div class="page__search-panel">{%- include search.html -%}</div>
   {%- endif -%}
 </div>