Updating versions of Sparky FE files

Updating versions of Sparky FE files as previous ones were out-dated

Issue-ID: AAI-543
Change-Id: Idc7d09e0efabaa5ef82db126cf7563fc8370f4f9
Signed-off-by: Shawn Severin <shawn.severin@amdocs.com>

7 files changed, 213 insertions, 48 deletions

diff --git a/resources/scss/bootstrap-cust/_buttons.scss b/resources/scss/bootstrap-cust/_buttons.scss
index 52bcb2e..92382aa 100644
--- a/resources/scss/bootstrap-cust/_buttons.scss
+++ b/resources/scss/bootstrap-cust/_buttons.scss
@@ -3,5 +3,5 @@
 }
 
 .btn-info {
-  @include button-variant($text-black, $tlv-gray, $light-gray);
+  @include button-variant($text-color1, $background-color12, $text-color7);
 }
diff --git a/resources/scss/bootstrap-cust/_forms.scss b/resources/scss/bootstrap-cust/_forms.scss
index cb19964..4353521 100644
--- a/resources/scss/bootstrap-cust/_forms.scss
+++ b/resources/scss/bootstrap-cust/_forms.scss
@@ -5,7 +5,7 @@
   &.required {
     label:before {
       content: "*";
-      color: $red;
+      color: $text-color10;
     }
   }
 }
@@ -17,7 +17,7 @@
     @include box-shadow(none);
   }
   &:hover {
-    border-color: $gray;
+    border-color: $neutral-gray;
   }
 }
 
@@ -47,7 +47,7 @@ input[type="radio"], input[type="checkbox"] {
     left: -1px;
     bottom: -1px;
     background-color: $white;
-    border: 1px solid $blue;
+    border: 1px solid $border-color3;
   }
 }
 
