SCSS Framework

Added modernizr script to image Cover example
Added Aspect Ratio variables
Fixed image->fit aspect ratio to w/h instead of h/w
Added impotrant to width/height in image ->cover

TODO vertical center mixin

mixins/_00-mixins.scss

@@ -1,8 +1,11 @@
 // Layout
 @import "layout/layout";
 @import "layout/position";
+
+@import "layout/image/aspect-ratios";
 @import "layout/image/cover";
 @import "layout/image/fit";
+
 @import "layout/menus/_00-menus";
 
 // Queries

mixins/layout/image/_aspect-ratios.scss

@@ -0,0 +1,5 @@
+$ASPECT-CINEMASCOPE: 2.35/1;
+$ASPECT-SUPERSCOPE: 2/1;
+$ASPECT-THIRTYFIVE-MM: 1.35/1;
+$ASPECT-THIRTYFIVE-MM-BROAD: 1.85/1;
+$ASPECT-SQUARE: 1.85/1;

mixins/layout/image/_cover.scss

@@ -7,8 +7,8 @@
   img {
     position: absolute;
     object-fit: cover;
-    width: 100%;
-    height: 100%;
+    width: 100% !important;
+    height: 100% !important;
   }
 
   &:after {

mixins/layout/image/_fit.scss

@@ -33,6 +33,6 @@
   &:after {
     content: "";
     display: block;
-    padding-bottom: 100% * $heightaspect;
+    padding-bottom: 100% / $heightaspect;
   }
 }