Dark theme for Karma+Jasmine (with instructions for installation)

karma.css

/**
  CSS for overriding Karma's default CSS. Also pertains to Jasmine ran through
  Karma.

  USAGE: 
    - Include in Karma's config as per this link:
      https://github.com/karma-runner/karma/issues/431#issuecomment-28294234
    - If need dark theme to cover the outer frame of the test runner,
      add link to node_modules/karma/static/client*.html...:
      <link type="text/css" href="base/karma.css" rel="stylesheet">
      Once the links are setup a simple refresh of the test browser is enough to
      pick up new styles.
  
  RELATED GITHUB QUESTION: https://stackoverflow.com/questions/47404241/how-can-i-get-karma-browsers-to-use-a-dark-theme
  GIST: https://gist.github.com/Neofish22/3c085929727af48ff07a1d90380f7609
  AUTHOR: Sam Fisk 2018.04.09 (sam@gmaemoo.se, https://gmaemoo.se).
  LICENSE: None. Feel free to copy, reuse, distribute, etc. Credit appreciated.
  Based from inline CSS in node_modules/karma/static/client_with_context.html
**/
/* Karma styles */

iframe {
}

html, body {
  background-color: #222;
  color: #aaa;
}

#banner.offline {
  background-color: #555;
  color: #000;
}

#banner.online {
  background-color: #160;
  color: #040;
}

.idle {
}

.executing {
  background: #a33;
}

#banner {
}

h1 {
}

ul {
}

li {
}

.btn-debug {
  -moz-box-shadow:inset 0px 1px 0px 0px #000;
  -webkit-box-shadow:inset 0px 1px 0px 0px #000;
  box-shadow:inset 0px 1px 0px 0px #000;
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #666), color-stop(1, #333) );
  background:-moz-linear-gradient( center top, #666 5%, #333 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#666', endColorstr='#333');
  background-color:#666;
  border:1px solid #000;
  color:#ccc;
  text-shadow:1px 1px 0px #000;
}

.btn-debug:hover {
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #333), color-stop(1, #666) );
  background:-moz-linear-gradient( center top, #333 5%, #666 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#333', endColorstr='#666');
  background-color:#333;
}

.title {
  color: #eee;
}

.version, .duration {
}

/* Jasmine styles */

.html-reporter .bar.passed {
  background-color: #250;
}

.html-reporter .bar.failed {
  background-color: #900;
}

.html-reporter .bar.menu {
  background-color: #222;
}

.html-reporter .bar.menu a {
  color: #eee;
}

.html-reporter .suite a {
  color: #eee;
}

.html-reporter .failures .spec-detail .description {
  background-color: #900;
}

.html-reporter .failures .spec-detail .description a {
  color: #eee;
}

.html-reporter .result-message {
  color: #ccc;
}

.html-reporter .stack-trace {
  background-color: #111;
  color: #aaa;
  border-color: #000;
}