jekyll-theme-ethereal 0.4.4 → 0.5.4

data/_sass/small/base/_page.scss

@@ -0,0 +1,18 @@
+@include breakpoint('<=small') {
+    html {
+        height: auto;
+    }
+
+    body {
+        @include vendor('flex-direction', 'column');
+        height: auto;
+        overflow-x: hidden;
+        overflow-y: auto;
+    }
+}
+
+@include breakpoint('<=xsmall') {
+    html, body {
+        min-width: 320px;
+    }
+}

data/_sass/small/base/_typography.scss

@@ -0,0 +1,67 @@
+@include breakpoint('<=small') {
+    html {
+        font-size: 12pt;
+    }
+
+    h1 {
+        font-size: 2.25rem;
+        line-height: 1.2;
+
+        &.major {
+            margin: 0 0 (_size(element-margin) * 1.75) 0;
+
+            &:after {
+                bottom: -1.325rem;
+            }
+        }
+    }
+
+    h2 {
+        font-size: 1.5rem;
+        line-height: 1.2;
+
+        &.major {
+            margin: 0 0 (_size(element-margin) * 1.325) 0;
+
+            &:after {
+                bottom: -1.2rem;
+            }
+        }
+    }
+
+    h3 {
+        font-size: 1rem;
+
+        &.major {
+            margin: 0 0 (_size(element-margin) * 1.25) 0;
+
+            &:after {
+                bottom: -0.75rem;
+            }
+        }
+    }
+
+    h4 {
+        font-size: 1rem;
+    }
+
+    h5 {
+        font-size: 0.9rem;
+    }
+
+    h6 {
+        font-size: 0.7rem;
+    }
+
+    h1, h2, h3, h4, h5, h6 {
+        br {
+            display: none;
+        }
+    }
+}
+
+@include breakpoint('<=xxsmall') {
+    html {
+        font-size: 11pt;
+    }
+}

data/_sass/small/components/_form.scss

