From 5288083e4a8e0d060d59f63714c6eb23862f1b25 Mon Sep 17 00:00:00 2001
From: Phlegx Systems OG <register@phlegx.com>
Date: Fri, 19 Jul 2019 15:56:00 +0200
Subject: [PATCH 1/3] Fix Safari linear gradient and animation overflow.

---
 src/styles.scss | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/styles.scss b/src/styles.scss
index f87546b..2e79804 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -23,7 +23,9 @@ $vue-content-placeholders-spacing: 10px !default;
 // Mixins
 @mixin vue-content-placeholders {
   position: relative;
-  overflow: hidden;
+  overflow: hidden;  /* Other browser*/
+  overflow: overlay; /* Chrome */
+  z-index: 1;
   height: $vue-content-placeholders-line-height;
   background: $vue-content-placeholders-secondary-color;
 
@@ -44,7 +46,7 @@ $vue-content-placeholders-spacing: 10px !default;
     width: 100vw;
     max-width: 1000px;
     height: 100%;
-    background: linear-gradient(to right, transparent 0%, darken($vue-content-placeholders-secondary-color, 5%) 15%, transparent 30%);
+    background: linear-gradient(to right, rgba(darken($vue-content-placeholders-secondary-color, 5%), 0) 0%, darken($vue-content-placeholders-secondary-color, 5%) 15%, rgba(darken($vue-content-placeholders-secondary-color, 5%), 0) 30%);
     animation-duration: 1.5s;
     animation-fill-mode: forwards;
     animation-iteration-count: infinite;

From 0bdc7a5c89a0c7c74ce069f35582809304ae483e Mon Sep 17 00:00:00 2001
From: Phlegx Systems OG <register@phlegx.com>
Date: Fri, 19 Jul 2019 16:03:16 +0200
Subject: [PATCH 2/3] Revert overflow bug fix.

---
 src/styles.scss | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/styles.scss b/src/styles.scss
index 2e79804..46ffa52 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -23,9 +23,7 @@ $vue-content-placeholders-spacing: 10px !default;
 // Mixins
 @mixin vue-content-placeholders {
   position: relative;
-  overflow: hidden;  /* Other browser*/
-  overflow: overlay; /* Chrome */
-  z-index: 1;
+  overflow: hidden;
   height: $vue-content-placeholders-line-height;
   background: $vue-content-placeholders-secondary-color;
 

From 84a6f611642ed3709e49c4c3a000722808e2725a Mon Sep 17 00:00:00 2001
From: Phlegx Systems OG <register@phlegx.com>
Date: Fri, 19 Jul 2019 16:11:21 +0200
Subject: [PATCH 3/3] Fix overflow animation bug in Chrome.

---
 src/styles.scss | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/styles.scss b/src/styles.scss
index 46ffa52..8a65514 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -23,7 +23,12 @@ $vue-content-placeholders-spacing: 10px !default;
 // Mixins
 @mixin vue-content-placeholders {
   position: relative;
-  overflow: hidden;
+  overflow: hidden;  /* Other browsers */
+  overflow: overlay; /* Chrome */
+  &::-webkit-scrollbar {
+      width: 0;
+      height: 0;
+  }
   height: $vue-content-placeholders-line-height;
   background: $vue-content-placeholders-secondary-color;