// ———- // Sass declarations // ———- $value-color: #FFF; $background-error-color: #E64040; $background-passed-color: rgba(111, 214, 85, 0.66); $background-investigation-color: #E64040; $background-started-color: #E7D100; $background-no-status-color: rgba(115, 115, 115, 0.73);

$title-color: rgba(255, 255, 255, 1); $label-color: rgba(255, 255, 255, 0.7); $moreinfo-color: rgba(255, 255, 255, 0.7); $background: #444;

@mixin keyframes($animation-name) {

@-webkit-keyframes #{$animation-name} {
  @content;
}
@-moz-keyframes #{$animation-name} {
  @content;
}
@-ms-keyframes #{$animation-name} {
  @content;
}
@-o-keyframes #{$animation-name} {
  @content;
}
@keyframes #{$animation-name} {
  @content;
}

}

@mixin animation($args…) {

-webkit-animation: $args;
-moz-animation: $args;
-ms-animation: $args;
-o-animation: $args;
animation: $args;

}

@include keyframes(blink) {

0% { opacity: 1.0; }
50% { opacity: 0.0; }
100% { opacity: 1.0; }

}

// —————————————————————————- // Widget-list styles // —————————————————————————- .widget-team-city{

background-color: $background;
vertical-align: top !important;

h1{
  text-transform: none;
}
h3{
  font-size: 15px;
  margin: 5px 0;
  font-weight: lighter;
}

img {
  position: absolute;
  top: 30px;
  left: 50px;
  margin: 0 auto;
  opacity: 0.05;
  max-width: 80%;
  max-height: 80%;
}

.title, strong{
  color: $title-color;
}

ul {
  margin: 0;
  text-align: left;
  list-style: none;
  color: $label-color;
}

li {
  margin-bottom: 3px;
}

.project{
  .project-name{
    padding-top: 5px;
  }
}
.builds{
  p{
    padding: 8px;
  }
  li{
    background-color: $background-no-status-color;
    font-size: 15px;
  }
  margin-bottom: 5px;
  .SUCCESS{
    background-color: $background-passed-color;
  }
  .FAILURE{
    background-color: $background-error-color;
    @include animation(blink 1s step-start 0s infinite);
  }
  .INVESTIGATION{
    span:before{
      content: "\f06e";
      font-family: FontAwesome;
      padding-right: 3px;
    }
    background-color: $background-investigation-color;
  }
  .build-type-name{
    font-size: 17px;
  }
}

.updated-at {
  color: rgba(0, 0, 0, 0.3);
}

.more-info {
  color: $moreinfo-color;
}

}