Bladeren bron

scroll is working natively, remains to find a good js scroll. fix #12

Bachir Soussi Chiadmi 6 jaren geleden
bovenliggende
commit
5b725dbf53

+ 8 - 3
sites/all/themes/custom/edlptheme/assets/dist/scripts/main.min.js

@@ -243,9 +243,14 @@ edlp_vars = {
     // |___/\__|_| \___/_|_|___/\__,_|_| /__/
     function initScrollbars(){
       console.log("initScrollbars");
-      $('.os-scroll').overlayScrollbars({
-        overflowBehavior:{x:'h',y:'scroll'}
-      });
+      // TODO: find a better js scroll than overlayScrollbars which does not handle well max-height + overflow-y:auto;
+      // $('.os-scroll').overlayScrollbars({
+      //   overflowBehavior:{
+      //     x:'h',
+      //     y:'scroll',
+      //     clipAlways:false
+      //   }
+      // });
     };
 
     //    _    _

+ 4 - 3
sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css

@@ -1164,7 +1164,7 @@ header[role="banner"] {
 
 #block-mainnavigation {
   float: right;
-  margin-top: 30px; }
+  margin-top: 25px; }
   #block-mainnavigation ul {
     margin: 0;
     padding: 0;
@@ -1211,7 +1211,7 @@ header[role="banner"] {
 
 .block-language {
   float: right;
-  margin-top: 29px;
+  margin-top: 24px;
   margin-left: 2em; }
   .block-language ul {
     margin: 0;
@@ -1255,8 +1255,9 @@ main[role="main"] .layout-content {
         border-top: 1px solid red;
         border-bottom: 1px solid red;
         background-color: rgba(255, 255, 255, 0.95);
+        padding: 0 0 1em;
         max-height: 100%;
-        padding: 0 0 1em; }
+        overflow-y: auto; }
         main[role="main"] .layout-content .row .col > .wrapper > * {
           padding: 0 1em; }
   main[role="main"] .layout-content .field.text-formatted a.audio-link {

+ 8 - 3
sites/all/themes/custom/edlptheme/assets/scripts/main.js

@@ -220,9 +220,14 @@
     // |___/\__|_| \___/_|_|___/\__,_|_| /__/
     function initScrollbars(){
       console.log("initScrollbars");
-      $('.os-scroll').overlayScrollbars({
-        overflowBehavior:{x:'h',y:'scroll'}
-      });
+      // TODO: find a better js scroll than overlayScrollbars which does not handle well max-height + overflow-y:auto;
+      // $('.os-scroll').overlayScrollbars({
+      //   overflowBehavior:{
+      //     x:'h',
+      //     y:'scroll',
+      //     clipAlways:false
+      //   }
+      // });
     };
 
     //    _    _

+ 9 - 3
sites/all/themes/custom/edlptheme/assets/styles/app.scss

@@ -84,7 +84,7 @@ header[role="banner"]{
 
 #block-mainnavigation{
   float:right;
-  margin-top: 30px;
+  margin-top: 25px;
   ul{
     margin:0; padding: 0;
     white-space: nowrap;
@@ -120,7 +120,7 @@ header[role="banner"]{
 
 .block-language{
   float: right;
-  margin-top: 29px;
+  margin-top: 24px;
   margin-left: 2em;
   ul{
     margin:0; padding:0;
@@ -175,11 +175,17 @@ main[role="main"]{
           border-top: 1px solid red;
           border-bottom: 1px solid red;
           background-color: $transparent-bg;
-          max-height: 100%; // this is not working :(
           padding:0 0 1em;
+          max-height: 100%;
+          overflow-y: auto;
           &>*{
             padding:0 1em;
           }
+          // .os-scroll{
+          //   box-sizing: border-box;
+          //   max-height: 100%;
+          //   padding:0 1em;
+          // }
         }
       }
     }

+ 3 - 1
sites/all/themes/custom/edlptheme/templates/content/edlp-ajax--node--default.html.twig

@@ -1,7 +1,9 @@
 <div class="row">
   <div class="col small-col-12 med-col-6 large-col-6">
     <div class="wrapper">
-      {{ content }}
+      {#<div class="os-scroll">#}
+        {{ content }}
+      {#</div>#}
     </div>
   </div>
 </div>