feat: article_header.background_image default to cover

varunkuntal · Sep 16, 2018 · efd60c7 · efd60c7
1 parent 664a1f9
commit efd60c7
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 13 deletions.
diff --git a/_layouts/page.html b/_layouts/page.html
@@ -78,18 +78,26 @@
           {%- 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 -%}
 
+          {%- 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 page.article_header.background_image.src -%}
+            {%- if _header_background_image_src -%}
               {%- assign _header_background_image = _header_background_image | append: ',' -%}
             {%- endif -%}
           {%- endif -%}
-          {%- if page.article_header.background_image.src -%}
-            {%- include snippets/get-nav-url.html path=page.article_header.background_image.src -%}
+
+          {%- 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 -%}

diff --git a/docs/_docs/en/2.3-layouts.md b/docs/_docs/en/2.3-layouts.md
@@ -68,14 +68,27 @@ Base on Base Layout.
 
 | Variable          | Option Values         | Description |
 | ---               | ---                   | ---         |
-| **type**          | overlay, cover | |
+| **type**          | overlay, cover        | |
 | **align**         | left (default), center | |
 | **theme**         | light (default), dark | |
-| **background_color** | `!!str`            | Available when type is `overlay`. |
-| **background_image** | `!!str`            | Available when type is `overlay`. |
-| **image**         | `!!str`               | Available when type is `cover`. |
+| **background_color** | `!!str`            | Available when type is `overlay`. If set to a dark color, you need set theme as 'dark'. |
+| **background_image** | `!!map`            | Available when type is `overlay`, set as `false` can overwrite `cover` to disable background image. |
+| **image**         | `!!map`               | Available when type is `cover`. |
 | **actions**       | `!!seq`               | |
 
+### article_header.background_image
+
+| Variable          | Option Values         | Description |
+| ---               | ---                   | ---         |
+| **gradient**      | `!!str`               | |
+| **src**           | `!!str`               | Default to `cover` |
+
+### article_header.image
+
+| Variable          | Option Values         | Description |
+| ---               | ---                   | ---         |
+| **src**           | `!!str`               | |
+
 ### aside
 
 | Variable          | Option Values         | Description |
@@ -121,7 +134,7 @@ Base on Page Layout.
 | **show_readmore** | true, false (default) | Available when type is `normal`. |
 | **show_info**     | true, false (default) | Available when type is `normal` or `brief`. |
 
-#### excerpt_type
+### articles.excerpt_type
 
 Each post automatically takes the first block of text, from the beginning of the content to the first occurrence of `excerpt_separator`, and sets it as the post’s excerpt.
 

diff --git a/docs/_docs/zh/2.3-layouts.md b/docs/_docs/zh/2.3-layouts.md
@@ -68,14 +68,27 @@ graph TB;
 
 | 配置项             | 可选值                 | 描述        |
 | ---               | ---                   | ---         |
-| **type**          | overlay, cover    | |
+| **type**          | overlay, cover        | |
 | **align**         | left (default), center | |
 | **theme**         | light (default), dark | |
-| **background_color** | `!!str`            | 当 type 为 `overlay` 时有效。 |
-| **background_image** | `!!str`            | 当 type 为 `overlay` 时有效。 |
-| **image**         | `!!str`               | 当 type 为 `cover` 时有效。 |
+| **background_color** | `!!str`            | 当 type 为 `overlay` 时有效。当设置的背景色较深时，你需要设置 `theme` 为 dark。 |
+| **background_image** | `!!map`            | 当 type 为 `overlay` 时有效，设置为 `false` 可覆盖 `cover` 禁止背景图片。 |
+| **image**         | `!!map`               | 当 type 为 `cover` 时有效。 |
 | **actions**       | `!!seq`               | |
 
+### article_header.background_image
+
+| Variable          | Option Values         | Description |
+| ---               | ---                   | ---         |
+| **gradient**      | `!!str`               | |
+| **src**           | `!!str`               | 默认为 `cover` |
+
+### article_header.image
+
+| Variable          | Option Values         | Description |
+| ---               | ---                   | ---         |
+| **src**           | `!!str`               | |
+
 ### aside
 
 | 配置项             | 可选值                 | 描述        |
@@ -121,7 +134,7 @@ Base on Page Layout.
 | **show_readmore** | true, false (default) | 当 type 为 `normal` 时有效。 |
 | **show_info**     | true, false (default) | 当 type 为 `normal` 或 `brief` 时有效。 |
 
-#### excerpt_type
+### articles.excerpt_type
 
 文章列表中文章项的摘要有两种模式——TEXT 模式和 HTML 模式。
 

diff --git a/docs/_page/2.1-article-header-overlay-background-fill.md b/docs/_page/2.1-article-header-overlay-background-fill.md
@@ -8,6 +8,7 @@ article_header:
   type: overlay
   theme: dark
   background_color: '#123'
+  background_image: false
 ---
 
 A post has an article header overlay with a solid background color (#123).
@@ -23,4 +24,5 @@ A post has an article header overlay with a solid background color (#123).
       type: overlay
       theme: dark
       background_color: '#123'
+      background_image: false
     ---
diff --git a/...page/3.1-article-header-overlay-background-fill-immersive-translucent-header.md b/...page/3.1-article-header-overlay-background-fill-immersive-translucent-header.md
@@ -12,6 +12,7 @@ article_header:
   type: overlay
   theme: dark
   background_color: '#123'
+  background_image: false
 ---
 
 A post has an article header overlay with a solid background color (#123) in immersive mode with a translucent header.
@@ -37,4 +38,5 @@ A post has an article header overlay with a solid background color (#123) in imm
       type: overlay
       theme: dark
       background_color: '#123'
+      background_image: false
     ---