diff --git a/_includes/head.html b/_includes/head.html
index 03d16ba..770a7bf 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -4,10 +4,8 @@
{%- seo -%}
- {%- if site.favicon -%}
- {%- endif -%}
-
+
{%- feed_meta -%}
{%- if jekyll.environment == 'production' and site.google_analytics -%}
diff --git a/_includes/views/banner.html b/_includes/views/banner.html
index 7878997..baa8465 100644
--- a/_includes/views/banner.html
+++ b/_includes/views/banner.html
@@ -21,7 +21,7 @@
{% if banner %}
{% assign auto_banner = true %}
- {% assign array = banner | split: '//' %}
+ {% assign array = banner | split: '/' %}
{% assign protocol = array[0] %}
{% if array.size > 1 and (protocol == '' or protocol == 'http:' or protocol == 'https:') %}
@@ -57,9 +57,23 @@
{%- if auto_banner -%}
+
{%- assign selector = ".page-banner-img" -%}
- {%- assign seed = page.id | append: '-seed-' | append: banner -%}
+
+ {%- if banner == "default" -%}
+
+ {%- assign heading = page.heading | default: page.title | escape -%}
+ {%- assign subheading = page.subheading | default: page.subtitle | escape -%}
+ {%- assign seed = page.date | append: heading | append: subheading -%}
+
+ {%- else -%}
+
+ {%- assign seed = 'theme-' | append: banner -%}
+
+ {%- endif -%}
+
{%- include extensions/trianglify.html -%}
+
{%- endif -%}
{%- endif -%}
diff --git a/_includes/views/site-brand.html b/_includes/views/site-brand.html
index cbb3b6c..e1ad4a8 100644
--- a/_includes/views/site-brand.html
+++ b/_includes/views/site-brand.html
@@ -1,7 +1,4 @@
-
- {%- if site.favicon -%}
- 
- {%- endif -%}
+
+ 
{{ site.title | escape }}
diff --git a/_sass/yat.scss b/_sass/yat.scss
index 52162d7..c36c55c 100644
--- a/_sass/yat.scss
+++ b/_sass/yat.scss
@@ -31,7 +31,7 @@ $footer-height: $header-height * 1.05 !default;
$footer-text-color: rgba(lighten(invert($theme-color), 30%), 50%) !default;
$footer-background-color: darken($theme-color, 5%) !default;
-$banner-height: 350px !default;
+$banner-height: 380px !default;
$banner-text-color: lighten($white-color, 0%) !default;
$banner-background: darken(#333, 5%) !default;
diff --git a/_sass/yat/_base.scss b/_sass/yat/_base.scss
index 15eacde..e92c561 100644
--- a/_sass/yat/_base.scss
+++ b/_sass/yat/_base.scss
@@ -226,15 +226,6 @@ table {
}
}
-/**
- * Vertical center
- */
-%vertical-center {
- position: absolute;
- top: 50%;
- transform: translateY(-50%);
-}
-
/**
* Flex layout
*/
@@ -256,3 +247,33 @@ table {
transform: scale(0.9999); /* <-- fix the sticky x overflow issue */
top: $top;
}
+
+/**
+ * Vertical center
+ */
+@mixin vertical-center($position) {
+ position: $position;
+ top: 50%;
+ transform: translateY(-50%);
+}
+
+/**
+ * Horizontal center
+ */
+@mixin horizontal-center($position) {
+ position: $position;
+ left: 50%;
+ transform: translateX(-50%);
+}
+
+/**
+ * Center background image
+ */
+@mixin center-image {
+ height: 100%;
+ max-width: 1000%;
+ background-size: cover;
+ background-position: center center;
+ overflow: hidden;
+}
+
diff --git a/_sass/yat/_layout.scss b/_sass/yat/_layout.scss
index 3db7dde..757593f 100644
--- a/_sass/yat/_layout.scss
+++ b/_sass/yat/_layout.scss
@@ -16,36 +16,30 @@
}
.site-brand {
- @extend %vertical-center;
-
- float: left;
- height: 100%;
- max-height: 100%;
+ @include vertical-center(absolute);
margin-right: 50px;
- .site-favicon {
- margin-right: 10px;
- height: 65%;
- max-height: 65%;
- border-radius: 65%;
- box-shadow: 0 0 2px #080808d1;
- transition: 0.2s;
-
- &:hover {
- box-shadow: 0 0 5px #080808d1;
- }
- }
-
- .site-title {
+ .site-brand-inner {
@include relative-font-size(1.125);
font-weight: $base-font-weight;
- line-height: $header-height;
- text-shadow: 0 0 3px #080808d1;
+ filter: drop-shadow(0 0 2px #08080880);
+ text-shadow: 0 0 2px #080808d0;
letter-spacing: -1px;
+ transition: drop-shadow 0.2s;
&, &:visited {
color: $header-text-color;
}
+
+ &:hover {
+ filter: drop-shadow(0 0 3px #080808a0);
+ }
+
+ .site-favicon {
+ display: inline-block;
+ height: $header-height / 1.5;
+ margin-right: 5px;
+ }
}
}
@@ -157,7 +151,7 @@
*/
.page-content {
@extend %flex-1; /* <-- Keep footer on the bottom */
- padding: $spacing-unit 0;
+ padding: $spacing-unit * 1.5 0;
}
.page-heading {
@@ -280,19 +274,12 @@
.page-banner-img {
position: absolute;
+ width: 100%;
height: 100%;
overflow: hidden;
& > *:first-child {
- position: relative;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- height: 100%;
- max-width: 1000%;
- background-size: cover;
- background-position: center center;
- overflow: hidden;
+ @include center-image;
}
}
@@ -301,9 +288,8 @@
}
.page-banner-inner {
- @extend %vertical-center;
+ @include vertical-center(relative);
- position: relative;
color: $banner-text-color;
padding: 10px 5px;
text-shadow: 1px 1px 2px #333;
diff --git a/assets/main.scss b/assets/main.scss
index 393c8e9..112a9ef 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -4,7 +4,7 @@
// Default theme colors
$theme-colors: (
- spacegrey: #222222,
+ spacegrey: #353535,
inkpurple: #543581,
aquablue: #00aaa0,
azureblue: #2863b1,
@@ -19,7 +19,7 @@ $theme-color: map-get($theme-colors, "spacegrey");
@if map-has-key($theme-colors, $theme-name) {
$theme-color: map-get($theme-colors, $theme-name);
} @else if str-index($theme-name, "#") == 1 {
- $theme-color: {{ site.theme_color | default: '#222' }};
+ $theme-color: {{ site.theme_color | default: '#353535' }};
}
@import "yat";
diff --git a/index.html b/index.html
index 171e0c6..e326e28 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,7 @@
---
+# Feel free to add content and custom Front Matter to this file.
+# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
+
layout: home
title: home
---