added smooth scroll

js/js.js

@@ -40,8 +40,8 @@
         attach: function attach(context, settings) {
 
             $('.lp-slideshow').slick({
-                 fade: true,
+                fade: true,
-  cssEase: 'linear',
+                cssEase: 'linear',
                 pauseOnHover: false,
                 autoplay: true,
                 autoplaySpeed: 5000
@@ -49,6 +49,23 @@
         }
     };
 
+    Drupal.behaviors.tocScroll = {
+        attach: function attach(context, settings) {
+
+
+            $('.toc a').on('click',function(e) {
+                e.preventDefault();
+                var offset = 100;
+                var target = this.hash;
+                if ($(this).data('offset') != undefined) offset = $(this).data('offset');
+                $('html, body').stop().animate({
+                    'scrollTop': $(target).offset().top - offset
+                }, 500, 'swing', function() {
+                    // window.location.hash = target;
+                });
+            });
+        }
+    };
     Drupal.behaviors.footnoteScroll = {
         attach: function attach(context, settings) {
 

src/js/js.js

@@ -40,8 +40,8 @@
         attach: function attach(context, settings) {
 
             $('.lp-slideshow').slick({
-                 fade: true,
+                fade: true,
-  cssEase: 'linear',
+                cssEase: 'linear',
                 pauseOnHover: false,
                 autoplay: true,
                 autoplaySpeed: 5000
@@ -49,6 +49,23 @@
         }
     };
 
+    Drupal.behaviors.tocScroll = {
+        attach: function attach(context, settings) {
+
+
+            $('.toc a').on('click',function(e) {
+                e.preventDefault();
+                var offset = 100;
+                var target = this.hash;
+                if ($(this).data('offset') != undefined) offset = $(this).data('offset');
+                $('html, body').stop().animate({
+                    'scrollTop': $(target).offset().top - offset
+                }, 500, 'swing', function() {
+                    // window.location.hash = target;
+                });
+            });
+        }
+    };
     Drupal.behaviors.footnoteScroll = {
         attach: function attach(context, settings) {
 

src/scss/;';w

@@ -1,118 +0,0 @@
-//@format
-$toc_breakpoint: 768px;
-.toc {
-    position: -webkit-sticky; /* Safari */
-    position: sticky;
-    top: 100px;
-    margin-top: 0 !important;
-    margin-bottom: 0 !important;
-}
-.node .toc-tree {
-    border: none;
-    padding: 0;
-}
-.toc-block--mobile {
-    @include breakpoint($desktop-up) {
-        //display: none;
-    }
-}
-.toc-block--wide {
-    position: -webkit-sticky; /* Safari */
-    position: sticky;
-    top: 100px;
-    margin-top: 2rem;
-    .toc--title {
-        &[aria-expanded='true'] h2::after {
-            //content: "\f146";//square
-            content: '\f068';
-        }
-        &[aria-expanded='false'] h2::after {
-            //content: "\f0fe";
-            content: '\f067';
-        }
-        h2::after {
-            font-family: 'FontAwesome';
-            position: absolute;
-            //top: 6px;
-            right: 0;
-            font-weight: 400;
-            line-height: 20px;
-            font-size: 2rem;
-            background: #ccc;
-            padding: 10px;
-            //text-align: right;
-        }
-        h2 {
-            text-align: left;
-            border: 1px dotted #ccc;
-            padding: 0px;
-            padding-left: 10px;
-            line-height: 40px;
-            margin-bottom: 0px;
-            background: #f5f3f3;
-        }
-    }
-    .toc--list {
-        border: 1px dotted #ccc;
-        border-top: 0px;
-        padding-top: 1rem;
-        ol {
-            list-style-type: none;
-            padding-left: 0;
-
-            font-family: $serif;
-            font-size: 1.8rem;
-            line-height: 1.8;
-        }
-        a {
-            &:hover {
-                background: #ccc;
-            }
-        }
-    }
-}
-
-.region-sidebar-second {
-    height: 1000px;
-}
-.node__main-content .toc-block--wide {
-    @include breakpoint($desktop-up) {
-        //display: none;
-    }
-}
-.toc-container .toc-block--wide {
-    @include breakpoint($desktop-up) {
-        position: -webkit-sticky; /* Safari */
-        position: sticky;
-        top: 300px;
-    }
-}
-.toc-desktop {
-    display: block !important;
-}
-.toc-mobile {
-    display: none !important;
-}
-//.article-title-banner {
-//grid-area: header;
-//}
-//.node__main-content {
-//grid-area: main;
-//}
-//.toc-container {
-//grid-area: toc;
-//}
-//.node__container {
-//display: grid;
-//grid-template-columns: 70% 30%;
-//grid-template-rows: auto;
-//grid-template-areas:
-//'header header'
-//'toc toc'
-//'main main';
-//@include breakpoint($desktop-up) {
-//grid-template-areas:
-//'header header'
-//'main toc';
-//}
-//}

src/scss/_article-pages.scss

@@ -68,7 +68,14 @@ header.article-header {
         text-align: right;
     }
 }
+
 .article-title-banner {
+    .field--name-title {
+        color: #fff;
+        &:hover {
+            text-decoration: underline;
+        }
+    }
 }
 //.article-info--wrapper {
 //position: absolute;
@@ -77,7 +84,13 @@ header.article-header {
 //}
 .article-info--wrapper {
 }
+.article-title {
+    color: #fff;
+}
 .article-header--metadata {
+    a {
+        color: #fff;
+    }
     .article--contributor {
         font-size: 27px;
         //line-height:36px;

src/scss/_static-pages.scss

@@ -0,0 +1,3 @@
+.header-top {
+    border-bottom: 1px solid #d4d3d3;
+}

src/scss/_toc.scss

@@ -16,6 +16,11 @@ $toc_breakpoint: 768px;
         //display: none;
     }
 }
+div#toc-sections {
+    @include breakpoint($desktop-up) {
+        display: block;
+    }
+}
 .toc-block--wide {
     position: -webkit-sticky; /* Safari */
     position: sticky;
@@ -57,8 +62,8 @@ $toc_breakpoint: 768px;
         border-top: 0px;
         padding-top: 1rem;
         ol {
-            list-style-type: none;
+            //list-style-type: none;
-            padding-left: 0;
+            //padding-left: 0;
 
             font-family: $serif;
             font-size: 1.8rem;

src/scss/_tooltips.scss

@@ -25,9 +25,9 @@
     visibility: visible;
 }
 //footnote offset
-:target {
+//:target {
-    display: block;    
+    //display: block;    
-    position: relative;     
+    //position: relative;     
-    top: -100px;
+    //top: -100px;
-    visibility: hidden;
+    //visibility: hidden;
-}
+//}

src/scss/style.scss

@@ -7,6 +7,7 @@
 @import 'tooltips';
 @import 'menus';
 @import 'toc';
+@import 'static-pages';
 
 /*on-scroll menu */
 .fixed-header-enabled.onscroll .header-container ul.menu {

templates/article_pages/article--hero.html.twig

@@ -3,7 +3,7 @@
 {% set pubDate = content.field_publication_date_electroni|field_value %}
 <header style="background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('{{ imagePath }}')" class="article-title-banner node__header paragraph-responsive-typography-enabled article-header">
   <div  class="container article-info--wrapper">
-  
+
         {% block title_area %}
           {{ title_prefix }}
             <h1{{ title_attributes.addClass('article--title title') }}>