itsapi/github-listener

*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  color: rgba(255, 255, 255, 0.8);
  background-color: rgb(20, 20, 20);
  font-family: 'Droid Sans', sans-serif;
}

::selection {
  background: rgba(255, 255, 255, 0.6);
}

a {
  color: rgba(255, 255, 255, 0.4)
}

.hide {
  display: none !important;
}

.no-builds {
  margin: 20px;
}

.list {
  list-style: none;
  padding: 0;
  margin: 0;

  width: 25%;
  position: fixed;
  right: 0;
  max-height: 100%;
  overflow-y: auto;
}
  .list .build {
    background-color: rgba(255, 255, 255, 0.2);
    border: 3px solid transparent;
    padding: .7em;
    padding-top: .4em;
    cursor: pointer;
  }
  .list .build.selected {
    background-color: rgba(255, 255, 255, 0.25);
  }
  .list .build:hover {
    background-color: rgba(255, 255, 255, 0.3);
    border: 3px solid rgba(255, 255, 255, 0.1);
  }
  .list .build.status-waiting {
    border-left-color: cyan;
  }
  .list .build.status-running {
    border-left-color: yellow;
  }
  .list .build.status-done {
    border-left-color: green;
  }
  .list .build.status-error {
    border-left-color: red;
  }
    .list .slug,
    .list .branch {
      font-size: .7em;
      margin-bottom: .3em;
      color: rgba(255, 255, 255, .5);
    }
    .list .slug {
      float: left;
    }
    .list .branch {
      float: right;
    }
    .list .commit {
      display: block;
      clear: both;
      word-wrap: break-word;
    }

.info {
  width: 75%;
  left: 0;
  max-height: 100%;
  overflow-y: auto;
}
  .info .header {
    width: 75%;
    position: fixed;
    display: flex;

    color: white;
    background-color: rgb(110, 110, 110);
    border-bottom: 2px solid rgb(50, 50, 50);

    background-repeat: no-repeat;
    background-size: 3em;
    background-position: center left;
  }
  .info .header.image {
    padding-left: 3em;
  }
    .header span {
      display: flex;
      align-items: center;
      min-width: 10em;
      padding: 1em;
      line-height: 1em;
      border-left: 1px dashed rgba(255, 255, 255, .3);
    }
    .header span:first-of-type {
      border: none;
    }
    .header .commit, .header .url {
      display: block;
      word-wrap: break-word;
    }
    .header .rebuild {
      color: black;
      border: none;
      background-color: rgba(255, 255, 255, 0.8);
    }
  .info .log {
    word-wrap: break-word;
    font-family: 'Droid Sans Mono', monospace;
    font-size: 0.8em;
    padding: 1em .5em;
    margin: 0;
  }