SU-SWS/decanter

///
/// Color maps for the Secondary Nav component. Active color is also used to
/// indicate "current" page.
///
/// Color map for the default Secondary Nav component .su-secondary-nav.
///
/// @name $su-secondary-nav-colors
///
/// @group variable

$su-secondary-nav-colors: (
  bg:                             $su-color-black,
  divider:                        $su-color-cool-grey,

  link:                           $su-color-white,
  link--active-hover:             $su-color-digital-red,
  link--hover:                    $su-color-white,
  link--active:                   $su-color-white,
  link--expanded:                 $su-color-white,

  border:                         $su-color-black,
  border--active-hover:           $su-color-digital-red,
  border--hover:                  $su-color-white,
  border--active:                 $su-color-digital-red-light,
  border--expanded:               $su-color-digital-red,
  border--active-expanded:        $su-color-white,

  h--link:                        $su-color-black,
  h--link-hover:                  $su-color-digital-red,
  h--border:                      $su-color-black,
  h--border-hover:                $su-color-digital-red,
  h--border-expanded:             $su-color-foggy-dark,
) !default;

//
/// $su-secondary-nav-dark-colors
//
/// Color map for the Secondary Nav component dark variant .su-secondary-nav--dark.
//
/// Markup: $su-secondary-nav-dark-colors: map-merge($su-secondary-nav-colors, (
///    link--active-hover:                 $su-color-white,
//
///    border--active-hover:               $su-color-white,
///    border--expanded:                   $su-color-white,
//
///    h--link:                            $su-color-white,
///    h--link-hover:                      $su-color-white,
///    h--border:                          $su-color-white,
///    h--border-hover:                    $su-color-white,
///  )
//) !default;
//
/// Styleguide: Variables.Components.secondary-nav-colors.variant-dark
//
$su-secondary-nav-dark-colors: map-merge($su-secondary-nav-colors, (
    link--active-hover:                 $su-color-white,

    border--active-hover:               $su-color-white,
    border--expanded:                   $su-color-white,

    h--link:                            $su-color-white,
    h--link-hover:                      $su-color-white,
    h--border:                          $su-color-white,
    h--border-hover:                    $su-color-white,
  )
) !default;

//
/// $su-secondary-nav-light-colors
//
/// Color map for the Secondary Nav component light variant .su-secondary-nav--light.
//
/// Markup: $su-secondary-nav-light-colors: map-merge($su-secondary-nav-colors, (
///    bg:                                 $su-color-white,
///    divider:                            #d9d9d9,
//
///    link:                               $su-color-black,
///    link--hover:                        $su-color-black,
///    link--active:                       $su-color-digital-red,
///    link--active-hover:                 $su-color-digital-red,
///    link--expanded:                     $su-color-black,
//
///    border--hover:                      $su-color-black,
///    border--active:                     $su-color-digital-red,
///    border--expanded:                   $su-color-black,
///    border--active-expanded:            $su-color-black,
//
///    h--border:                          $su-color-foggy-dark,
///  )
//) !default;
//
/// Styleguide: Variables.Components.secondary-nav-colors.variant-light
//

$su-secondary-nav-light-colors: map-merge($su-secondary-nav-colors, (
    bg:                                 $su-color-white,
    divider:                            #d9d9d9,

    link:                               $su-color-black,
    link--hover:                        $su-color-black,
    link--active:                       $su-color-digital-red,
    link--active-hover:                 $su-color-digital-red,
    link--expanded:                     $su-color-black,

    border--hover:                      $su-color-black,
    border--active:                     $su-color-digital-red,
    border--expanded:                   $su-color-black,
    border--active-expanded:            $su-color-black,

    h--border:                          $su-color-foggy-dark,
  )
) !default;