wait #7830 @9:00

diff --git a/framework/application/views/helpers/BackgroundBlock.php b/framework/application/views/helpers/BackgroundBlock.php
index d247d2c38489f348c827df8a61072803d012bdc4..54d1b2e0fec96c82f30b21b5fd4b4c99f1b4e92f 100644 (file)
--- a/framework/application/views/helpers/BackgroundBlock.php
+++ b/framework/application/views/helpers/BackgroundBlock.php
@@ -25,8 +25,9 @@ class Fluidbook_View_Helper_BackgroundBlock extends CubeIT_View_Helper_Abstract
 \r
             $extra_attributes = array();\r
             $bg = '';\r
+            $mobiles = [];\r
             if ($data['bg_image']) {\r
-                foreach ($data['bg_image'] as $img) {\r
+                foreach ($data['bg_image'] as $key => $img) {\r
                     $bgimage = CubeIT_Util_Cms::extractFile($img);\r
                     $image_path = CubeIT_View_Helper_ImageCms::getPath($bgimage);\r
 \r
@@ -51,14 +52,14 @@ class Fluidbook_View_Helper_BackgroundBlock extends CubeIT_View_Helper_Abstract
                         }\r
                     } else {\r
                         if (isset($data['backgroundmobileimage'])) {\r
-                            $bgmobileimage = CubeIT_Util_Cms::extractFile($data['backgroundmobileimage']);\r
+                            $bgmobileimage = CubeIT_Util_Cms::extractFile($data['backgroundmobileimage'][$key]);\r
                             if ($bgmobileimage) {\r
                                 $attributes['data-has-mobile'] = '1';\r
                                 $mobile_path = CubeIT_View_Helper_ImageCms::getPath($bgmobileimage);\r
                                 CubeIT_Image::getDimensions($mobile_path, $image_width, $image_height);\r
                                 $image_ratio = $image_height / $image_width;\r
                                 $attributes['data-mobile-ratio'] = $image_ratio;\r
-                                $target_height = $mobile_max_width * $image_ratio;\r
+                                $target_height = 2000 * $image_ratio;\r
                                 $mobile = $this->imageProcess()->imageProcessGetURL($mobile_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');\r
                             } else {\r
                                 $mobile = $this->imageProcess()->imageProcessGetURL($image_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');\r
@@ -67,24 +68,25 @@ class Fluidbook_View_Helper_BackgroundBlock extends CubeIT_View_Helper_Abstract
                             $mobile = $this->imageProcess()->imageProcessGetURL($image_path, '', $mobile_max_width, $target_height, array(), 'C', 'R', 'M');\r
                         }\r
 \r
-                        $pict = $this->picture([\r
-                            [\r
-                                'src' => $image_path,\r
-                                'width' => 2560\r
+\r
+                            $pict = $this->picture([\r
+                                [\r
+                                    'src' => $image_path,\r
+                                    'width' => 2560\r
+                                ],\r
+                                [\r
+                                    'src' => $mobile,\r
+                                    'width' => $mobile_max_width,\r
+                                    'media' => '(max-width: 900px)'\r
+                                ]\r
                             ],\r
-                            [\r
-                                'src' => $mobile,\r
-                                'width' => $mobile_max_width,\r
-                                'media' => '(max-width: 900px)'\r
-                            ]\r
-                        ],\r
-                            [\r
-                                'alt' => $data['title']\r
-                            ]);\r
+                                [\r
+                                    'alt' => $data['title']\r
+                                ]);\r
                     }\r
                     $bg .= $this->htmlElement($pict, 'div', array('class' => 'picture'));\r
                 }\r
-                $content = $bg . $content;\r
+                $content = '<div class="pictures-container">'.$bg . '</div>'.$content;\r
             }\r
         }\r
 \r

diff --git a/js/210-home.js b/js/210-home.js
index 854156e155e6185fba1bf76371840f264392321a..bfd1ec4f53da975a28461e390c27cfaae5000216 100644 (file)
--- a/js/210-home.js
+++ b/js/210-home.js
@@ -3,6 +3,7 @@ var lastDotIndex;
 registerLoader(load_home, true);\r
 function load_home() {\r
     $(window).on('fluidbookresize', resizeHome);\r
+    console.log('ok')\r
     resizeHome();\r
     initScrollify();\r
     carouselIntro();\r
@@ -254,8 +255,7 @@ function carouselIntro() {
         repeatDelay: 5\r
     });\r
 \r
-    tl.staggerTo(".intro .picture", 1.2, {\r
-        opacity: 1,\r
+    tl.staggerTo("[data-template=home] .intro .picture", 1.2, {\r
+        opacity: 1\r
     }, 5)\r
-\r
 }\r

diff --git a/less/210-home.less b/less/210-home.less
index 8c15fbda367c9acf3b8fb232367cd916c4e4fe31..6fdc39a202ce5056e8590c7c4a150af60f8201dd 100644 (file)
--- a/less/210-home.less
+++ b/less/210-home.less
@@ -1,11 +1,71 @@
 @import "000-imports";\r
 \r
 .home {\r
-  .intro .picture {\r
-    background-color: #f2f6ff;\r
-    opacity: 0;\r
+  .intro {\r
+    .content-wrapper {\r
+      @media @m900 {\r
+        flex-direction: column-reverse;\r
+        padding: 55px 0 0;\r
+      }\r
+    }\r
+\r
+    .pictures-container {\r
+      @media @m900 {\r
+        width: 100%;\r
+        height: 60vh;\r
+        position: relative;\r
+        overflow: hidden;\r
+      }\r
+    }\r
+\r
+    .picture {\r
+      background-color: #f2f6ff;\r
+      opacity: 0;\r
+\r
+      @media @m900 {\r
+        height: 100%;\r
+        padding-top: 0;\r
+        position: static;\r
+      }\r
+\r
+      img {\r
+        @media @m900 {\r
+          object-position: bottom center !important;\r
+        }\r
+      }\r
+    }\r
+\r
+    .content-inner {\r
+\r
+      @media @m900 {\r
+        height: auto;\r
+        text-align: left;\r
+        padding-top: 10px;\r
+        padding-bottom: 0 !important;\r
+      }\r
+\r
+      h1 {\r
+        @media @m900 {\r
+          text-align: left;\r
+        }\r
+      }\r
+\r
+      h1:after, h2:after {\r
+        @media @m900 {\r
+          left: 0;\r
+          margin-left: 0;\r
+        }\r
+      }\r
+    }\r
+\r
+    .scroll-arrow {\r
+      @media @m900 {\r
+        display: none !important;\r
+      }\r
+    }\r
   }\r
 \r
+\r
   .content-wrapper {\r
     &.fullheight {\r
       position: relative;\r
@@ -15,9 +75,20 @@
         background-size: 180%;\r
       }\r
 \r
-      &[data-has-mobile="1"] .content-inner {\r
-        @media @m900 {\r
-          padding-bottom: 55%;\r
+      &[data-has-mobile="1"] {\r
+        background-color: #f2f6ff;\r
+\r
+        .picture {\r
+          @media @m900 {\r
+            height: 0;\r
+            padding-bottom: 54%;\r
+          }\r
+        }\r
+\r
+        .content-inner {\r
+          @media @m900 {\r
+            padding-bottom: 55%;\r
+          }\r
         }\r
       }\r
     }\r

diff --git a/less/214-home-services.less b/less/214-home-services.less
index 8cb408aed415459fdf6667dd9804410d6cd8f2ed..787155230353d9a8253bc3f0ba166ae3da52cd28 100644 (file)
--- a/less/214-home-services.less
+++ b/less/214-home-services.less
@@ -19,6 +19,8 @@ section.services {
   }
   .text {
     padding-right: 30px;
+    position: relative;
+    z-index: 2;
 
     @media @m900 {
       padding-right: 0;