commit 1b923de71a6bba8a0aa252692a91190553b8448c Author: Dorian Zedler Date: Sat Aug 6 20:25:26 2022 +0200 Chore: initial commit diff --git a/.drone.yml b/.drone.yml new file mode 100644 index 0000000..7369313 --- /dev/null +++ b/.drone.yml @@ -0,0 +1,17 @@ +kind: pipeline +name: build and publish site + +steps: +- name: build + image: klakegg/hugo:ext-alpine-ci + commands: + - hugo --minify + +- name: publish + image: itsblue.dev/plugins/codeberg-pages-deploy + settings: + folder: public + git_remote: git@itsblue.dev:bluerock/pages.git + git_branch: main + ssh_key: + from_secret: gitea-ssh-key \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..6a87bd8 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +/resources +/public +.hugo_build.lock \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..c4906ee --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,12 @@ +{ + "ltex.enabled": [ + "bibtex", + "context", + "context.tex", + "latex", + "markdown", + "org", + "restructuredtext", + "rsweave" + ] +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..0a2b27b --- /dev/null +++ b/README.md @@ -0,0 +1,6 @@ +# blueROCK App landingpage +This is the landingpage for l.blurock.dev URLs. + +# Getting started + +Build with `hugo` diff --git a/config.yaml b/config.yaml new file mode 100644 index 0000000..d2f606e --- /dev/null +++ b/config.yaml @@ -0,0 +1,31 @@ +baseURL: "https://l.bluerock.dev" +title: "blueROCK" +theme: "app-landingpage" +defaultContentLanguage: "en" +defaultContentLanguageInSubdir: "true" + +languages: + en: + title: "blueROCK" + de: + title: "blueROCK" + +params: + stores: + - id: google + name: Google Play Store + url: https://play.google.com/store/apps/details?id=com.itsblue.blueROCK + badge: /assets/img/google-play-badge.png + + - id: apple + name: Apple App Store + url: https://apps.apple.com/de/app/bluerock/id1503699996?app=itunes&ign-mpt=uo%3D4 + badge: /assets/img/App_Store_Badge_DE.svg + + alternativeUrl: https://www.digitalrock.de/egroupware/ranking/sitemgr/digitalrock/eliste.html + appName: "blueROCK" + +markup: + goldmark: + renderer: + unsafe: true \ No newline at end of file diff --git a/content/index.de.md b/content/index.de.md new file mode 100644 index 0000000..c37c968 --- /dev/null +++ b/content/index.de.md @@ -0,0 +1,6 @@ +--- +title: "Lade die blueROCK herunter." +alternativeUrlDescription: "Ergebnisse auf digitalrock.de ansehen" +--- + +Zum Download verfügbar im Apple App Store und auf Google Play. \ No newline at end of file diff --git a/content/index.en.md b/content/index.en.md new file mode 100644 index 0000000..997b2f8 --- /dev/null +++ b/content/index.en.md @@ -0,0 +1,6 @@ +--- +title: "Download the blueROCK App." +alternativeUrlDescription: "View results on digitalrock.de" +--- + +blueROCK is available for download on the Apple App Store and Google Play. \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_box.scss b/themes/app-landingpage/assets/scss/_box.scss new file mode 100644 index 0000000..f9c4f36 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_box.scss @@ -0,0 +1,369 @@ +.box { + border-radius: $border-radius; + background-color: $body-bg; + box-shadow: $box-shadow; + position: relative; + color: $body-color; + padding: $card-spacer-y $card-spacer-x; + + &_stretch { + height: 100%; + + &.box_flex { + flex-direction: row; + justify-content: flex-start; + align-items: center; + > .image-block { + width: 30%; + padding-right: 0; + padding-left: 0; + img { + margin-left: auto; + margin-right: auto; + max-width: 100%; + } + } + > div { + max-width: 70%; + padding-left: $spacer; + } + } + } + + &_spaced { + margin-top: $spacer * 3; + } + &-column { + padding-top: $spacer; + min-height: 100px; + } + &_flex { + display: flex; + justify-content: flex-start; + align-items: center; + flex-direction: column; + height: 100%; + .box-inner { + flex: 1 0 auto; + &_end { + flex: 0 0 auto; + } + } + @media (min-width:$screen-sm) { + flex-direction: row; + align-items: center; + > .box-inner_flex { + display: flex; + justify-content: space-between; + align-items: center; + flex: 1 0 auto; + + h3:last-child { + margin-bottom: 0; + } + } + } + } + .image-block { + max-width: 30%; + img { + min-width: 90px; + } + + @media (min-width:$screen-sm) { + max-width: none; + &:first-child { + padding-right: $spacer * 1.25; + } + img { + min-width: 100px; + max-width: 160px; + } + } + } + &_slider { + z-index: 0; + .slick-list { + padding-top: $spacer; + padding-bottom: $spacer * 1.5; + } + &-caption { + display: flex; + justify-content: flex-end; + padding: 0 $spacer; + @media (min-width: $screen-lg){ + padding: 0 $spacer * 2; + } + @media (min-width: 420px){ + transform: translate3d(0, -38px, 0); + } + } + } +} + +.image-block { + text-align: center; + padding-top: 1.25rem; + padding-bottom: 1.25rem; + + img { + display: block; + margin-left: auto; + margin-right: auto; + max-width: 100%; + height: auto; + } + .text-center > & { + margin-left: auto; + margin-right: auto; + text-align: inherit; + img { + margin-left: auto; + margin-right: auto; + } + } + .section-feature-listing &, + .box & { + padding-top: 0.2rem; + padding-bottom: 0.2rem; + } +} + +.image-overflow { + position: absolute; + height: 100%; + min-height: 100%; + width: auto; + top: 0; + &-spacer { + position: static; + display: block; + width: 100%; + height: auto; + + } + &-container { + position: relative; + margin-top: $spacer; + margin-bottom: $spacer * 1.5; + + @media (min-width: $screen-md){ + margin-top: 0.5 * $spacer; + margin-bottom: 0.5 * $spacer; + } + } + &_left { + right: 0.5rem; + } +} + +.text-block { + .numeration { + color: $primary; + font-size: $h5-font-size; + font-weight: $font-weight-bold; + line-height: $headings-line-height * $h4-font-size; + } + &_indented { + padding-left: $grid-gutter-width; + position: relative; + @media (min-width: $screen-md){ + padding-right: $card-spacer-x; + } + .numeration { + position: absolute; + left: 0; + + img.icon { + position: absolute; + left: -4px; + width: auto; + height: auto; + max-height: 32px; + top: -2px; + display: inline-block; + } + } + } + &_spaced { + margin-top: $spacer * 2.5; + margin-bottom: $spacer * 2.5; + + &-top { + margin-top: $spacer * 3.25; + } + &-bottom { + margin-bottom: $spacer * 3.25; + } + } +} +.col-text { + order: 1; + margin-bottom: $spacer * 2; +} +.col-img { + order: 0; +} + +@media(min-width: $screen-md){ + .col-img, + .col-text { + order: 0; + } +} + +p:not([class]) + .btn { + &.btn-primary, + &.btn-secondary { + margin-top: $spacer * 0.5; + } +} + +.container_flex { + display: block; + + .side-menu { + transform: translate3d(-100%, 0, 0); + width: 50vw; + max-width: 240px; + position: fixed; + + @media (max-width: ($screen-md - 1)){ + padding-left: $spacer * 1.25; + padding-top: 0.5* $spacer; + z-index: 1; + transition: transform 0.3s ease-in-out; + height: 100vh; + top: 0; + + &:before { + opacity: 0; + transition: opacity 0.3s ease-in-out; + } + + &.active { + transform: translate3d(0, 0, 0); + z-index: 1; + height: 100vh; + left: 0; + top: 0; + padding-top: 130px; + background-color: $body-bg; + box-shadow: $box-shadow; + + &:after, + &:before { + position: fixed; + content: ""; + height: 100vh; + width: 300vw; + background-color: $dark; + opacity: 0.2; + display: block; + top: 0; + z-index: -1; + left: 0; + } + &:after { + position: fixed; + background-color: $body-bg; + width: 50vw; + max-width: 240px; + opacity: 1; + } + .menu-close .btn-close { + background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='80' height='80' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs%3e%3cfilter x='-64.1%25' y='-46.7%25' width='228.3%25' height='228.3%25' filterUnits='objectBoundingBox' id='a'%3e%3cfeMorphology radius='4' in='SourceAlpha' result='shadowSpreadOuter1'/%3e%3cfeOffset dy='8' in='shadowSpreadOuter1' result='shadowOffsetOuter1'/%3e%3cfeGaussianBlur stdDeviation='12.5' in='shadowOffsetOuter1' result='shadowBlurOuter1'/%3e%3cfeColorMatrix values='0 0 0 0 0.235294118 0 0 0 0 0.270588235 0 0 0 0 0.325490196 0 0 0 0.538625437 0' in='shadowBlurOuter1'/%3e%3c/filter%3e%3crect id='b' width='46' height='46' rx='4'/%3e%3c/defs%3e%3cg fill='none'%3e%3cg transform='matrix(-1 0 0 1 63 9)'%3e%3cuse fill='%23000' filter='url(%23a)' xlink:href='%23b'/%3e%3cuse fill='%23FFF' xlink:href='%23b'/%3e%3c/g%3e%3cpath d='M37.415 40c.473 0 .881-.175 1.222-.525.341-.35.511-.798.511-1.343 0-.545-.17-.993-.511-1.343l-2.727-2.92h12.329c.492 0 .909-.185 1.25-.555.341-.37.511-.808.511-1.314s-.171-.944-.511-1.314c-.341-.37-.757-.555-1.25-.555h-12.329l2.784-2.92c.341-.35.511-.798.511-1.343 0-.545-.17-.993-.511-1.343-.341-.35-.758-.525-1.25-.525s-.909.175-1.25.525l-5.682 6.131c-.341.35-.511.798-.511 1.343 0 .506.171.934.511 1.285l5.682 6.19c.341.35.748.525 1.222.525z' fill='%23000' fill-rule='nonzero'/%3e%3c/g%3e%3c/svg%3e"); + } + } + .menu-close { + position: absolute; + bottom: 0; + margin-left: 0; + left: 100%; + transform: translate3d(0, 0, 0); + width: 80px; + height: 80px; + cursor: pointer; + z-index: 2; + + .btn-close { + width: 80px; + height: 80px; + position: static; + background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg width='80' height='80' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cdefs%3e%3cfilter x='-64.1%25' y='-46.7%25' width='228.3%25' height='228.3%25' filterUnits='objectBoundingBox' id='a'%3e%3cfeMorphology radius='4' in='SourceAlpha' result='shadowSpreadOuter1'/%3e%3cfeOffset dy='8' in='shadowSpreadOuter1' result='shadowOffsetOuter1'/%3e%3cfeGaussianBlur stdDeviation='12.5' in='shadowOffsetOuter1' result='shadowBlurOuter1'/%3e%3cfeColorMatrix values='0 0 0 0 0.235294118 0 0 0 0 0.270588235 0 0 0 0 0.325490196 0 0 0 0.538625437 0' in='shadowBlurOuter1'/%3e%3c/filter%3e%3crect id='b' width='46' height='46' rx='4'/%3e%3c/defs%3e%3cg fill='none'%3e%3cg transform='translate(17 9)'%3e%3cuse fill='%23000' filter='url(%23a)' xlink:href='%23b'/%3e%3cuse fill='%23FFF' xlink:href='%23b'/%3e%3c/g%3e%3cpath d='M42.585 40c-.473 0-.881-.175-1.222-.525-.341-.35-.511-.798-.511-1.343 0-.545.17-.993.511-1.343l2.727-2.92h-12.329c-.492 0-.909-.185-1.25-.555-.341-.37-.511-.808-.511-1.314s.171-.944.511-1.314c.341-.37.757-.555 1.25-.555h12.329l-2.784-2.92c-.341-.35-.511-.798-.511-1.343 0-.545.17-.993.511-1.343.341-.35.758-.525 1.25-.525s.909.175 1.25.525l5.682 6.131c.341.35.511.798.511 1.343 0 .506-.171.934-.511 1.285l-5.682 6.19c-.341.35-.748.525-1.222.525z' fill='%23000'/%3e%3c/g%3e%3c/svg%3e"); + &, + &:hover, + &:active, + &:focus { + outline: none; + box-shadow: none; + border: none; + } + } + } + } + + .nav-link { + cursor: pointer; + position: relative; + font-weight: $font-weight-normal; + color: inherit; + text-decoration: none; + + &:before { + top: auto; + left: auto; + position: absolute; + top: $spacer * 0.5; + bottom: $spacer * 0.5; + border-left: 2px solid $primary-light; + left: 0; + } + + &:hover, + &:focus, + &:active, + &.active { + color: inherit; + + &:before { content: ""} + } + &:focus, + &:active, + &.active { + font-weight: $font-weight-bold; + } + } + + } + + .main { + width: 100%; + padding-top: $spacer * 2.125; + z-index: 0; + position: relative; + } + @media (min-width: $screen-md){ + display: flex; + padding-top: 0; + + .side-menu { + transform: translate3d(0, 0, 0); + width: 220px; + position: sticky; + max-height: 100vh; + top: 0; + padding-top: $spacer * 2; + left: auto; + + .menu-toggle, + .menu-close { + display: none; + } + } + .main { + padding-top: $spacer * 2; + margin-left: $grid-gutter-width; + } + } +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_buttons.scss b/themes/app-landingpage/assets/scss/_buttons.scss new file mode 100644 index 0000000..8c3528d --- /dev/null +++ b/themes/app-landingpage/assets/scss/_buttons.scss @@ -0,0 +1,182 @@ +// +// Base styles +// + +.btn { + display: inline-block; + font-family: $btn-font-family; + font-weight: $btn-font-weight; + line-height: $btn-line-height; + color: $body-color; + text-align: center; + white-space: $btn-white-space; + vertical-align: middle; + cursor: if($enable-pointer-cursor-for-buttons, pointer, null); + user-select: none; + background-color: transparent; + border: $btn-border-width solid transparent; + @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-border-radius); + @include transition($btn-transition); + text-decoration: none; + + &:hover { + color: $body-color; + text-decoration: none; + } + + &:focus, + &.focus { + outline: 0; + box-shadow: $btn-focus-box-shadow; + } + + &:active, + &.active { + @include box-shadow($btn-active-box-shadow); + + &:focus { + @include box-shadow($btn-focus-box-shadow, $btn-active-box-shadow); + } + } + + &:disabled, + &.disabled, + fieldset:disabled & { // stylelint-disable-line selector-no-qualifying-type + pointer-events: none; + opacity: $btn-disabled-opacity; + @include box-shadow(none); + } + + .icon { + width: 1rem; + height: 1rem; + padding-left: 0.5rem; + padding-right: 0.5rem; + position: relative; + top: -0.05rem; + text-align: center; + + &:first-child { + margin-right: 0.4rem; + margin-left: 0.05rem; + } + &:last-child { + margin-left: 0.4rem; + margin-right: 0.05rem; + } + } +} + + +// +// Alternate buttons +// + +@each $color, $value in $theme-button-colors { + .btn-#{$color} { + @include button-variant($value, $value); + box-shadow: 0 8px 24px -17px $theme-button-shadow-color; + font-weight: 500; + .icon { + width: 1.5rem; + height: 1.5rem; + padding: 0 0.75rem; + &:before { + height: 1.6rem; + width: 1.6rem; + } + &:first-child { + margin-right: 0.5rem; + margin-left: 0.05rem; + } + &:last-child { + margin-left: 0.5rem; + margin-right: 0.05rem; + } + } + } +} + +// @each $color, $value in $theme-colors { +// .btn-outline-#{$color} { +// @include button-outline-variant($value); +// } +// } + + +// +// Link buttons +// + +// Make a button look and behave like a link +.btn-link { + font-weight: $font-weight-normal; + color: $btn-link-color; + text-decoration: $link-decoration; + + &:hover { + color: $btn-link-hover-color; + text-decoration: $link-hover-decoration; + } + + &:focus, + &.focus { + text-decoration: $link-hover-decoration; + box-shadow: none; + } + + &:disabled, + &.disabled { + color: $btn-link-disabled-color; + } + &_narrow { + padding-left: 0; + padding-right: 0; + margin-top: 0.4rem; + } + &_icon { + font-weight: bold; + color: inherit; + text-decoration: none; + display: inline-flex; + width: auto; + align-items: center; + + .text-left > & { + margin-right: 1rem; + } + .text-right > & { + margin-left: 1rem; + } + } + // No need for an active state here +} + + +// +// Button Sizes +// + +.btn-lg { + @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg); +} + +.btn-sm { + @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm); +} + + +// +// Block button +// + +.btn-block { + display: block; + width: 100%; + + // Vertically space out multiple block buttons + p + &, + + .btn-block { + margin-top: $btn-block-spacing-y; + } +} diff --git a/themes/app-landingpage/assets/scss/_containers.scss b/themes/app-landingpage/assets/scss/_containers.scss new file mode 100644 index 0000000..8ccb552 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_containers.scss @@ -0,0 +1,73 @@ +// Container widths +// +// Set the container width, and override it for fixed navbars in media queries. + +@if $enable-grid-classes { + // Single container class with breakpoint max-widths + .container { + @include make-container(); + @include make-container-max-widths(); + &-inner { + max-width: 860px; + margin-left: auto; + margin-right: auto; + padding-left: 0; + padding-right: 0; + &_lg { + max-width: 980px; + } + &_sm { + max-width: 680px; + } + } + @media (max-width: 360px){ + padding-left: 1rem; + padding-right: 1rem; + } + } + + video { + display: block; + width: 100%; + max-height: 100%; + } + + #player-overlay { + background-color: #000; + z-index: 999; + } + + // 100% wide container at all breakpoints + .container-fluid { + @include make-container(); + } + + // Responsive containers that are 100% wide until a breakpoint + @each $breakpoint, $container-max-width in $container-max-widths { + .container-#{$breakpoint} { + @extend .container-fluid; + } + + @include media-breakpoint-up($breakpoint, $grid-breakpoints) { + %responsive-container-#{$breakpoint} { + max-width: $container-max-width; + } + + // Extend each breakpoint which is smaller or equal to the current breakpoint + $extend-breakpoint: true; + + @each $name, $width in $grid-breakpoints { + @if ($extend-breakpoint) { + .container#{breakpoint-infix($name, $grid-breakpoints)} { + @extend %responsive-container-#{$breakpoint}; + } + + // Once the current breakpoint is reached, stop extending + @if ($breakpoint == $name) { + $extend-breakpoint: false; + } + } + } + } + } +} diff --git a/themes/app-landingpage/assets/scss/_custom-variables.scss b/themes/app-landingpage/assets/scss/_custom-variables.scss new file mode 100644 index 0000000..5aa66ee --- /dev/null +++ b/themes/app-landingpage/assets/scss/_custom-variables.scss @@ -0,0 +1,16 @@ +$theme-button-colors: ( + "primary": $primary, + "secondary": $secondary +) !default; +$theme-button-shadow-color: $charcoal-black; + +$background-image_gradient: linear-gradient(to right, #80cdec 29%, #c00f2d 126%, #c00f2d 126%); +$background-image_shape-wave: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='1440' height='272' viewBox='0 0 1440 272'%3e%3cpath fill='%23fff' d='M1428.979 207.361c-178.674 81.041-501.519 81.266-718.176 6.004-266.515-92.581-562.398-106.589-710.803-106.974v165.609h1440v-70.02c-3.941 2.036-7.636 3.846-11.021 5.381z'/%3e%3c/svg%3e"); +$background-image_shape-wave-xs: url("data:image/svg+xml;charset=UTF-8,%3csvg version='1' xmlns='http://www.w3.org/2000/svg' width='375' height='36' viewBox='0 0 375 36'%3e%3cpath fill='%23fff' d='M5.18 22.209c-1.775-.189-3.5-.409-5.18-.656v14.447h375v-25.712c-111.343 21.507-244.559 25.302-369.82 11.921z'/%3e%3c/svg%3e"); + +$accordion-header-padding: ($spacer * 1.25) 44px ($spacer * 1.25) ($spacer * 1.25); +$according-header-bg: $body-bg; +$according-header-active-bg: $secondary; +$accordion-border-color: $border-color; + +$header-mobile-sticky: false; \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_fonts.scss b/themes/app-landingpage/assets/scss/_fonts.scss new file mode 100644 index 0000000..2f07d6e --- /dev/null +++ b/themes/app-landingpage/assets/scss/_fonts.scss @@ -0,0 +1,78 @@ +/* roboto-regular - latin */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 400; + src: url('../fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */ + src: local('Roboto'), local('Roboto-Regular'), + url('../fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */ +} +/* roboto-italic - latin */ +@font-face { + font-family: 'Roboto'; + font-style: italic; + font-weight: 400; + src: url('../fonts/roboto-v20-latin-italic.eot'); /* IE9 Compat Modes */ + src: local('Roboto Italic'), local('Roboto-Italic'), + url('../fonts/roboto-v20-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-italic.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */ +} +/* roboto-700 - latin */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 700; + src: url('../fonts/roboto-v20-latin-700.eot'); /* IE9 Compat Modes */ + src: local('Roboto Bold'), local('Roboto-Bold'), + url('../fonts/roboto-v20-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-700.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-700.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */ +} +/* roboto-700italic - latin */ +@font-face { + font-family: 'Roboto'; + font-style: italic; + font-weight: 700; + src: url('../fonts/roboto-v20-latin-700italic.eot'); /* IE9 Compat Modes */ + src: local('Roboto Bold Italic'), local('Roboto-BoldItalic'), + url('../fonts/roboto-v20-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-700italic.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */ +} +/* roboto-900 - latin */ +@font-face { + font-family: 'Roboto'; + font-style: normal; + font-weight: 900; + src: url('../fonts/roboto-v20-latin-900.eot'); /* IE9 Compat Modes */ + src: local('Roboto Black'), local('Roboto-Black'), + url('../fonts/roboto-v20-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-900.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-900.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */ +} +/* roboto-900italic - latin */ +@font-face { + font-family: 'Roboto'; + font-style: italic; + font-weight: 900; + src: url('../fonts/roboto-v20-latin-900italic.eot'); /* IE9 Compat Modes */ + src: local('Roboto Black Italic'), local('Roboto-BlackItalic'), + url('../fonts/roboto-v20-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('../fonts/roboto-v20-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */ + url('../fonts/roboto-v20-latin-900italic.woff') format('woff'), /* Modern Browsers */ + url('../fonts/roboto-v20-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */ + url('../fonts/roboto-v20-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */ +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_footer.scss b/themes/app-landingpage/assets/scss/_footer.scss new file mode 100644 index 0000000..2f75b84 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_footer.scss @@ -0,0 +1,69 @@ +.footer { + position: relative; + background-position: center; + @extend .section_bg-gradient; + color: $white; + padding-top: 3rem; + padding-bottom: 1rem; + + a:not(.btn), + .copyright, + .small { + color: inherit; + text-decoration: none; + } + a:not(.btn) { + &:hover { + text-decoration: underline; + } + } + .link-item { + padding-left: ($grid-gutter-width /2); + padding-right: ($grid-gutter-width /2); + margin-bottom: 1.2rem; + + strong, + a { + display: block; + white-space: nowrap; + } + } + .logo img { + height: 48px; + } + .logo { + margin-bottom: 1.6rem; + } +} + +.copyright-bar { + @extend .small; + @extend .d-flex; + margin-top: 1.5rem; + flex-wrap: wrap; + margin-left: ($grid-gutter-width /2) * -1; + margin-right: ($grid-gutter-width /2) * -1; + + div { + flex: 1 0 auto; + padding-left: ($grid-gutter-width /2); + padding-right: ($grid-gutter-width /2); + max-width: 100%; + } + + @media (min-width: $screen-sm){ + flex-wrap: nowrap; + justify-content: space-between; + margin-top: 2rem; + + div { + flex: 1 1 auto; + } + } + @media (min-width: $screen-md){ + margin-top: 3.2rem; + } + .privacy a { + white-space: nowrap; + } +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_forms.scss b/themes/app-landingpage/assets/scss/_forms.scss new file mode 100644 index 0000000..ff9a016 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_forms.scss @@ -0,0 +1,9 @@ +@import "forms/labels"; +@import "forms/form-control"; +@import "forms/form-select"; +@import "forms/form-check"; +@import "forms/form-file"; +@import "forms/form-range"; +@import "forms/layout"; +@import "forms/input-group"; +@import "forms/validation"; diff --git a/themes/app-landingpage/assets/scss/_functions.scss b/themes/app-landingpage/assets/scss/_functions.scss new file mode 100644 index 0000000..d93e339 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_functions.scss @@ -0,0 +1,185 @@ +// Bootstrap functions +// +// Utility mixins and functions for evaluating source code across our variables, maps, and mixins. + +// Ascending +// Used to evaluate Sass maps like our grid breakpoints. +@mixin _assert-ascending($map, $map-name) { + $prev-key: null; + $prev-num: null; + @each $key, $num in $map { + @if $prev-num == null or unit($num) == "%" or unit($prev-num) == "%" { + // Do nothing + } @else if not comparable($prev-num, $num) { + @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !"; + } @else if $prev-num >= $num { + @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !"; + } + $prev-key: $key; + $prev-num: $num; + } +} + +// Starts at zero +// Used to ensure the min-width of the lowest breakpoint starts at 0. +@mixin _assert-starts-at-zero($map, $map-name: "$grid-breakpoints") { + @if length($map) > 0 { + $values: map-values($map); + $first-value: nth($values, 1); + @if $first-value != 0 { + @warn "First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}."; + } + } +} + +// Internal Bootstrap function to turn maps into its negative variant. +// It prefixes the keys with `n` and makes the value negative. +@function negativify-map($map) { + $result: (); + @each $key, $value in $map { + @if $key != 0 { + $result: map-merge($result, ("n" + $key: (-$value))); + } + } + @return $result; +} + +// Get multiple keys from a sass map +@function map-get-multiple($map, $values) { + $result: (); + @each $key, $value in $map { + @if (index($values, $key) != null) { + $result: map-merge($result, ($key: $value)); + } + } + @return $result; +} + +// Replace `$search` with `$replace` in `$string` +// Used on our SVG icon backgrounds for custom forms. +// +// @author Hugo Giraudel +// @param {String} $string - Initial string +// @param {String} $search - Substring to replace +// @param {String} $replace ('') - New value +// @return {String} - Updated string +@function str-replace($string, $search, $replace: "") { + $index: str-index($string, $search); + + @if $index { + @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace); + } + + @return $string; +} + +// See https://codepen.io/kevinweber/pen/dXWoRw +@function escape-svg($string) { + @if str-index($string, "data:image/svg+xml") { + @each $char, $encoded in $escaped-characters { + // Do not escape the url brackets + @if str-index($string, "url(") == 1 { + $string: url("#{str-replace(str-slice($string, 6, -3), $char, $encoded)}"); + } @else { + $string: str-replace($string, $char, $encoded); + } + } + } + + @return $string; +} + +// Color contrast +// See https://github.com/twbs/bootstrap/pull/30168 + +// A list of pre-calculated numbers of pow(($value / 255 + .055) / 1.055, 2.4). (from 0 to 255) +// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern +$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0123 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1; + +@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light) { + $l1: luminance($background); + $l2: luminance(opaque($background, $color-contrast-light)); + + $contrast: if($l1 > $l2, ($l1 + .05) / ($l2 + .05), ($l2 + .05) / ($l1 + .05)); + + @return if($contrast < $min-contrast-ratio, $color-contrast-dark, $color-contrast-light); +} + +// Return WCAG2.0 relative luminance +// See https://www.w3.org/WAI/GL/wiki/Relative_luminance +// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests +@function luminance($color) { + $rgb: ( + "r": red($color), + "g": green($color), + "b": blue($color) + ); + + @each $name, $value in $rgb { + $value: if($value / 255 < .03928, $value / 255 / 12.92, nth($_luminance-list, $value + 1)); + $rgb: map-merge($rgb, ($name: $value)); + } + + @return (map-get($rgb, "r") * .2126) + (map-get($rgb, "g") * .7152) + (map-get($rgb, "b") * .0722); +} + +// Return opaque color +// opaque(#fff, rgba(0, 0, 0, .5)) => #808080 +@function opaque($background, $foreground) { + @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100); +} + +// Request a color level +// scss-docs-start color-level +@function color-level($color: $primary, $level: 0) { + $color-base: if($level > 0, $black, $white); + $level: abs($level); + + @return mix($color-base, $color, $level * $theme-color-interval); +} +// scss-docs-end color-level + +@function tint-color($color, $level) { + @return mix(white, $color, $level * $theme-color-interval); +} + +@function shade-color($color, $level) { + @return mix(black, $color, $level * $theme-color-interval); +} + +// Return valid calc +@function add($value1, $value2, $return-calc: true) { + @if $value1 == null { + @return $value2; + } + + @if $value2 == null { + @return $value1; + } + + @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) { + @return $value1 + $value2; + } + + @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(" + ") + $value2); +} + +@function subtract($value1, $value2, $return-calc: true) { + @if $value1 == null and $value2 == null { + @return null; + } + + @if $value1 == null { + @return -$value2; + } + + @if $value2 == null { + @return $value1; + } + + @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) { + @return $value1 - $value2; + } + + @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(" - ") + $value2); +} diff --git a/themes/app-landingpage/assets/scss/_grid.scss b/themes/app-landingpage/assets/scss/_grid.scss new file mode 100644 index 0000000..5686f31 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_grid.scss @@ -0,0 +1,22 @@ +// Row +// +// Rows contain your columns. + +@if $enable-grid-classes { + .row { + @include make-row(); + + > * { + @include make-col-ready(); + } + } +} + + +// Columns +// +// Common styles for small and large grid columns + +@if $enable-grid-classes { + @include make-grid-columns(); +} diff --git a/themes/app-landingpage/assets/scss/_header.scss b/themes/app-landingpage/assets/scss/_header.scss new file mode 100644 index 0000000..f9b43df --- /dev/null +++ b/themes/app-landingpage/assets/scss/_header.scss @@ -0,0 +1,301 @@ +.logo { + display: flex; + flex-direction: row; + text-decoration: none; + + &-image { + width: auto; + height: 55px; + display: block; + flex: 0 0 auto; + overflow: hidden; + } +} + +.header { + background-position: center; + @extend .section_bg-gradient; + @if $header-mobile-sticky { + top: 0; + position: sticky; + z-index: 2; + + @media(min-width: $screen-md){ + z-index: auto; + position: relative; + } + } @else { + position: relative; + z-index: 2; + } + &_home { + body & { + background-image: none; + z-index: auto; + } + + &:before, + &:after { + content: ""; + position: absolute; + left: 0; + right: 0; + z-index: -1; + background-position: center; + background-image: $background-image_gradient; + height: 140px; + top: -12px; + } + &:after { + top: -10px; + background-image: $background-image_shape-wave-xs; + background-position: center bottom; + background-size: 100% auto; + background-repeat: no-repeat; + } + + @media(min-width: $screen-sm){ + &:before, + &:after { + background-image: $background-image_gradient; + height: 280px; + } + &:after { + background-image: $background-image_shape-wave; + background-size: auto; + background-position: left bottom; + } + + } + .page-home & { + @media(min-width: $screen-lg){ + margin-bottom: 5 * $spacer; + } + @media(min-width: $screen-xl){ + margin-bottom: $spacer; + } + } + @media (min-width: $screen-xl) { + &:before, + &:after { + min-height: 320px; + height: 23vw; + } + &:after { + background-size: cover; + background-position: center bottom; + } + } + @media (min-width: $screen-xl + 180px){ + &:before, + &:after { + height: 20vw; + transform: translate3d(0,-2%,0); + } + } + @media (min-width: 2200px){ + &:before, + &:after { + transform: translate3d(0,-10%,0); + } + } + @media (min-width: 2200px){ + &:before, + &:after { + transform: translate3d(0,-20%,0); + } + } + } + + .logo-caption { + color: $white; + } + .nav-link { + text-decoration: none; + } + .nav-item { + font-weight: $font-weight-bold; + } + .nav-item, + .nav-link { + @media(min-width: $screen-md){ + color: inherit; + } + } + .navbar{ + padding-top: $spacer * 1.5; + padding-bottom: $spacer * 1.5; + @media(min-width: $screen-md){ + color: $white; + } + } + .btn-menu { + appearance: none; + width: 44px; + height: 44px; + min-width: 44px; + display: block; + border-radius: $border-radius; + position: absolute; + background: transparent; + border: none; + outline: none; + top: $spacer * 1.5; + right: $spacer * 1.5; + z-index: 1; + + &:before { + content: ""; + width: 100%; + height: 100%; + min-width: 44px; + background: url("../img/icons/burger_menu.svg") center no-repeat; + display: block; + position: absolute; + left: 0; + top: 0; + } + @media(min-width: $screen-md){ + display: none; + } + &_close:before { + background-image: url("../img/icons/burger_menu_close.svg"); + } + } + &-nav { + display: none; + &.active { + display: block; + position: fixed; + height: 100vh; + width: 100%; + left: 0; + top:0; + background-color: $body-bg; + padding-top: $spacer * 1.3; + padding-left: $spacer; + padding-right: $spacer; + z-index: $zindex-modal; + + .nav { + display: flex; + flex-direction: column; + } + } + + .nav-item { + font-size: $font-size-lg; + color: $body-color; + font-weight: $font-weight-bold; + order: 1; + + .nav-link { + &, + &:hover { + color: inherit; + } + &.disabled { + opacity: 0.7; + } + } + + &.lang { + display: flex; + align-items: center; + font-size: $font-size-base; + position: relative; + top: 0.08rem; + order: 0; + padding-left: $spacer * 0.8; + padding-right: $spacer * 0.8; + margin-bottom: $spacer; + text-transform: uppercase; + + .nav-link { + &, + &:hover { + padding-left: 0.3rem; + padding-right: 0.3rem; + opacity: 0.7; + } + + &-delimiter { + position: relative; + top: -0.08rem; + } + &.active { + &, + &:hover { + opacity: 1; + } + } + } + } + } + + @media(min-width: $screen-md){ + &, + &.active { + display: flex; + justify-content: flex-end; + align-items: center; + position: static; + background: transparent; + height: auto; + width: auto; + padding: 0; + + .nav { + flex-direction: row; + color: $white; + + &-item.lang { + padding-left: 0; + padding-right: 0; + margin-bottom: 0; + } + } + } + .nav-item, + .nav-item.lang { + order: 1; + color: inherit; + } + .btn-menu { + display: none; + } + .nav-link { + &.active { + position: relative; + &:after { + content: ""; + position: absolute; + bottom: $spacer * 0.6; + border-top: 2px solid $white; + left: $spacer; + right: $spacer; + } + } + } + .nav-link-icon { + &.icon_github { + position: relative; + margin-right: 10px; + &:before { + content: ""; + background-image: url("../img/icons/github_white.svg"); + background-position: center; + background-repeat: no-repeat; + position: absolute; + width: 100%; + height: 100%; + top: 0.01rem; + } + img { + visibility: hidden; + } + } + } + } + } +} diff --git a/themes/app-landingpage/assets/scss/_icon.scss b/themes/app-landingpage/assets/scss/_icon.scss new file mode 100644 index 0000000..d0acff0 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_icon.scss @@ -0,0 +1,30 @@ +@mixin image-icon($value) { + &_#{$value}:before { + background-image: url("../img/icons/#{$value}.svg"); + } +} + +.icon { + overflow: visible; + position: relative; + &:before { + content: ""; + background-position: center; + background-repeat: no-repeat; + position: absolute; + width: 100%; + height: 100%; + top: 50%; + left: 50%; + transform: translate3d(-50%,-50%,0); + } + @include image-icon('github'); + @include image-icon('arrow-down'); + @include image-icon('arrow-right'); + @include image-icon('arrow-left'); + &_img { + &:before { + content: normal; + } + } +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_images.scss b/themes/app-landingpage/assets/scss/_images.scss new file mode 100644 index 0000000..5a6ccdd --- /dev/null +++ b/themes/app-landingpage/assets/scss/_images.scss @@ -0,0 +1,15 @@ +// Responsive image +// +// Keep images from scaling beyond the width of their parents. + +.img-fluid { + // Part 1: Set a maximum relative to the parent + max-width: 100%; + // Part 2: Override the height to auto, otherwise images will be stretched + // when setting a width and height attribute on the img element. + height: auto; +} + +.img-shadow { + box-shadow: 0 8px 24px -17px #000101; +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_list.scss b/themes/app-landingpage/assets/scss/_list.scss new file mode 100644 index 0000000..c9fb378 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_list.scss @@ -0,0 +1,129 @@ +.list { + padding-left: 0; + &, + &-item { + list-style: none; + .list-icon { + display: inline-block; + margin-bottom: $spacer * 0.6; + } + } + &_plain &-item:not(.col) { + padding-left: 0; + } + &_bullets &-item { + padding-left: 1rem; + position: relative; + + &:before { + color: $primary-light; + content: '\2022'; + left: 0; + position: absolute; + font-size: 1.75rem; + line-height: $line-height-base * 1rem; + } + } +} + +.icon-list { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: center; + &-item { + padding: ($spacer * 1) ($spacer * 1.5); + @media (min-width: $screen-lg){ + padding: ($spacer * 1.4) ($spacer * 2.2); + } + } + &_inline &-item { + padding: ($spacer * 1) ($spacer * 0.5); + @media (min-width: $screen-lg){ + padding: ($spacer * 1) ($spacer * 0.75); + } + } +} + +.card-list { + @extend .row; + margin-top: $spacer * 3; + overflow: hidden; + &-item { + @extend .col; + display: flex; + flex-direction: column; + margin-bottom: $spacer * 3; + margin-top: $spacer * 2; + width: 100%; + flex: 0 0 auto; + flex-wrap: wrap; + + .container { + padding-bottom: 0; + padding-top: $spacer; + padding-left: 0; + flex: 1 0 auto; + display: flex; + flex-direction: column; + + &:first-child { + padding-bottom: 60px; + padding-top: 60px; + padding-left: $spacer * 2; + padding-right: $spacer * 2; + background-color: $secondary; + display: flex; + flex-direction: column; + justify-content: center; + + } + .btn-link:last-child{ + padding-bottom: 0; + position: relative; + top: 6px; + } + } + .image-block { + height: 240px; + display: block; + position: relative; + text-align: center; + overflow: hidden; + padding: 0; + + img { + width: auto; + object-fit: cover; + min-height: 240px; + position: absolute; + top: 50%; + left: 50%; + transform: translate3d(-50%,-50%,0); + } + } + .headline-caption { + font-size: $font-size-base; + margin-bottom: $spacer * 0.75; + } + &:nth-child(odd) .container:first-child{ + background-color: $pink; + } + @media (min-width: $screen-sm) { + width: 50%; + .container:first-child { + padding-top: 80px; + padding-bottom: 80px; + } + } + @media (min-width: $screen-lg){ + width: 33.33%; + } + @media (min-width: $screen-xl){ + .container:first-child { + padding-top: 100px; + padding-bottom: 100px; + } + } + } +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_mixins.scss b/themes/app-landingpage/assets/scss/_mixins.scss new file mode 100644 index 0000000..d65cb7e --- /dev/null +++ b/themes/app-landingpage/assets/scss/_mixins.scss @@ -0,0 +1,62 @@ +// Toggles +// +// Used in conjunction with global variables to enable certain theme features. + +// Vendor +@import "vendor/rfs"; + +// Deprecate +@import "mixins/deprecate"; + +// Helpers +@import "mixins/breakpoints"; +@import "mixins/image"; +@import "mixins/resize"; +@import "mixins/screen-reader"; +@import "mixins/reset-text"; +@import "mixins/text-truncate"; + +// Utilities +@import "mixins/utilities"; + +// Components +@import "mixins/alert"; +@import "mixins/buttons"; +@import "mixins/caret"; +@import "mixins/pagination"; +@import "mixins/lists"; +@import "mixins/list-group"; +@import "mixins/forms"; +@import "mixins/table-variants"; + +// Skins +@import "mixins/background-variant"; +@import "mixins/border-radius"; +@import "mixins/box-shadow"; +@import "mixins/gradients"; +@import "mixins/transition"; + +// Layout +@import "mixins/clearfix"; +@import "mixins/container"; +@import "mixins/grid"; + + +//Slider +@function slick-image-url($url) { + @if function-exists(image-url) { + @return image-url($url); + } + @else { + @return url($slick-loader-path + $url); + } +} + +@function slick-font-url($url) { + @if function-exists(font-url) { + @return font-url($url); + } + @else { + @return url($slick-font-path + $url); + } +} \ No newline at end of file diff --git a/themes/app-landingpage/assets/scss/_nav.scss b/themes/app-landingpage/assets/scss/_nav.scss new file mode 100644 index 0000000..3fb0463 --- /dev/null +++ b/themes/app-landingpage/assets/scss/_nav.scss @@ -0,0 +1,123 @@ +// Base class +// +// Kickstart any navigation component with a set of style resets. Works with +// `