From 2600411c700b29d0c88cf73a0cb4241aed0249b1 Mon Sep 17 00:00:00 2001
From: Susmitha Girumala <susmitha@hashicorp.com>
Date: Wed, 30 Sep 2020 12:57:30 -0400
Subject: [PATCH] refactor: Fix sass lint errors in ui/core

---
 ui/core/app/styles/_notify.scss |  8 ++++----
 ui/core/app/styles/app.scss     | 25 +++++++++++++------------
 2 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/ui/core/app/styles/_notify.scss b/ui/core/app/styles/_notify.scss
index 438f0950c..784bc746f 100644
--- a/ui/core/app/styles/_notify.scss
+++ b/ui/core/app/styles/_notify.scss
@@ -61,19 +61,19 @@
 .ember-notify-show {
   -webkit-animation-duration: 500ms;
   -webkit-animation-name: ember-notify-show;
-  -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  -webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1.275);
   animation-duration: 500ms;
   animation-name: ember-notify-show;
-  animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
+  animation-timing-function: cubic-bezier(.175, .885, .32, 1.275);
 }
 
 .ember-notify-hide {
   -webkit-animation-duration: 250ms;
   -webkit-animation-name: ember-notify-hide;
-  -webkit-animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+  -webkit-animation-timing-function: cubic-bezier(.6, -.28, .735, .045);
   animation-duration: 250ms;
   animation-name: ember-notify-hide;
-  animation-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);
+  animation-timing-function: cubic-bezier(.6, -.28, .735, .045);
 
   &:hover {
     -moz-animation-play-state: paused;
diff --git a/ui/core/app/styles/app.scss b/ui/core/app/styles/app.scss
index 9e72b055f..8aad37e0b 100644
--- a/ui/core/app/styles/app.scss
+++ b/ui/core/app/styles/app.scss
@@ -61,17 +61,16 @@
 
   &.loading {
     &::after {
-      content: " ";
-      position: absolute;
-      top: 100%;
-      left: 0;
-      right: 0;
-      height: 3px;
-
-      background: repeating-linear-gradient(to right, #fff, #fff, var(--info), #fff, #fff);
-      background-size: 200% auto;
-      background-position: 0 100%;
       animation: gradient 1s linear infinite;
+      background: repeating-linear-gradient(to right, var(--white), var(--white), var(--info), var(--white), var(--white));
+      background-position: 0 100%;
+      background-size: 200% auto;
+      content: ' ';
+      height: 3px;
+      left: 0;
+      position: absolute;
+      right: 0;
+      top: 100%;
 
       @keyframes gradient {
         0%   { background-position: 0 0; }
@@ -81,6 +80,8 @@
   }
 }
 
-.copyable .copyable-button {
-  padding: 0rem;
+.copyable {
+  .copyable-button {
+    padding: 0;
+  }
 }