From e0cab4665a6bebe7bac7bf4289e8cc903e0a4a2f Mon Sep 17 00:00:00 2001
From: Aleksai Losey <aleksailosey@gmail.com>
Date: Fri, 2 Oct 2020 02:49:22 -0400
Subject: [PATCH] Add contrastBorder option to viewport options

---
 croppie.css | 4 ++++
 croppie.js  | 8 +++++++-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/croppie.css b/croppie.css
index 0af2e2c6..dff26211 100644
--- a/croppie.css
+++ b/croppie.css
@@ -35,6 +35,10 @@
     z-index: 0;
 }
 
+.croppie-container .cr-viewport-with-contrast-border {
+    mix-blend-mode: difference;
+}
+
 .croppie-container .cr-resizer {
   z-index: 2;
   box-shadow: none;
diff --git a/croppie.js b/croppie.js
index 5b4cf284..6b0b84c1 100755
--- a/croppie.js
+++ b/croppie.js
@@ -397,6 +397,11 @@
         });
         viewport.setAttribute('tabindex', 0);
 
+
+        if (self.options.viewport.contrastBorder) {
+            addClass(viewport, 'cr-viewport-with-contrast-border');
+        }
+
         addClass(self.elements.preview, 'cr-image');
         setAttributes(self.elements.preview, { 'alt': 'preview', 'aria-grabbed': 'false' });
         addClass(overlay, 'cr-overlay');
@@ -1572,7 +1577,8 @@
         viewport: {
             width: 100,
             height: 100,
-            type: 'square'
+            type: 'square',
+            contrastBorder: false
         },
         boundary: { },
         orientationControls: {