Commit d8950b94 authored by Aldo's avatar Aldo

WIP get height top after image load

parent be0d9aef
......@@ -211,4 +211,5 @@ composer create-project drupal-composer/drupal-project:8.x-dev some-dir --no-int
* [Search API](https://www.drupal.org/docs/8/modules/search-api)
* [Search API Autocomplete](https://www.drupal.org/docs/8/modules/search-api-autocomplete)
* [facets](https://drupal8.support/en/modules/facets)
* [theming](https://www.drupal.org/docs/8/theming)
\ No newline at end of file
* [theming](https://www.drupal.org/docs/8/theming)
* [sticky menu after scroll](https://codepen.io/AldoF/pen/qzxvbE)
\ No newline at end of file
......@@ -11,7 +11,7 @@ vagrant_box: geerlingguy/drupal-vm
vagrant_user: vagrant
# vagrant_synced_folder_default_type: nfs
vagrant_synced_folder_default_type: ''
vagrant_synced_folder_default_type: smb
vagrant_gui: false
# If you need to run multiple instances of Drupal VM, set a unique hostname,
......
......@@ -3,3 +3,9 @@
display: block;
content: "";
clear: both; }
/* line 3, ../../scss/base/elements.sass */
a {
text-decoration: none;
color: rgba(0, 0, 0, 0.8);
hover-text-decoration: underline; }
......@@ -54,9 +54,10 @@ nav a, aside a {
nav a.is-active, aside a.is-active {
color: #212529; }
/* line 55, ../../scss/components/menu.sass */
/* line 45, ../../scss/components/menu.sass */
.fixed {
position: fixed;
top: 0;
background-color: #fff;
width: 100%; }
width: 100%;
z-index: 1; }
......@@ -10,208 +10,279 @@
content: "";
clear: both; }
@media (max-width: 767px) {
/* line 7, ../../scss/layouts/responsive.sass */
body {
margin: 0 1em; } }
@media (min-width: 768px) {
/* line 11, ../../scss/layouts/responsive.sass */
.col-sm-12 {
width: 100%; }
/* line 9, ../../scss/layouts/responsive.sass */
.col-sm-1 {
width: 8.33333%;
float: left; }
/* line 12, ../../scss/layouts/responsive.sass */
.col-sm-2 {
width: 16.66667%;
float: left; }
/* line 15, ../../scss/layouts/responsive.sass */
.col-sm-3 {
width: 25%;
float: left; }
/* line 18, ../../scss/layouts/responsive.sass */
.col-sm-4 {
width: 33.33333%;
float: left; }
/* line 21, ../../scss/layouts/responsive.sass */
.col-sm-5 {
width: 41.66667%;
float: left; }
/* line 13, ../../scss/layouts/responsive.sass */
/* line 24, ../../scss/layouts/responsive.sass */
.col-sm-6 {
width: 50%;
float: left; } }
float: left; }
/* line 27, ../../scss/layouts/responsive.sass */
.col-sm-7 {
width: 58.33333%;
float: left; }
/* line 30, ../../scss/layouts/responsive.sass */
.col-sm-8 {
width: 66.66667%;
float: left; }
/* line 33, ../../scss/layouts/responsive.sass */
.col-sm-9 {
width: 83.33333%;
float: left; }
/* line 36, ../../scss/layouts/responsive.sass */
.col-sm-10 {
width: 83.33333%;
float: left; }
/* line 39, ../../scss/layouts/responsive.sass */
.col-sm-11 {
width: 91.66667%;
float: left; }
/* line 42, ../../scss/layouts/responsive.sass */
.col-sm-12 {
width: 100%; } }
@media (min-width: 992px) {
/* line 18, ../../scss/layouts/responsive.sass */
/* line 46, ../../scss/layouts/responsive.sass */
.col-md-1 {
width: 8.33333%;
float: left; }
/* line 21, ../../scss/layouts/responsive.sass */
/* line 49, ../../scss/layouts/responsive.sass */
.col-md-2 {
width: 16.66667%;
float: left; }
/* line 24, ../../scss/layouts/responsive.sass */
/* line 52, ../../scss/layouts/responsive.sass */
.col-md-3 {
width: 25%;
float: left; }
/* line 27, ../../scss/layouts/responsive.sass */
/* line 55, ../../scss/layouts/responsive.sass */
.col-md-4 {
width: 33.33333%;
float: left; }
/* line 30, ../../scss/layouts/responsive.sass */
/* line 58, ../../scss/layouts/responsive.sass */
.col-md-5 {
width: 41.66667%;
float: left; }
/* line 33, ../../scss/layouts/responsive.sass */
/* line 61, ../../scss/layouts/responsive.sass */
.col-md-6 {
width: 50%;
float: left; }
/* line 36, ../../scss/layouts/responsive.sass */
/* line 64, ../../scss/layouts/responsive.sass */
.col-md-7 {
width: 58.33333%;
float: left; }
/* line 39, ../../scss/layouts/responsive.sass */
/* line 67, ../../scss/layouts/responsive.sass */
.col-md-8 {
width: 66.66667%;
float: left; }
/* line 42, ../../scss/layouts/responsive.sass */
/* line 70, ../../scss/layouts/responsive.sass */
.col-md-9 {
width: 75%;
float: left; }
/* line 45, ../../scss/layouts/responsive.sass */
/* line 73, ../../scss/layouts/responsive.sass */
.col-md-10 {
width: 83.33333%;
float: left; }
/* line 48, ../../scss/layouts/responsive.sass */
/* line 76, ../../scss/layouts/responsive.sass */
.col-md-11 {
width: 91.66667%;
float: left; }
/* line 51, ../../scss/layouts/responsive.sass */
/* line 79, ../../scss/layouts/responsive.sass */
.col-md-12 {
width: 100%; } }
@media (min-width: 1200px) {
/* line 55, ../../scss/layouts/responsive.sass */
/* line 83, ../../scss/layouts/responsive.sass */
.col-lg-1 {
width: 8.33333%;
float: left; }
/* line 58, ../../scss/layouts/responsive.sass */
/* line 86, ../../scss/layouts/responsive.sass */
.col-lg-2 {
width: 16.66667%;
float: left; }
/* line 61, ../../scss/layouts/responsive.sass */
/* line 89, ../../scss/layouts/responsive.sass */
.col-lg-3 {
width: 25%;
float: left; }
/* line 64, ../../scss/layouts/responsive.sass */
/* line 92, ../../scss/layouts/responsive.sass */
.col-lg-4 {
width: 33.33333%;
float: left; }
/* line 67, ../../scss/layouts/responsive.sass */
/* line 95, ../../scss/layouts/responsive.sass */
.col-lg-5 {
width: 41.66667%;
float: left; }
/* line 98, ../../scss/layouts/responsive.sass */
.col-lg-6 {
width: 50%;
float: left; }
/* line 70, ../../scss/layouts/responsive.sass */
/* line 101, ../../scss/layouts/responsive.sass */
.col-lg-7 {
width: 58.33333%;
float: left; }
/* line 104, ../../scss/layouts/responsive.sass */
.col-lg-8 {
width: 66.66667%;
float: left; }
/* line 107, ../../scss/layouts/responsive.sass */
.col-lg-9 {
width: 75%;
float: left; }
/* line 73, ../../scss/layouts/responsive.sass */
/* line 110, ../../scss/layouts/responsive.sass */
.col-lg-10 {
width: 83.33333%;
float: left; }
/* line 113, ../../scss/layouts/responsive.sass */
.col-lg-11 {
width: 91.66667%;
float: left; }
/* line 116, ../../scss/layouts/responsive.sass */
.col-lg-12 {
width: 100%; } }
@media (min-width: 1800px) {
/* line 77, ../../scss/layouts/responsive.sass */
/* line 120, ../../scss/layouts/responsive.sass */
.col-xl-1 {
width: 8.33333%;
float: left; }
/* line 80, ../../scss/layouts/responsive.sass */
/* line 123, ../../scss/layouts/responsive.sass */
.col-xl-2 {
width: 16.66667%;
float: left; }
/* line 83, ../../scss/layouts/responsive.sass */
/* line 126, ../../scss/layouts/responsive.sass */
.col-xl-3 {
width: 25%;
float: left; }
/* line 86, ../../scss/layouts/responsive.sass */
/* line 129, ../../scss/layouts/responsive.sass */
.col-xl-4 {
width: 33.33333%;
float: left; }
/* line 89, ../../scss/layouts/responsive.sass */
/* line 132, ../../scss/layouts/responsive.sass */
.col-xl-5 {
width: 41.66667%;
float: left; }
/* line 92, ../../scss/layouts/responsive.sass */
/* line 135, ../../scss/layouts/responsive.sass */
.col-xl-6 {
width: 50%;
float: left; }
/* line 95, ../../scss/layouts/responsive.sass */
/* line 138, ../../scss/layouts/responsive.sass */
.col-xl-7 {
width: 58.33333%;
float: left; }
/* line 98, ../../scss/layouts/responsive.sass */
/* line 141, ../../scss/layouts/responsive.sass */
.col-xl-8 {
width: 66.66667%;
float: left; }
/* line 101, ../../scss/layouts/responsive.sass */
/* line 144, ../../scss/layouts/responsive.sass */
.col-xl-9 {
width: 75%;
float: left; }
/* line 104, ../../scss/layouts/responsive.sass */
/* line 147, ../../scss/layouts/responsive.sass */
.col-xl-10 {
width: 83.33333%;
float: left; }
/* line 107, ../../scss/layouts/responsive.sass */
/* line 150, ../../scss/layouts/responsive.sass */
.col-xl-11 {
width: 91.66667%;
float: left; }
/* line 110, ../../scss/layouts/responsive.sass */
/* line 153, ../../scss/layouts/responsive.sass */
.col-xl-12 {
width: 100%; } }
@media (max-width: 767px) {
/* line 116, ../../scss/layouts/responsive.sass */
/* line 159, ../../scss/layouts/responsive.sass */
body {
margin: 0 1em; } }
@media (min-width: 768px) {
/* line 119, ../../scss/layouts/responsive.sass */
/* line 162, ../../scss/layouts/responsive.sass */
.layout-sidebar-two {
clear: both; }
/* line 121, ../../scss/layouts/responsive.sass */
/* line 164, ../../scss/layouts/responsive.sass */
body {
margin: 0 5%; }
/* line 123, ../../scss/layouts/responsive.sass */
/* line 166, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 50%;
float: left; } }
@media (min-width: 992px) {
/* line 128, ../../scss/layouts/responsive.sass */
/* line 171, ../../scss/layouts/responsive.sass */
body {
margin: 0 10%; }
/* line 130, ../../scss/layouts/responsive.sass */
/* line 173, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 100%; }
/* line 133, ../../scss/layouts/responsive.sass */
/* line 176, ../../scss/layouts/responsive.sass */
.layout-sidebar-two {
clear: none; } }
@media (min-width: 1200px) {
/* line 136, ../../scss/layouts/responsive.sass */
/* line 179, ../../scss/layouts/responsive.sass */
body {
margin: 0 20%; }
/* line 138, ../../scss/layouts/responsive.sass */
/* line 181, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 50%;
......
......@@ -4,208 +4,279 @@
content: "";
clear: both; }
@media (max-width: 767px) {
/* line 7, ../../scss/layouts/responsive.sass */
body {
margin: 0 1em; } }
@media (min-width: 768px) {
/* line 11, ../../scss/layouts/responsive.sass */
.col-sm-12 {
width: 100%; }
/* line 9, ../../scss/layouts/responsive.sass */
.col-sm-1 {
width: 8.33333%;
float: left; }
/* line 12, ../../scss/layouts/responsive.sass */
.col-sm-2 {
width: 16.66667%;
float: left; }
/* line 15, ../../scss/layouts/responsive.sass */
.col-sm-3 {
width: 25%;
float: left; }
/* line 18, ../../scss/layouts/responsive.sass */
.col-sm-4 {
width: 33.33333%;
float: left; }
/* line 21, ../../scss/layouts/responsive.sass */
.col-sm-5 {
width: 41.66667%;
float: left; }
/* line 13, ../../scss/layouts/responsive.sass */
/* line 24, ../../scss/layouts/responsive.sass */
.col-sm-6 {
width: 50%;
float: left; } }
float: left; }
/* line 27, ../../scss/layouts/responsive.sass */
.col-sm-7 {
width: 58.33333%;
float: left; }
/* line 30, ../../scss/layouts/responsive.sass */
.col-sm-8 {
width: 66.66667%;
float: left; }
/* line 33, ../../scss/layouts/responsive.sass */
.col-sm-9 {
width: 83.33333%;
float: left; }
/* line 36, ../../scss/layouts/responsive.sass */
.col-sm-10 {
width: 83.33333%;
float: left; }
/* line 39, ../../scss/layouts/responsive.sass */
.col-sm-11 {
width: 91.66667%;
float: left; }
/* line 42, ../../scss/layouts/responsive.sass */
.col-sm-12 {
width: 100%; } }
@media (min-width: 992px) {
/* line 18, ../../scss/layouts/responsive.sass */
/* line 46, ../../scss/layouts/responsive.sass */
.col-md-1 {
width: 8.33333%;
float: left; }
/* line 21, ../../scss/layouts/responsive.sass */
/* line 49, ../../scss/layouts/responsive.sass */
.col-md-2 {
width: 16.66667%;
float: left; }
/* line 24, ../../scss/layouts/responsive.sass */
/* line 52, ../../scss/layouts/responsive.sass */
.col-md-3 {
width: 25%;
float: left; }
/* line 27, ../../scss/layouts/responsive.sass */
/* line 55, ../../scss/layouts/responsive.sass */
.col-md-4 {
width: 33.33333%;
float: left; }
/* line 30, ../../scss/layouts/responsive.sass */
/* line 58, ../../scss/layouts/responsive.sass */
.col-md-5 {
width: 41.66667%;
float: left; }
/* line 33, ../../scss/layouts/responsive.sass */
/* line 61, ../../scss/layouts/responsive.sass */
.col-md-6 {
width: 50%;
float: left; }
/* line 36, ../../scss/layouts/responsive.sass */
/* line 64, ../../scss/layouts/responsive.sass */
.col-md-7 {
width: 58.33333%;
float: left; }
/* line 39, ../../scss/layouts/responsive.sass */
/* line 67, ../../scss/layouts/responsive.sass */
.col-md-8 {
width: 66.66667%;
float: left; }
/* line 42, ../../scss/layouts/responsive.sass */
/* line 70, ../../scss/layouts/responsive.sass */
.col-md-9 {
width: 75%;
float: left; }
/* line 45, ../../scss/layouts/responsive.sass */
/* line 73, ../../scss/layouts/responsive.sass */
.col-md-10 {
width: 83.33333%;
float: left; }
/* line 48, ../../scss/layouts/responsive.sass */
/* line 76, ../../scss/layouts/responsive.sass */
.col-md-11 {
width: 91.66667%;
float: left; }
/* line 51, ../../scss/layouts/responsive.sass */
/* line 79, ../../scss/layouts/responsive.sass */
.col-md-12 {
width: 100%; } }
@media (min-width: 1200px) {
/* line 55, ../../scss/layouts/responsive.sass */
/* line 83, ../../scss/layouts/responsive.sass */
.col-lg-1 {
width: 8.33333%;
float: left; }
/* line 58, ../../scss/layouts/responsive.sass */
/* line 86, ../../scss/layouts/responsive.sass */
.col-lg-2 {
width: 16.66667%;
float: left; }
/* line 61, ../../scss/layouts/responsive.sass */
/* line 89, ../../scss/layouts/responsive.sass */
.col-lg-3 {
width: 25%;
float: left; }
/* line 64, ../../scss/layouts/responsive.sass */
/* line 92, ../../scss/layouts/responsive.sass */
.col-lg-4 {
width: 33.33333%;
float: left; }
/* line 67, ../../scss/layouts/responsive.sass */
/* line 95, ../../scss/layouts/responsive.sass */
.col-lg-5 {
width: 41.66667%;
float: left; }
/* line 98, ../../scss/layouts/responsive.sass */
.col-lg-6 {
width: 50%;
float: left; }
/* line 70, ../../scss/layouts/responsive.sass */
/* line 101, ../../scss/layouts/responsive.sass */
.col-lg-7 {
width: 58.33333%;
float: left; }
/* line 104, ../../scss/layouts/responsive.sass */
.col-lg-8 {
width: 66.66667%;
float: left; }
/* line 107, ../../scss/layouts/responsive.sass */
.col-lg-9 {
width: 75%;
float: left; }
/* line 73, ../../scss/layouts/responsive.sass */
/* line 110, ../../scss/layouts/responsive.sass */
.col-lg-10 {
width: 83.33333%;
float: left; }
/* line 113, ../../scss/layouts/responsive.sass */
.col-lg-11 {
width: 91.66667%;
float: left; }
/* line 116, ../../scss/layouts/responsive.sass */
.col-lg-12 {
width: 100%; } }
@media (min-width: 1800px) {
/* line 77, ../../scss/layouts/responsive.sass */
/* line 120, ../../scss/layouts/responsive.sass */
.col-xl-1 {
width: 8.33333%;
float: left; }
/* line 80, ../../scss/layouts/responsive.sass */
/* line 123, ../../scss/layouts/responsive.sass */
.col-xl-2 {
width: 16.66667%;
float: left; }
/* line 83, ../../scss/layouts/responsive.sass */
/* line 126, ../../scss/layouts/responsive.sass */
.col-xl-3 {
width: 25%;
float: left; }
/* line 86, ../../scss/layouts/responsive.sass */
/* line 129, ../../scss/layouts/responsive.sass */
.col-xl-4 {
width: 33.33333%;
float: left; }
/* line 89, ../../scss/layouts/responsive.sass */
/* line 132, ../../scss/layouts/responsive.sass */
.col-xl-5 {
width: 41.66667%;
float: left; }
/* line 92, ../../scss/layouts/responsive.sass */
/* line 135, ../../scss/layouts/responsive.sass */
.col-xl-6 {
width: 50%;
float: left; }
/* line 95, ../../scss/layouts/responsive.sass */
/* line 138, ../../scss/layouts/responsive.sass */
.col-xl-7 {
width: 58.33333%;
float: left; }
/* line 98, ../../scss/layouts/responsive.sass */
/* line 141, ../../scss/layouts/responsive.sass */
.col-xl-8 {
width: 66.66667%;
float: left; }
/* line 101, ../../scss/layouts/responsive.sass */
/* line 144, ../../scss/layouts/responsive.sass */
.col-xl-9 {
width: 75%;
float: left; }
/* line 104, ../../scss/layouts/responsive.sass */
/* line 147, ../../scss/layouts/responsive.sass */
.col-xl-10 {
width: 83.33333%;
float: left; }
/* line 107, ../../scss/layouts/responsive.sass */
/* line 150, ../../scss/layouts/responsive.sass */
.col-xl-11 {
width: 91.66667%;
float: left; }
/* line 110, ../../scss/layouts/responsive.sass */
/* line 153, ../../scss/layouts/responsive.sass */
.col-xl-12 {
width: 100%; } }
@media (max-width: 767px) {
/* line 116, ../../scss/layouts/responsive.sass */
/* line 159, ../../scss/layouts/responsive.sass */
body {
margin: 0 1em; } }
@media (min-width: 768px) {
/* line 119, ../../scss/layouts/responsive.sass */
/* line 162, ../../scss/layouts/responsive.sass */
.layout-sidebar-two {
clear: both; }
/* line 121, ../../scss/layouts/responsive.sass */
/* line 164, ../../scss/layouts/responsive.sass */
body {
margin: 0 5%; }
/* line 123, ../../scss/layouts/responsive.sass */
/* line 166, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 50%;
float: left; } }
@media (min-width: 992px) {
/* line 128, ../../scss/layouts/responsive.sass */
/* line 171, ../../scss/layouts/responsive.sass */
body {
margin: 0 10%; }
/* line 130, ../../scss/layouts/responsive.sass */
/* line 173, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 100%; }
/* line 133, ../../scss/layouts/responsive.sass */
/* line 176, ../../scss/layouts/responsive.sass */
.layout-sidebar-two {
clear: none; } }
@media (min-width: 1200px) {
/* line 136, ../../scss/layouts/responsive.sass */
/* line 179, ../../scss/layouts/responsive.sass */
body {
margin: 0 20%; }
/* line 138, ../../scss/layouts/responsive.sass */
/* line 181, ../../scss/layouts/responsive.sass */
#block-calibrate-views-block-news-block-2,
#block-calibrate-views-block-articles-block-2 {
width: 50%;
......
......@@ -15,31 +15,29 @@
console.log('It works!');
$(function () {
// get correct height from top to nav
$('body').waitForImages(function () {
alert('Header image is loaded');
let stickyOffset = $('.sticky').offset().top;
console.log(stickyOffset);
scorllEvent(stickyOffset);
});
// scrollevent
function scorllEvent(stickyOffset) {
$(window).scroll(function () {
let sticky