]> _ Git - fluidbook-v3.git/commitdiff
Investigate why some reference images weren't displaying. Improve centering of hover...
authorstephen@cubedesigners.com <stephen@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Tue, 9 Aug 2016 15:12:41 +0000 (15:12 +0000)
committerstephen@cubedesigners.com <stephen@cubedesigners.com@f5622870-0f3c-0410-866d-9cb505b7a8ef>
Tue, 9 Aug 2016 15:12:41 +0000 (15:12 +0000)
framework/application/views/helpers/HomeReferences.php
less/215-home-references.less

index f24d6d15f2ed2d40977cb6ecf8a740086a42ea68..0cb81f0aa41f6f4eab8bc5f3dbcb7ac08313744a 100644 (file)
@@ -15,7 +15,8 @@ class Fluidbook_View_Helper_HomeReferences extends Fluidbook_View_Helper_HomeLay
 \r
        protected function _references() {\r
                $fluidbooks = Fluidbook_Model_Reference::factory()->where('homeimage != ?', '')->order('date DESC')->limit(30)->find();\r
-               $num = floor(count($fluidbooks) / 3) * 3;\r
+        $count = count($fluidbooks);\r
+               $num = floor($count / 3) * 3; // Round down to the nearest number divisible by 3 so the grid is kept neat\r
 \r
                $res = '';\r
                $i = 0;\r
index a49940a7c775f08c5235fc774d769c5cf2ce3aa8..7146768a7addbc782b1df0048ebd17f8a0669786 100644 (file)
@@ -2,6 +2,21 @@
 \r
 section.references {\r
        position: relative;\r
+\r
+       .content-wrapper {\r
+               .dotclear {\r
+                       width: 50%;\r
+                       max-width: 530px; // Includes padding right\r
+                       padding-right: 30px;\r
+\r
+                       @media @m900 {\r
+                               width: 100%;\r
+                               max-width: none;\r
+                               padding-right: 0;\r
+                       }\r
+               }\r
+       }\r
+\r
        .links {\r
                position: absolute;\r
                bottom: 0;\r
@@ -90,15 +105,6 @@ section.references {
                                }\r
                        }\r
 \r
-                       &.big {\r
-                               .hover {\r
-                                       padding-top: 50%;\r
-                                       .content {\r
-                                               top: -25%;\r
-                                       }\r
-                               }\r
-                       }\r
-\r
                        &.forinfinite {\r
                                @media @m900 {\r
                                        display: none;\r
@@ -124,12 +130,13 @@ section.references {
                        opacity: 0;\r
                        display: none;\r
                        transition: opacity @transition-time-buttons;\r
-                       padding-top: 25%;\r
                        text-align: center;\r
 \r
                        .content {\r
                                position: relative;\r
-                               top: -50%;\r
+                               top: 50%;\r
+                               transform: translateY(-50%);\r
+                               padding: 0 5%;\r
                        }\r
 \r
                        h3 {\r