From bb8d80856ddcde8f1bccd9745658e43be3914b96 Mon Sep 17 00:00:00 2001
From: Alex Basson <abasson@vmware.com>
Date: Tue, 12 Oct 2021 17:03:39 -0400
Subject: [PATCH] Refactor nav tabs css

---
 app/assets/stylesheets/bootstrap-overrides.scss |  8 ++++++++
 app/assets/stylesheets/colors.scss              |  6 ------
 app/assets/stylesheets/navigation.scss          | 11 +++++++----
 app/views/sqm_categories/show.html.erb          |  2 +-
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/app/assets/stylesheets/bootstrap-overrides.scss b/app/assets/stylesheets/bootstrap-overrides.scss
index 0eef77a6..a2e9bb48 100644
--- a/app/assets/stylesheets/bootstrap-overrides.scss
+++ b/app/assets/stylesheets/bootstrap-overrides.scss
@@ -1,3 +1,6 @@
+@import 'colors';
+@import 'fonts';
+
 $spacer: 0.5rem;
 $spacers: (
   0: 0,
@@ -12,3 +15,8 @@ $spacers: (
   9: ($spacer * 7),
   10: ($spacer * 8),
 );
+
+$nav-link-color: $white;
+$nav-link-font-weight: 600;
+$nav-tabs-border-color: transparent;
+$nav-tabs-border-radius: 15px;
diff --git a/app/assets/stylesheets/colors.scss b/app/assets/stylesheets/colors.scss
index b518aacd..84c95a89 100644
--- a/app/assets/stylesheets/colors.scss
+++ b/app/assets/stylesheets/colors.scss
@@ -43,12 +43,6 @@ $ideal: #C0FF73;
   background-color: $light-blue;
 }
 
-.nav-tabs {
-  .bg-color-dark-blue {
-    background-color: $dark-blue;
-  }
-}
-
 .bg-color-blue {
   background-color: $blue;
 }
diff --git a/app/assets/stylesheets/navigation.scss b/app/assets/stylesheets/navigation.scss
index c9678df3..6710e490 100644
--- a/app/assets/stylesheets/navigation.scss
+++ b/app/assets/stylesheets/navigation.scss
@@ -1,12 +1,15 @@
+@import 'colors';
+@import 'fonts';
+
 .nav-tabs {
   margin-bottom: -1rem;
-  border-bottom: 1px solid transparent;
+
   .nav-link {
-    color: white;
-    border-top-left-radius: 15px;
-    border-top-right-radius: 15px;
+    @extend .font-bitter;
+    background-color: $dark-blue;
   }
 }
+
 .nav-item {
   margin-right: 1px;
 }
diff --git a/app/views/sqm_categories/show.html.erb b/app/views/sqm_categories/show.html.erb
index 76f10c24..47932b8b 100644
--- a/app/views/sqm_categories/show.html.erb
+++ b/app/views/sqm_categories/show.html.erb
@@ -2,7 +2,7 @@
   <nav class="nav nav-tabs">
     <% @categories.each do |category| %>
       <div class="nav-item">
-        <%= link_to [@district, @school, category, { year: @academic_year.range }], class: ["font-bitter", "weight-600","nav-link", "bg-color-dark-blue", current_page?([@district, @school, category, { year: @academic_year.range }]) ? "active" : ""] do %>
+        <%= link_to [@district, @school, category, { year: @academic_year.range }], class: ["nav-link", current_page?([@district, @school, category, { year: @academic_year.range }]) ? "active" : ""] do %>
           <i class="fa fa-<%= category.icon %> me-2"></i> <%= category.name %>
         <% end %>
       </div>