jekyll-theme-pirati 0.1.0 → 0.2.0

data/_sass/layouts/_cast.scss

@@ -0,0 +1,262 @@
+$dark: #343434;
+%before-util{
+  content: '';
+  display: block;
+  position: absolute;
+  z-index: -1;
+  background: rgba($dark, .95);
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+}
+%before-pattern{
+  background: -webkit-linear-gradient(-90deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), -webkit-linear-gradient(0deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), rgba(0,0,0,0.5);
+  background: -moz-linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), -moz-linear-gradient(90deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), rgba(0,0,0,0.5);
+  background: linear-gradient(180deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), linear-gradient(90deg, rgba(0,0,0,0) 0, rgba(0,0,0,0) 20%, rgba(0,0,0,0.1) 20%, rgba(0,0,0,0.1) 40%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0.2) 60%, rgba(0,0,0,0.4) 60%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,0.5) 80%, rgba(0,0,0,0.5) 100%), rgba(0,0,0,0.5);
+  -webkit-box-sizing: content-box;
+  -moz-box-sizing: content-box;
+  box-sizing: content-box;
+  -o-text-overflow: clip;
+  text-overflow: clip;
+
+  background-position: auto auto;
+  -webkit-background-origin: padding-box;
+  background-origin: padding-box;
+  -webkit-background-clip: border-box;
+  background-clip: border-box;
+  -webkit-background-size: 100% 100%;
+  background-size: 100% 100%;
+}
+.l-cast{
+  $unit: 1.125rem;
+  $light: #fff;
+  $accent: #f3c289;
+  position: relative;
+  &:before{
+    @extend %before-util;
+    background: url(https://upload.wikimedia.org/wikipedia/commons/thumb/0/0b/Slune%C4%8Dn%C3%AD_n%C3%A1m%C4%9Bst%C3%AD_Praha_13_2010.jpg/1200px-Slune%C4%8Dn%C3%AD_n%C3%A1m%C4%9Bst%C3%AD_Praha_13_2010.jpg);
+    background-size: contain;
+    background-repeat: no-repeat;
+    width: 1460px;
+    filter: grayscale(100%);
+    left: calc(50% - 730px);
+  }
+
+  &__top-bar{
+    background-color: $dark;
+    color: white;
+    text-align: center;
+    padding: 0;
+    position: sticky;
+    top: 0px;
+    z-index: 10;
+    &__list{
+      background-color: transparent !important;
+      &-item{
+        padding: $unit;
+        a{
+          color: $light !important;
+          font-size: 1rem !important;
+        }
+      }
+    }
+  }
+  &__toggle{
+    &--more{
+      display: block;
+      text-align: center;
+      position: relative;
+      margin: $unit 0;
+      color: rgba($dark,.5);
+      &:before{
+        @extend %before-util;
+        top: auto;
+        height: 1px;
+        opacity: .3;
+        bottom: 50%;
+        right: 75%;
+      }
+      &:after{
+        @extend %before-util;
+        top: auto;
+        height: 1px;
+        opacity: .3;
+        bottom: 50%;
+        left: 75%;
+      }
+    }
+  }
+  &__hero{
+    padding: 8*$unit 0;
+    overflow: hidden;
+    position: relative;
+    line-height: 1;
+
+
+    small{
+      font-size: 1.5rem;
+    }
+    &:before{
+      @extend %before-util;
+      @extend %before-pattern;
+      transform: rotate(-45deg) translate(-5%, -55%);
+      width: 60vw;
+      height: 60vw;
+    }
+    &:after{
+      @extend %before-util;
+      @extend %before-pattern;
+      transform: rotate(585deg) translate(-65%, 85%);
+      opacity: 0.2;
+      width: 80vh;
+      height: 80vh;
+    }
+    &-subhead{
+      line-height: 1.25;
+      margin-bottom: $unit;
+    }
+    &-head{
+      font-size: 6em;
+      font-weight: bold;
+      color: white;
+    }
+    &-text{
+      position: relative;
+      background: rgba(#ffffff,.85);
+      padding: 2*$unit;
+    }
+  }
+  &__heading{
+    text-align: center;
+    font-size: 2.5em;
+    margin: 4*$unit 0;
+    position: relative;
+    color: white;
+    position: sticky;
+    top: 64px;
+    z-index: 1;
+    &:before{
+      @extend %before-util;
+      top: -$unit;
+      bottom: -$unit;
+      right: 20%;
+      transform: skew(45deg);
+    }
+    &:after{
+      @extend %before-util;
+      top: -$unit;
+      bottom: -$unit;
+      left: 20%;
+      transform: skew(-45deg);
+    }
+  }
+  &__perex{
+    font-size: 1.25em;
+    .l-cast__kan ~ section &{
+      margin-bottom: 3*$unit;
+    }
+    &-columns{
+      $u: 1.25rem;
+      column-count: 2;
+      column-gap: 2*$u;
+      padding: $u 0;
+      margin-bottom: 2*$u;
+    }
+  }
+  &__kan{
+    margin-top: -5*$unit - .75rem;
+    //overflow: hidden;
+    .l-kan__item{
+      border-top: none;
+    }
+    &-img{
+      position: relative;
+      &:before{
+        @extend %before-util;
+        background: rgba($dark,.1) !important;
+        transform: rotate(45deg) translate(-0%, -62%);
+        opacity: 0.5;
+        width: 5*$unit;
+        height: 80vh;
+      }
+      img{
+        position: sticky;
+        top: 120px;
+      }
+    }
+    &-item:nth-of-type(even) &-img{
+      &:before{
+        @extend %before-util;
+        transform: rotate(-45deg) translate(450%, -30%);
+      }
+    }
+  }
+  &__activity{
+    $u: 1.25rem;
+    &-perex{
+      &-item{
+        padding-top: $u;
+        padding-bottom: $u;
+        display: flex;
+      }
+      &-icon{
+        font-size: 3rem;
+        line-height: 5rem;
+        vertical-align: middle;
+        display: block;
+        text-align: center;
+        border-radius: 50%;
+        background: $dark;
+        color: white;
+        width: 5rem;
+        height: 5rem;
+        flex-basis: 5rem;
+        flex-shrink: 0;
+        margin: 0 2*$u;
+      }
+    }
+  }
+  &__priority,&__connect{
+    $u: 1.25rem;
+    &-detail{
+      background: rgba($dark,.05);
+      &-title{
+        margin: $u 0;
+        padding: $u 0;
+        position: relative;
+        font-size: 1.75em;
+        &:before{
+          @extend %before-util;
+          //right: -100%;
+          //border-bottom: 1px solid $dark;
+          top: auto;
+          height: 1px;
+        }
+        p + &{
+          margin-top: 2*$u;
+        }
+      }
+    }
+    &-row{
+      //border-top: 1px solid rgba(black, .1);
+      //padding-top: 4*$unit;
+    }
+    &-perex{
+      position: sticky;
+      top: 144px;
+      &-item{
+        padding: $u 2*$u 2*$u 0;
+        & + &{
+          border-top: 1px solid rgba(black, .1);
+          padding-top: 2*$u;
+        }
+      }
+    }
+  }
+  &__end{
+    p+p{
+
+    }
+  }
+}

data/_sass/layouts/_kandidatka.scss

@@ -0,0 +1,78 @@
+.l-kan{
+  $kandidate__margin: .85em;
+  &__item{
+    display: flex;
+    border-top: 1px solid rgba(black, .1);
+    padding-top: 4*$kandidate__margin;
+    &:nth-of-type(even) &-img{
+      order: 2;
+    }
+    @include breakpoint(mobile up) {
+      &:nth-of-type(n+5) &-img{
+        width: 20%;
+      }
+      &:nth-of-type(n+5) &-data{
+        width: 80%;
+      }
+      &:nth-of-type(n+5) .l-kan__name{
+        margin-top: 0;
+      }
+    }
+
+    @include breakpoint(mobile down) {
+      &-img, &-data{
+        width: 100%;
+      }
+    }
+
+    &-img{
+
+    }
+    &-data{
+
+    }
+    & + & {
+      margin-top: 5*$kandidate__margin;
+    }
+  }
+  &__name{
+    margin-top: 3*$kandidate__margin;;
+  }
+  &__role{
+    opacity: .75;
+    margin-top: $kandidate__margin;
+    margin-bottom: 2*$kandidate__margin;
+  }
+  &__map{
+    position: sticky;
+    bottom: 0;
+    background: white;
+    padding: $kandidate__margin;
+    margin: 0 -18px;
+    border-top: 1px solid black;
+    margin-top: 2*$kandidate__margin;
+    //text-align: center;
+    //transform: translateY(404px);
+    //&:hover{
+    //  transform: translateY(0);
+    //}
+    svg{
+      path{
+        fill: transparent !important;
+        stroke: black !important;
+        stroke-width: 2px;
+        &:hover{
+          fill: black !important;
+        }
+      }
+    }
+    h4{
+      margin: .5em;
+    }
+  }
+  &__region{
+    &-select{
+      margin: 0;
+    }
+  }
+}

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: jekyll-theme-pirati
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.2.0
 platform: ruby
 authors:
 - Jitka Novotná
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2018-05-29 00:00:00.000000000 Z
+date: 2018-06-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -59,8 +59,6 @@ executables: []
 extensions: []
 extra_rdoc_files: []
 files:
-- LICENSE
-- LICENSE.txt
 - README.md
 - _includes/accordeon/accordeon-column.html
 - _includes/accordeon/accordeon.html
@@ -208,6 +206,9 @@ files:
 - _sass/foundation/util/_unit.scss
 - _sass/foundation/util/_util.scss
 - _sass/foundation/util/_value.scss
+- _sass/jquery-ui.scss
+- _sass/layouts/_cast.scss
+- _sass/layouts/_kandidatka.scss
 - _sass/main.scss
 - _sass/minima.scss
 - _sass/minima/_base.scss

data/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2018 jitka
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

data/LICENSE.txt

@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2018 Jitka Novotná
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.