feat: remove header.type and add header.background

varunkuntal · Sep 22, 2018 · d3e5a1b · d3e5a1b
1 parent c7fc673
commit d3e5a1b
Show file tree

Hide file tree

Showing 7 changed files with 27 additions and 40 deletions.
diff --git a/_data/variables.yml b/_data/variables.yml
@@ -18,9 +18,6 @@ default:
   page:
     mode: normal
     type: webpage
-    header:
-      type: normal
-      theme: light
     article_header:
       align: left
       theme: light

diff --git a/_includes/article-list.html b/_includes/article-list.html
@@ -107,7 +107,7 @@
       {%- if include.size == 'sm' -%}
         <div class="cell cell--3 cell--md-4 cell--sm-12">
           <div class="card">
-            {%- if _article_cover -%}
+            {%- if _article.cover -%}
               <div class="card__image">
                 <img class="image" src="{{ _article_cover }}" />
                 <div class="overlay overlay--bottom">
@@ -123,7 +123,7 @@
 
         <div class="cell cell--4 cell--md-6 cell--sm-12">
           <div class="card card--flat">
-            {%- if _article_cover -%}
+            {%- if _article.cover -%}
               <div class="card__image"><img src="{{ _article_cover }}" /></div>
             {%- endif -%}
               <div class="card__content">

diff --git a/_includes/header.html b/_includes/header.html
@@ -1,9 +1,9 @@
 {%- if include.theme == 'dark' -%}
-  <header class="header header--dark">
+  <header class="header header--dark" {%- if include.background -%} style="background: {{ include.background }};" {%- endif -%}>
 {%- elsif include.theme == 'light' -%}
-  <header class="header header--light">
+  <header class="header header--light" {%- if include.background -%} style="background: {{ include.background }};" {%- endif -%}>
 {%- else -%}
-  <header class="header">
+  <header class="header" {%- if include.background -%} style="background: {{ include.background }};" {%- endif -%}>
 {%- endif -%}
     <div class="main">
       <div class="header__title">

diff --git a/_layouts/page.html b/_layouts/page.html
@@ -3,7 +3,6 @@
 ---
 {%- 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 -%}
-{%- 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
@@ -55,15 +54,13 @@
       <div></div>
     {%- if _header != false -%}
       <div class="page__header">
-      {%- if _header_type == 'normal' -%}
+      {%- assign _header_theme = page.header.theme | default: layout.header.theme -%}
+      {%- if _header_theme == 'dark'-%}
+        {%- include header.html theme='dark' background=page.header.background -%}
+      {%- elsif _header_theme == 'light' -%}
+        {%- include header.html theme='light' background=page.header.background -%}
+      {%- else -%}
         {%- 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 -%}

diff --git a/_sass/components/_header.scss b/_sass/components/_header.scss
@@ -87,22 +87,21 @@
         display: none;
       }
     }
-  }
-}
-
-.navigation__link {
-  &::after {
-    display: block;
-    margin-bottom: -4px;
-    content: "";
-    @include split-line(bottom, 4px, transparent);
-  }
-}
-.navigation__link--active {
-  a {
-    @include link-colors($main-color-1, $main-color-1);
-  }
-  &::after {
-    @include split-line(bottom, 4px, $main-color-1);
+    .navigation__link {
+      &::after {
+        display: block;
+        margin-bottom: -4px;
+        content: "";
+        @include split-line(bottom, 4px, transparent);
+      }
+    }
+    .navigation__link--active {
+      a {
+        @include link-colors($main-color-1, $main-color-1);
+      }
+      &::after {
+        @include split-line(bottom, 4px, $main-color-1);
+      }
+    }
   }
 }
diff --git a/docs/_data/variables.yml b/docs/_data/variables.yml
@@ -18,9 +18,6 @@ default:
   page:
     mode: normal
     type: webpage
-    header:
-      type: normal
-      theme: light
     article_header:
       align: left
       theme: light

diff --git a/test/_data/variables.yml b/test/_data/variables.yml
@@ -18,9 +18,6 @@ default:
   page:
     mode: normal
     type: webpage
-    header:
-      type: normal
-      theme: light
     article_header:
       align: left
       theme: light