From 0890539d3c184c589365f79c237201df01dea2b1 Mon Sep 17 00:00:00 2001
From: cp-dharti-r <dharti.r@canopas.com>
Date: Wed, 10 Jan 2024 16:19:00 +0530
Subject: [PATCH] Add style scss

---
 vue/.gitignore            |  4 +--
 vue/src/assets/style.scss | 63 +++++++++++++++++++++++++++++++++++++++
 2 files changed, 64 insertions(+), 3 deletions(-)
 create mode 100644 vue/src/assets/style.scss

diff --git a/vue/.gitignore b/vue/.gitignore
index ada57f7..712cc3c 100644
--- a/vue/.gitignore
+++ b/vue/.gitignore
@@ -25,6 +25,4 @@ coverage
 *.ntvs*
 *.njsproj
 *.sln
-*.sw?
-
-src/assets/style.scss
\ No newline at end of file
+*.sw?
\ No newline at end of file
diff --git a/vue/src/assets/style.scss b/vue/src/assets/style.scss
new file mode 100644
index 0000000..31f2652
--- /dev/null
+++ b/vue/src/assets/style.scss
@@ -0,0 +1,63 @@
+@mixin gradient-striped($color: rgba(255, 255, 255, 0.15), $angle: 45deg) {
+  background-image: -webkit-linear-gradient(
+    $angle,
+    $color 25%,
+    transparent 25%,
+    transparent 50%,
+    $color 50%,
+    $color 75%,
+    transparent 75%,
+    transparent
+  );
+  background-image: -o-linear-gradient(
+    $angle,
+    $color 25%,
+    transparent 25%,
+    transparent 50%,
+    $color 50%,
+    $color 75%,
+    transparent 75%,
+    transparent
+  );
+  background-image: linear-gradient(
+    $angle,
+    $color 25%,
+    transparent 25%,
+    transparent 50%,
+    $color 50%,
+    $color 75%,
+    transparent 75%,
+    transparent
+  );
+}
+
+@-webkit-keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+@keyframes progress-bar-stripes {
+  from {
+    background-position: 40px 0;
+  }
+  to {
+    background-position: 0 0;
+  }
+}
+
+@mixin animation($animation) {
+  -webkit-animation: $animation;
+  -o-animation: $animation;
+  animation: $animation;
+}
+.progress.active .progress-bar {
+  @include animation(progress-bar-stripes 2s linear infinite);
+}
+.progress-striped .progress-bar {
+  @include gradient-striped;
+  background-size: 40px 40px;
+}