diff --git a/src/index.jade b/src/index.jade
index 3f3c3c1..a5621b7 100644
--- a/src/index.jade
+++ b/src/index.jade
@@ -3,16 +3,22 @@ extends templates/head
block title
| Koodiklinikka
-block header_content
- video(autoplay, loop, poster='images/poster.jpg', class='header__video-bg')
- source(src='videos/jumbo.mp4', type='video/mp4')
- .header__container
- .header__nav
- a(href='/') etusivu
- a(href='/yhdistys.html') yhdistys
- .header__headline
- .header__logo
- h1.header__title Yhteisö kaikille ohjelmoinnista ja ohjelmistoalasta kiinnostuneille harrastajille ja ammattilaisille.
+block header
+ .header.header--promo
+ .header__container
+ .header__nav
+ a(href='/') etusivu
+ a(href='/yhdistys.html') yhdistys
+ .header__headline
+ .header__logo
+ h1.header__title
+ |Koodiklinikka yhteistyössä 1. - 2. maaliskuuta 2018 Helsingissä järjestettävän
+ |ngVikings-tapahtuman kanssa!
+
+ .promo
+ | Varaa paikkasi tapahtumaan
+ |tästä!
+
block content
.content.with-feed
diff --git a/src/styles/_header.styl b/src/styles/_header.styl
index db74ade..f91e227 100644
--- a/src/styles/_header.styl
+++ b/src/styles/_header.styl
@@ -17,14 +17,18 @@ headerHeight = 400px
display none
.header__container
- background #3E7394
- background linear-gradient(120deg, rgba(#085078, 0.8) 10%, rgba(#85D8CE, 0.7) 90%)
+ background linear-gradient(120deg, rgba(5, 164, 255, 0.55) 10%, rgba(5, 86, 117, 0.47) 90%)
display table
height 100%
text-align center
vertical-align middle
width 100%
+.header__headline
+ display table-cell
+ padding 0 1em
+ vertical-align middle
+
.header__nav
position absolute
right 60px
@@ -62,29 +66,14 @@ headerHeight = 400px
position absolute
text-shadow none
-.header__headline
- display table-cell
- padding 0 1em
- vertical-align middle
-
.header__logo
background url('../images/logo.png')
background-size contain
- display inline-block
- height 180px
- margin-right 2em
- vertical-align middle
- width 180px
-
- @media screen and (max-width: 1030px)
- height 120px
- margin-right 1.5em
- width 120px
-
- @media screen and (max-width: 810px)
- height 80px
- margin 0 0 1.5em
- width 80px
+ height 70px
+ width 70px
+ position absolute
+ top 1em
+ left 1em
.header__title
color #fff
@@ -115,6 +104,26 @@ headerHeight = 400px
color inherit
text-decoration underline
+.header--promo
+ background-image url('https://ngvikings.org/images/backgrounds/home.jpg')
+.header--promo .header__container
+ background linear-gradient(180deg, rgba(5, 164, 255, 0.28) 10%, rgba(0, 0, 0, 0.5) 90%)
+
+.header--promo .header__title
+ font-size 2.5em
+ @media screen and (max-width: 1030px)
+ font-size 2em
+ @media screen and (max-width: 810px)
+ text-align left
+ max-width 640px
+ padding-top 2em
+ @media screen and (max-width: 530px)
+ font-size 1.75em
+
+.header--promo .promo
+ color #ffcc00
+ font-size 0.75em
+ margin-top 0.5em
.header__video-bg
height 100%
position absolute
diff --git a/src/templates/head.jade b/src/templates/head.jade
index f45092d..104e046 100644
--- a/src/templates/head.jade
+++ b/src/templates/head.jade
@@ -42,9 +42,7 @@ html
body
.site
.container
- .header
- block header_content
-
+ block header
block content
footer
diff --git a/src/yhdistys.jade b/src/yhdistys.jade
index 028541a..1ef180a 100644
--- a/src/yhdistys.jade
+++ b/src/yhdistys.jade
@@ -3,16 +3,17 @@ extends templates/head
block title
| Yhdistys
-block header_content
- .header__container
- .header__nav
- a(href='/') etusivu
- a(href='/yhdistys.html') yhdistys
- .header__headline
- .header__logo
- h1.header__title Koodiklinikka ry
- .header__members
- #members
+block header
+ .header
+ .header__container
+ .header__nav
+ a(href='/') etusivu
+ a(href='/yhdistys.html') yhdistys
+ .header__headline
+ .header__logo
+ h1.header__title Koodiklinikka ry
+ .header__members
+ #members
block content
.content