BathHacked/energy-sparks

View on GitHub
app/assets/stylesheets/links.scss

Summary

Maintainability
Test Coverage
a,
a:hover,
a:focus,
a:active,
a.active {
  color: $dark;
  text-decoration: underline;
  outline: none;
}

a.btn,
a.btn:hover,
a.btn:focus,
a.btn:active,
a.btn.active,
a.badge,
a.badge:hover,
a.badge:focus,
a.badge:active,
a.badge.active,
a.nav-link,
a.nav-link:hover,
a.nav-link:focus,
a.nav-link:active,
a.nav-link.active {
  text-decoration: none;
  outline: none;
}

a.badge.outline {
  outline: solid;
  outline-width: 1px;
  outline-color: $light-grey;
}

.btn,
.btn:hover,
.btn:focus,
.btn:active,
.btn.active {
  color: $dark;
  background-image: linear-gradient($white, $light-grey);
  border-color: $grey;
  font-weight: 600 !important;
  border-radius: 50rem !important;
}

.btn-outline-dark {
  background-color: $white;
  background-image: none !important;
  border-color: $dark;
}

.btn.bg-positive {
  border-color: transparent;
  border: none;
}

.btn-outline-dark:hover {
  color: $white;
}

.btn-dark-blue {
  color: $white;
  background-color: $dark-blue;
  background-image: none;
}

.btn-no-border {
  border: $btn-border-width solid transparent;
}

.btn-group {
  .btn {
    margin-left: 5px;
    margin-right: 5px;
  }
}

.btn-group-xs > .btn, .btn-xs {
  padding: 1px 5px;
  font-size: $f9;
  line-height: 1.5;
  border-radius: 3px;
}

.btn-fixed-width-100 {
  width: 100px;
}

.navbar {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    outline: none;
    text-decoration: none;
    font-weight: bold;
    color: $white;
  }
}

li.nav-item a.btn,
li.nav-item a.btn:hover,
li.nav-item a.btn:focus,
li.nav-item a.btn:active {
 // float: right;
  margin-bottom: 3px;
  color: $dark;
  margin-right: 2px;
  margin-left: 2px;
}

.sub-nav  {
  li.nav-item a.btn,
  li.nav-item a.btn:hover,
  li.nav-item a.btn:focus,
  li.nav-item a.btn:active {
    margin-bottom: 0px;
  }
}

.card-deck.activities {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    color: $dark;
    outline: none;
  }
}

.table.timeline {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    color: $dark;
    text-decoration: underline;
    outline: none;
    font-weight: normal;
  }
}

div.activity_type {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    color: $dark;
  }
}

.highcharts-annotation a,
.highcharts-annotation a:hover{
  color: inherit;
  text-decoration: inherit;
}

footer {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    color: $white;
  }
}

section.highlight {
  a,
  a:hover,
  a:focus,
  a:active,
  a.active {
    color: $dark-blue;
    outline: none;
  }
}


// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) {
  .btn,
  .btn:hover,
  .btn:focus,
  .btn:active,
  .btn.active {
    @include font(f9);
  }
}

// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) and (max-width: 767.98px) {
  .btn,
  .btn:hover,
  .btn:focus,
  .btn:active,
  .btn.active {
    @include font(f9);
  }
}