@@ -69,7 +69,7 @@ input[type="radio"], input[type="checkbox"] {
 
 input[type=radio]:checked:before {
   content: "\2022";
-  color: $blue;
+  color: $background-color5;
   font-size: 32px;
   text-align: center;
   line-height: 16px;
@@ -78,7 +78,7 @@ input[type=radio]:checked:before {
 input[type=checkbox]:checked:before {
   content: "\2713";
   font-size: 12px;
-  color: $blue;
+  color: $background-color5;
   text-align: center;
   line-height: 16px;
 }
diff --git a/resources/scss/bootstrap-cust/_modals.scss b/resources/scss/bootstrap-cust/_modals.scss
index 6bc6e46..e074d61 100644
--- a/resources/scss/bootstrap-cust/_modals.scss
+++ b/resources/scss/bootstrap-cust/_modals.scss
@@ -1,6 +1,6 @@
 .modal-content {
   .modal-header {
-    border-top: 3px solid $blue;
+    border-top: 3px solid $border-color3;
     .modal-title {
       @extend .heading-2;
     }
@@ -13,6 +13,6 @@
   .modal-footer {
     padding: 15px;
     border-top: 0;
-    background-color: $tlv-gray;
+    background-color: $background-color12;
   }
 }
diff --git a/resources/scss/bootstrap-cust/_navs.scss b/resources/scss/bootstrap-cust/_navs.scss
index 7b9cff9..a00f3d1 100644
--- a/resources/scss/bootstrap-cust/_navs.scss
+++ b/resources/scss/bootstrap-cust/_navs.scss
@@ -7,14 +7,14 @@
 }
 
 .nav-tabs {
-  @include box-shadow(0px 2px 1px -1px $gray);
+  @include box-shadow(0px 2px 1px -1px $neutral-gray);
   padding: 0 28px;
 
   > li {
     @extend .body-1;
 
     > a {
-      color: $dark-gray;
+      color: $background-color2;
       text-transform: uppercase;
     }
 
@@ -23,7 +23,7 @@
       &:hover,
       &:focus {
         @extend .body-1-medium;
-        border-bottom: 3px solid $blue;
+        border-bottom: 3px solid $border-color3;
       }
     }
   }
diff --git a/resources/scss/bootstrap-cust/_scaffolding.scss b/resources/scss/bootstrap-cust/_scaffolding.scss
new file mode 100644
index 0000000..559216b
--- /dev/null
+++ b/resources/scss/bootstrap-cust/_scaffolding.scss
@@ -0,0 +1,154 @@
+//
+// Scaffolding
+// --------------------------------------------------
+
+// Reset the box-sizing
+//
+// Heads up! This reset may cause conflicts with some third-party widgets.
+// For recommendations on resolving such conflicts, see
+// http://getbootstrap.com/getting-started/#third-box-sizing
+* {
+  @include box-sizing(border-box);
+}
+
+*:before,
+*:after {
+  @include box-sizing(border-box);
+}
+
+// Body reset
+
+html {
+  font-size: 10px;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+body {
+  font-family: $base-font-regular;
+  font-size: $font-size-base;
+  line-height: $line-height-base;
+  color: $text-color;
+  background-color: $body-bg;
+}
+
+// Reset fonts for relevant elements
+input,
+button,
+select,
+textarea {
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+// Links
+
+a {
+  color: $link-color;
+  text-decoration: none;
+
+  &:hover,
+  &:focus {
+	color: $link-hover-color;
+	text-decoration: $link-hover-decoration;
+  }
+
+  &:focus {
+	@include tab-focus;
+  }
+}
+
+// Figures
+//
+// We reset this here because previously Normalize had no `figure` margins. This
+// ensures we don't break anyone's use of the element.
+
+figure {
+  margin: 0;
+}
+
+// Images
+
+img {
+  vertical-align: middle;
+}
+
+// Responsive images (ensure images don't scale beyond their parents)
+.img-responsive {
+  @include img-responsive;
+}
+
+// Rounded corners
+.img-rounded {
+  border-radius: $border-radius-large;
+}
+
+// Image thumbnails
+//
+// Heads up! This is mixin-ed into thumbnails.less for `.thumbnail`.
+.img-thumbnail {
+  padding: $thumbnail-padding;
+  line-height: $line-height-base;
+  background-color: $thumbnail-bg;
+  border: 1px solid $thumbnail-border;
+  border-radius: $thumbnail-border-radius;
+  @include transition(all .2s ease-in-out);
+
+  // Keep them at most 100% wide
+  @include img-responsive(inline-block);
+}
+
+// Perfect circle
+.img-circle {
+  border-radius: 50%; // set radius in percents
+}
+
+// Horizontal rules
+
+hr {
+  margin-top: $line-height-computed;
+  margin-bottom: $line-height-computed;
+  border: 0;
+  border-top: 1px solid $hr-border;
+}
+
+// Only display content to screen readers
+//
+// See: http://a11yproject.com/posts/how-to-hide-content/
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
+}
+
+// Use in conjunction with .sr-only to only display content when it's focused.
+// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+// Credit: HTML5 Boilerplate
+
+.sr-only-focusable {
+  &:active,
+  &:focus {
+	position: static;
+	width: auto;
+	height: auto;
+	margin: 0;
+	overflow: visible;
+	clip: auto;
+  }
+}
+
+// iOS "clickable elements" fix for role="button"
+//
+// Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
+// for traditionally non-focusable elements with role="button"
+// see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
+
+[role="button"] {
+  cursor: pointer;
+}
diff --git a/resources/scss/bootstrap-cust/_tables.scss b/resources/scss/bootstrap-cust/_tables.scss
index dc2e0c2..cf0288c 100644
--- a/resources/scss/bootstrap-cust/_tables.scss
+++ b/resources/scss/bootstrap-cust/_tables.scss
@@ -18,23 +18,32 @@
   > tbody + tbody {
 	border-top: none;
   }
+	.table {
+		-webkit-border-horizontal-spacing: 0px !important;
+		-webkit-border-vertical-spacing:0px !important;
+	}
 }
 
 .table-striped {
 	> tbody > tr:nth-of-type( odd ) {
-		background-color: $background-gray;
+		background-color: $background-color1;
 	}
 }
 
 .table-striped {
 	> tbody > tr:nth-of-type( even ) {
-		background-color: $gray;
+		background-color: $neutral-gray;
 	}
 }
 
 .table-hover {
 	> tbody > tr:hover {
-		background-color: $tlv-hover;
+		background-color: $background-color12;
 		cursor: pointer;
 	}
 }
+
+table {
+	-webkit-border-horizontal-spacing: 0px !important;
+	-webkit-border-vertical-spacing:0px !important;
+}
diff --git a/resources/scss/bootstrap-cust/_variables.scss b/resources/scss/bootstrap-cust/_variables.scss
index 1623e72..3a5de51 100644
--- a/resources/scss/bootstrap-cust/_variables.scss
+++ b/resources/scss/bootstrap-cust/_variables.scss
@@ -3,32 +3,34 @@
 //
 //## Gray and brand colors for use across Bootstrap.
 
-$gray-darker: $dark-gray;
-$gray-dark: $dark-gray;
-$gray: $gray;
-$gray-light: $light-gray;
-$gray-lighter: $light-gray;
+$gray-darker: $background-color2;
+$gray-dark: $background-color2;
+$gray: $background-color13;
+$gray-light: $text-color7;
+$gray-lighter: $text-color7;
 
-$brand-primary: $blue;
-$brand-success: $green;
-$brand-info: $light-gray;
-$brand-warning: $yellow;
-$brand-danger: $red;
+$brand-primary: $background-color5;
+$brand-success: $background-color11;
+$brand-info: $text-color7;
+$brand-warning: $text-color9;
+$brand-danger: $text-color10;
 
 
 //== Scaffolding
 //
 //## Settings for some of the most global styles.
 
-$body-bg: $white;
-$text-color: $text-black;
-$link-color: $link-blue;
-$link-hover-color: $blue;
+$body-bg: $primary-background-color;
+$text-color: $text-color1;
+$link-color: $border-color11;
+$link-hover-color: $border-color3;
 
 //== Typography
 //
 //## Font, line-height, and color for body text, headings, and more.
-
+// This variable never used. Maybe delete!!!!
+$font-family-sans-serif: omnes-regular, "Omnes-Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
+//$font-family-base: $font-family-sans-serif !default;
 $font-size-base: $body-font-2;
 $font-size-large: $body-font-1;
 $font-size-small: $body-font-3;
@@ -53,10 +55,10 @@ $border-radius-small: 0;
 
 // $btn-font-weight: normal !default;
 $btn-default-color: $text-color;
-$btn-default-bg: $white;
-$btn-default-border: $light-gray;
+$btn-default-bg: $primary-background-color;
+$btn-default-border: $border-color5;
 
-$btn-success-color: $white;
+$btn-success-color: $primary-background-color;
 
 // Allows for customizing button radius independently from global border radius
 $btn-border-radius-base: 2px;
@@ -65,19 +67,19 @@ $btn-border-radius-small: 2px;
 
 //== Dropdowns
 //
-$dropdown-bg: $white;
-$dropdown-border: $link-blue;
-$dropdown-link-color: $text-black;
+$dropdown-bg: $primary-background-color;
+$dropdown-border: $background-color3;
+$dropdown-link-color: $text-color1;
 $dropdown-divider-bg: $gray;
 //** Hover color for dropdown links.
-$dropdown-link-hover-color: $black;
+$dropdown-link-hover-color: $text-color3;
 //** Hover background for dropdown links.
-$dropdown-link-hover-bg: $tlv-hover;
+$dropdown-link-hover-bg: $background-color12;
 
 //** Active dropdown menu item text color.
-$dropdown-link-active-color: $black;
+$dropdown-link-active-color: $text-color3;
 //** Active dropdown menu item background color.
-$dropdown-link-active-bg: $tlv-hover;
+$dropdown-link-active-bg: $background-color12;
 
 //== Forms
 //
@@ -85,16 +87,16 @@ $dropdown-link-active-bg: $tlv-hover;
 $form-group-margin-bottom: 24px;
 
 
-$input-bg: $white;
-$input-bg-disabled: $tlv-light-gray;
-$input-color: $dark-gray;
-$input-border: $light-gray;
-$input-border-focus: $dark-blue;
+$input-bg: $primary-background-color;
+$input-bg-disabled: $background-color4;
+$input-color:$text-color6;
+$input-border: $text-color7;
+$input-border-focus: $border-color4;
 
 //== Modals
 //
 //##
-$modal-content-bg: $white;
+$modal-content-bg: $primary-background-color;
 $modal-inner-padding: 0 15px;
 $modal-title-padding: 30px 25px 10px 25px;
 
@@ -102,7 +104,7 @@ $modal-title-padding: 30px 25px 10px 25px;
 //== Close
 //
 //##
-$close-color: $tlv-light-gray;
+$close-color: $background-color4;
 
 //== Navs
 //
@@ -116,11 +118,11 @@ $navbar-inverse-bg: $gray;
 $nav-tabs-border-color: transparent;
 $nav-tabs-link-hover-border-color: transparent;
 $nav-tabs-active-link-hover-bg: transparent;
-$nav-tabs-active-link-hover-color: $text-black;
+$nav-tabs-active-link-hover-color: $text-color1;
 $nav-tabs-active-link-hover-border-color: transparent;
 
 
 //== Popovers
 //
 //##
-$popover-bg: $background-gray;
+$popover-bg: $background-color1;