Merge pull request shipshapecode#208 from HubSpot/round-position-on-n…

…on-retina

Round position on non-retina displays

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "tether",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "homepage": "http://github.hubspot.com/tether",
   "authors": [
     "Zack Bloom <[email protected]>",

component.json

@@ -1,7 +1,7 @@
 {
   "name": "tether",
   "repo": "HubSpot/tether",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "description": "A client-side library to make absolutely positioned elements attach to elements in the page efficiently.",
   "authors": [
     "Zack Bloom <[email protected]>",

dist/js/tether.js

@@ -1,4 +1,4 @@
-/*! tether 1.3.5 */
+/*! tether 1.3.6 */
 
 (function(root, factory) {
   if (typeof define === 'function' && define.amd) {
@@ -1181,6 +1181,15 @@ var TetherClass = (function (_Evented) {
             xPos = -_pos.right;
           }
 
+          if (window.matchMedia) {
+            // HubSpot/tether#207
+            var retina = window.matchMedia('only screen and (min-resolution: 1.3dppx)').matches || window.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 1.3)').matches;
+            if (!retina) {
+              xPos = Math.round(xPos);
+              yPos = Math.round(yPos);
+            }
+          }
+
           css[transformKey] = 'translateX(' + xPos + 'px) translateY(' + yPos + 'px)';
 
           if (transformKey !== 'msTransform') {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tether",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "description": "A client-side library to make absolutely positioned elements attach to elements in the page efficiently.",
   "authors": [
     "Zack Bloom <[email protected]>",

src/js/tether.js

@@ -697,6 +697,16 @@ class TetherClass extends Evented {
           xPos = -_pos.right;
         }
 
+        if (window.matchMedia) {
+          // HubSpot/tether#207
+          const retina = window.matchMedia('only screen and (min-resolution: 1.3dppx)').matches ||
+                         window.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 1.3)').matches;
+          if (!retina) {
+            xPos = Math.round(xPos);
+            yPos = Math.round(yPos);
+          }
+        }
+
         css[transformKey] = `translateX(${ xPos }px) translateY(${ yPos }px)`;
 
         if (transformKey !== 'msTransform') {