@@ -0,0 +1,27 @@
+form {
+    @include breakpoint('<=small') {
+        > .fields {
+            $gutter: (_size(element-margin) * 0.75);
+
+            width: calc(100% + #{$gutter * 2});
+            margin: ($gutter * -1) 0 _size(element-margin) ($gutter * -1);
+
+            > .field {
+                padding: $gutter 0 0 $gutter;
+                width: calc(100% - #{$gutter * 1});
+
+                &.half {
+                    width: calc(100% - #{$gutter * 1});
+                }
+
+                &.third {
+                    width: calc(100% - #{$gutter * 1});
+                }
+
+                &.quarter {
+                    width: calc(100% - #{$gutter * 1});
+                }
+            }
+        }
+    }
+}

data/_sass/small/components/_gallery.scss

@@ -0,0 +1,38 @@
+@include breakpoint('<=small') {
+    .gallery {
+        @include vendor('flex-direction', 'column');
+        height: auto;
+
+        > * {
+            height: auto;
+            width: 100%;
+        }
+
+        .image {
+            width: 100%;
+            height: 40rem;
+        }
+
+        .group {
+            @include spans(33.33333%);
+
+            .image {
+                height: 20rem;
+            }
+        }
+    }
+}
+
+@include breakpoint('<=xsmall') {
+    .gallery {
+        .image {
+            height: 30rem;
+        }
+
+        .group {
+            .image {
+                height: 12.5rem;
+            }
+        }
+    }
+}

data/_sass/small/components/_grid-icons.scss

@@ -0,0 +1,29 @@
+ul.grid-icons {
+
+    @include breakpoint('<=small') {
+        @include vendor('justify-content', 'flex-start');
+        width: 100% !important;
+        margin: 0;
+
+        .icon {
+            &:before {
+                width: 4.5rem;
+                height: 4.5rem;
+                line-height: 4.5rem;
+                font-size: 1.75rem;
+            }
+        }
+
+        > li {
+            margin: 1rem 0 0 1rem !important;
+
+            &:before {
+                display: none !important;
+            }
+
+            &:after {
+                display: none !important;
+            }
+        }
+    }
+}

data/_sass/small/components/_panel-banner.scss

@@ -0,0 +1,37 @@
+@include breakpoint('<=small') {
+    .panel.banner {
+        .content {
+            @include padding($pad-small-tb, $pad-small-lr);
+            @include vendor('flex-basis', '60%');
+
+            > .actions:last-child {
+                margin-bottom: _size(element-margin);
+            }
+        }
+
+        .image {
+            @include vendor('flex-basis', '40%');
+        }
+    }
+
+    @include orientation(portrait) {
+        .panel.banner {
+            .content {
+                @include vendor('flex-basis', 'auto');
+            }
+
+            .image {
+                @include vendor('flex-basis', 'auto');
+                height: 18rem;
+            }
+
+            &.left {
+                @include vendor('flex-direction', 'column');
+            }
+
+            &.right {
+                @include vendor('flex-direction', 'column-reverse');
+            }
+        }
+    }
+}

data/_sass/small/components/_panel-map.scss

@@ -0,0 +1,13 @@
+/* Panel (Map) */
+
+@include breakpoint('<=small') {
+    .panel.map {
+        @include vendor('align-items', 'stretch');
+        position: relative;
+        height: 100vh;
+
+        #map-container {
+            height: 100%;
+        }
+    }
+}

data/_sass/small/components/_panel-spotlight.scss

@@ -0,0 +1,18 @@
+@include breakpoint('<=small') {
+    .panel.spotlight {
+        .content {
+            @include padding($pad-small-tb, $pad-small-lr);
+            @include vendor('flex-direction', 'column !important');
+            background-image: linear-gradient(0deg, rgba(0,0,0,0.25) 70%, rgba(0,0,0,0.175)) !important;
+            min-height: 25rem;
+        }
+    }
+}
+
+@include breakpoint('<=xsmall') {
+    .panel.spotlight {
+        .content {
+            min-height: 30rem;
+        }
+    }
+}

data/_sass/small/components/_panel.scss

@@ -0,0 +1,80 @@
+$pad: _size(pad);
+$pad-small-tb: _size(pad-small-tb);
+$pad-small-lr: _size(pad-small-lr);
+
+@include breakpoint('<=small') {
+    .panel {
+        @include vendor('flex-direction', 'column');
+        height: auto;
+        width: 100vw !important;
+
+        > * {
+            @include panel-colors-small;
+        }
+
+        > .intro {
+            width: 100vw !important;
+            @include padding($pad-small-tb, $pad-small-lr);
+
+            &.joined {
+                padding-bottom: 0;
+                padding-right: $pad-small-lr;
+
+                & + .inner {
+                    padding-top: 0;
+                    padding-left: $pad-small-lr;
+                }
+            }
+        }
+
+        > .inner {
+            width: 100vw !important;
+            @include padding($pad-small-tb, $pad-small-lr);
+
+            &.columns {
+                @include vendor('flex-direction', 'column');
+
+                > * {
+                    margin-left: 0;
+                    margin-top: 0;
+                }
+
+                > :first-child {
+                    margin-top: 0;
+                }
+
+                &.divided {
+                    > * {
+                        margin-left: 0;
+                        margin-top: ($pad-small-lr * 2);
+
+                        &:before {
+                            content: '';
+                            position: absolute;
+                            top: auto;
+                            left: $pad-small-lr;
+                            width: calc(100% - #{$pad-small-lr * 2});
+                            height: 2px;
+                            margin-left: 0;
+                            margin-top: ($pad-small-lr * -1);
+                        }
+                    }
+
+                    > :first-child {
+                        margin-top: 0;
+                    }
+                }
+            }
+        }
+
+        @include spans-small(_size(span-fixed));
+
+        &.small,
+        &.medium,
+        &.large {
+            @include spans-small(_size(span-variable));
+        }
+
+        @include panel-colors-small;
+    }
+}

data/_sass/small/layout/_footer.scss

@@ -0,0 +1,34 @@
+#footer {
+    @include breakpoint('<=small') {
+        z-index: 0;
+        position: relative;
+        bottom: 0;
+        right: 0;
+        width: 100vw;
+        margin: 0;
+        padding: 2em;
+        @include vendor('display', 'flex');
+        @include vendor('justify-content', 'space-between');
+        @include vendor('flex-direction', 'column');
+        text-align: center;
+
+        .copyright {
+            display: block;
+            margin: 0;
+            padding: 0;
+            width: 100%;
+            text-align: center;
+            
+            li {
+                display: block;
+                margin: 0.75em 0 0 0;
+                padding: 0;
+                border: 0;
+
+                &:first-child {
+                    margin-top: 0;
+                }
+            }
+        }
+    }
+}

data/_sass/small/layout/_page-wrapper.scss

@@ -0,0 +1,12 @@
+@include breakpoint('<=small') {
+    #page-wrapper {
+        height: auto;
+        padding: 1rem;
+    }
+}
+
+@include breakpoint('<=xsmall') {
+    #page-wrapper {
+        padding: 0;
+    }
+}

data/_sass/small/layout/_wrapper.scss

@@ -0,0 +1,26 @@
+@include breakpoint('<=small') {
+    #wrapper {
+        @include vendor('flex-direction', 'column');
+        height: auto;
+        margin: 0;
+        box-shadow: 0 0.25rem 1.5rem 0.25rem transparentize(_palette(bg), 0.5);
+
+        > .scrollZone {
+            display: none;
+        }
+
+        body.is-preload & {
+            @include vendor('transform', 'translateY(1rem)');
+        }
+    }
+}
+
+@include breakpoint('<=xsmall') {
+    #wrapper {
+        box-shadow: none;
+
+        body.is-preload & {
+            @include vendor('transform', 'none');
+        }
+    }
+}

data/{_sass/components/_cookieconsent.scss → assets/css/cookieconsent.css}

@@ -78,7 +78,8 @@
 /* 2 basic types of window - floating / banner */
 .cc-window.cc-floating {
   padding: 2em;
-  max-width: 24em; /* 1em == 16px therefore 24em == 384px */
+  width: 100%;
+  max-width: 100%; /* 1em == 16px therefore 24em == 384px */
   flex-direction: column;
 }
 .cc-window.cc-banner {
@@ -200,7 +201,7 @@
   right: 1em;
 }
 .cc-bottom {
-  bottom: 1em;
+  bottom: 0;
 }
 
 /* links that are direct decendants should be displayed as block */