[refs #298] Change crop-classes approach to bg-position

Dennis Heibült · Dennis Heibült · commit 2095664c7a0f · 2018-01-04T13:15:18.000+01:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -6,7 +6,6 @@
 
 ### Breaking changes
 - Remove all `.o-wrapper` modifier and return to the initial, bare wrapper object. [[#299](https://github.com/inuitcss/inuitcss/issues/299)]
-- The `.o-crop__content--center` modifier of the crop object is renamed to `.o-crop__content--centered`. [[#298](https://github.com/inuitcss/inuitcss/issues/298)]
 
 ### New features
 - Add `.o-crop--fill` modifier. [[#278](https://github.com/inuitcss/inuitcss/issues/278)]
diff --git a/objects/_objects.crop.scss b/objects/_objects.crop.scss
@@ -57,44 +57,56 @@ $inuit-crops: (
    *
    */
 
-  .o-crop__content--top {
-    top: 0;
-    bottom: auto;
+  .o-crop__content--left-top {
+    left: 0;
   }
 
-  .o-crop__content--right {
-    right: 0;
-    left: auto;
+  .o-crop__content--left-center {
+    top: 50%;
+    transform: translateY(-50%);
   }
 
-  .o-crop__content--bottom {
+  .o-crop__content--left-bottom {
     top: auto;
     bottom: 0;
   }
 
-  .o-crop__content--left {
-    left: 0;
-    right: auto;
+  .o-crop__content--right-top {
+    right: 0;
+    left: auto;
   }
 
-  .o-crop__content--middle {
+  .o-crop__content--right-center {
     top: 50%;
-    bottom: auto;
     transform: translateY(-50%);
   }
 
-  .o-crop__content--center {
-    right: auto;
+  .o-crop__content--right-bottom {
+    top: auto;
+    right: 0;
+    bottom: 0;
+    left: auto;
+  }
+
+  .o-crop__content--center-top {
     left: 50%;
     transform: translateX(-50%);
   }
 
-  .o-crop__content--centered {
+  .o-crop__content--center,
+  .o-crop__content--center-center {
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
   }
 
+  .o-crop__content--center-bottom {
+    top: auto;
+    bottom: 0;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
 
 
 
