]> _ Git - fluidbook-v3.git/commitdiff
wip #7846 @1:00
authorsoufiane <soufiane@cubedesigners.com>
Tue, 9 Dec 2025 11:35:12 +0000 (12:35 +0100)
committersoufiane <soufiane@cubedesigners.com>
Tue, 9 Dec 2025 11:35:12 +0000 (12:35 +0100)
framework/application/views/helpers/HomeServices.php
images/services/Showreel_Fluidbook_05.mp4 [new file with mode: 0644]
less/210-home.less

index 4b41bae0abb8983e5ae88cd3d772aee1c50402db..dce3f9a57d1290f063986f8ce73a6cb7ba36df07 100644 (file)
@@ -19,7 +19,7 @@ class Fluidbook_View_Helper_HomeServices extends Fluidbook_View_Helper_HomeLayer
         $res .= '<div class="clay_ipad">';\r
         $res .= '<img src="/images/services/Pencil.png" class="pencil" />';\r
         $res .= '<img src="/images/services/Eraser.png" class="eraser" />';\r
-        $res .= '<video width="100" loop muted autoplay><source src="/images/services/Showreel_Fluidbook_v0.mp4" /></video>';\r
+        $res .= '<video width="100" loop muted autoplay><source src="/images/services/Showreel_Fluidbook_05.mp4" /></video>';\r
         $res .= '<img src="/images/services/ipad.png" class="layer" />';\r
         $res .= '</div>'; // Ipad container\r
         $res .= '</div>'; // Video wrapper\r
diff --git a/images/services/Showreel_Fluidbook_05.mp4 b/images/services/Showreel_Fluidbook_05.mp4
new file mode 100644 (file)
index 0000000..ce23c2c
Binary files /dev/null and b/images/services/Showreel_Fluidbook_05.mp4 differ
index b11293bc44502fe85ccfc13082271998c37ebf70..8c15fbda367c9acf3b8fb232367cd916c4e4fe31 100644 (file)
 \r
     .video-container {\r
       position: absolute;\r
-      top: 0;\r
       left: 0;\r
       display: flex;\r
       justify-content: flex-end;\r
       width: 100%;\r
-      height: 100%;\r
+      height: max-content;\r
       padding: 0 8%;\r
+      top: 50%;\r
+      transform: translateY(-50%);\r
 \r
       @media @m900 {\r
         position: relative;\r
         padding: 100px 5% 100px;\r
+        height: 100%;\r
+        top: 0;\r
+        transform: none;\r
       }\r
 \r
       .video-wrapper {\r
@@ -51,6 +55,7 @@
         align-items: center;\r
         justify-content: flex-end;\r
         position: relative;\r
+        height: max-content;\r
 \r
         @media @m900 {\r
           flex-direction: column;\r
       .ruler {\r
         position: absolute;\r
         width: 266px;\r
-        bottom: -12vh;\r
+        bottom: -16px;\r
         right: 0;\r
+        transform: translateY(100%);\r
 \r
         @media @m900 {\r
           bottom: 15px;\r
           right: -5%;\r
+          transform: none;\r
         }\r
       }\r
 \r
@@ -76,6 +83,8 @@
         height: auto;\r
         display: flex;\r
         //overflow: hidden;\r
+        box-shadow: 16px 16px 34px rgba(0,0,0,.4);\r
+        border-radius: 35px;\r
         @media @m900 {\r
           width: 100%;\r
         }\r