[End User Vault Refresh] Security sub-page (#1538)

* [End User Vault Refresh] Security section

* Updated routing module

* Update routing for change-password

* Updated buttons of all modified classes // imported button module

* Converted modified class to use bit-callout

* removed comments

* Update small button to current cl button

src/scss/base.scss

@@ -39,7 +39,8 @@ body {
 }
 
 .page-header,
-.secondary-header {
+.secondary-header,
+.tabbed-header {
   margin-bottom: 0.5rem;
   padding-bottom: 0.6rem;
   @include themify($themes) {
@@ -64,6 +65,11 @@ body {
   margin-top: 4rem;
 }
 
+.tabbed-header {
+  margin-top: 2rem;
+  margin-bottom: 1rem;
+}
+
 img.logo {
   display: block;
   height: 43px;

src/scss/navigation.scss

@@ -74,6 +74,27 @@
     height: 100%;
   }
 
+  .org-name {
+    line-height: 1;
+    span {
+      display: block;
+      font-size: $font-size-lg;
+      @include themify($themes) {
+        color: themed("textHeadingColor");
+      }
+    }
+  }
+}
+
+.tabbed-nav {
+  @include themify($themes) {
+    border-bottom: 1px solid themed("borderColor");
+    color: themed("textColor");
+  }
+}
+
+.org-nav,
+.tabbed-nav {
   .nav-tabs {
     border-bottom: none;
 
@@ -90,6 +111,7 @@
         padding-top: calc(#{$nav-link-padding-y} - 2px);
         @include themify($themes) {
           border-top: 3px solid themed("primary");
+          border-bottom: 1px solid themed("backgroundColor");
           color: themed("linkColor");
         }
       }
@@ -101,15 +123,4 @@
       }
     }
   }
-
-  .org-name {
-    line-height: 1;
-    span {
-      display: block;
-      font-size: $font-size-lg;
-      @include themify($themes) {
-        color: themed("textHeadingColor");
-      }
-    }
-  }
 }