diff --git a/_includes/common/banner.html b/_includes/common/banner.html new file mode 100644 index 0000000..ea6d189 --- /dev/null +++ b/_includes/common/banner.html @@ -0,0 +1,43 @@ +
+

+ Livestream begins in: 10:45:00 18.09.2020 (CEST) +

+ + + +
\ No newline at end of file diff --git a/_sass/includes/banner.scss b/_sass/includes/banner.scss new file mode 100644 index 0000000..1ef1c86 --- /dev/null +++ b/_sass/includes/banner.scss @@ -0,0 +1,51 @@ +#full-banner { + position: fixed; + bottom: 0; + right: 0; + z-index: 5; + background-color: var(--colour-white); + padding: var(--size-8); + border-top: 1px solid var(--colour-grey-light); + border-left: 1px solid var(--colour-grey-light); + border-color: var(--colour-grey-light); + + h1 { + font-size: var(--size-16); + font-weight: 800; + margin: 0; + color: rgba(29, 32, 34, 0.5); + + &.countdown, + span { + font-family: var(--font-logo); + } + + .cd-time { + color: rgba(29, 32, 34, 1); + } + } + + &.hidden { + display: none; + } + + @include touch { + width: 100vw; + box-sizing: border-box; + padding: var(--size-8) var(--size-32); + left: 0; + + h1 { + // font-size: var(--size-24); + } + + .cd-time { + display: block; + margin: 0; + } + } + + @include darkMode { + border-color: var(--colour-graphite); + } +} diff --git a/_sass/includes/footer.scss b/_sass/includes/footer.scss index c562891..803b8ac 100644 --- a/_sass/includes/footer.scss +++ b/_sass/includes/footer.scss @@ -1,6 +1,6 @@ footer.page-footer { padding-top: var(--size-16); - padding-bottom: var(--size-32); + padding-bottom: calc(var(--size-32) + var(--size-32)); a.social-link { padding: var(--size-16); diff --git a/_sass/variables.scss b/_sass/variables.scss index d294223..560c725 100644 --- a/_sass/variables.scss +++ b/_sass/variables.scss @@ -12,7 +12,7 @@ --colour-highlight-darker: #06a1a7; --colour-bg: #ececec; - --colour-text: var(--colour-black-graphite); + --colour-text: var(--colour-graphite, #1d2022); // margin --size-base: 4px; diff --git a/assets/css/index.scss b/assets/css/index.scss index 4ad984e..2f4b5d0 100644 --- a/assets/css/index.scss +++ b/assets/css/index.scss @@ -22,6 +22,7 @@ @import 'includes/header'; @import 'includes/footer'; @import 'includes/back-button'; +@import 'includes/banner'; @import 'pages/home'; @import 'pages/about'; @import 'pages/how-to-participate';