jupyterlab_sparkmonitor/js/timeline.css

Jupyter Lab extension to monitor Apache Spark Jobs

.pm .timelinewrapper {
  max-height: 400px;
  overflow-y: auto;
  clear: both;
}

.pm .vis-labelset .vis-label .vis-inner {
  width: 100px;
}

.pm .vis-item {
  border-radius: 0;
  font-size: smaller;
}

.pm .vis-item .vis-item-content {
  padding: 0;
  width: 100%;
}

.pm .vis-time-axis {
  font-size: smaller;
}

.pm .vis-tooltip {
  color: white;
  background-color: black;
}

.pm .vis-item.vis-background {
  background-color: rgba(191, 191, 191, 0.58);
}

.pm .vis-custom-time {
  pointer-events: none;
  background-color: #42A5F5;
}

.pm .vis-item.itemfinished {
  /* :not(.vis-selected) { */
  background-color: #90dc34;
  border-color: #6c9d34;
  border: 0;
}

.pm .vis-item.itemfailed {
  /* :not(.vis-selected) {  */
  background-color: #F44336;
  border-color: rgb(183, 13, 0);
  color: white;
  border: 0;
}

.pm .vis-item.itemfinished:active {
  background-color: #6c9d34;
}

.pm .vis-selected {
  border-color: #ffc200;
  background-color: #ffc200;
  border: 0;
}

.pm .vis-item.itemrunning {
  /* :not(.vis-selected) { */
  background-color: rgb(134, 199, 251);
  border: 0;
}

.pm .hidephases .taskbarsvg rect {
  stroke: none;
  fill: none;
}

.pm .hidephases .taskbarsvg {
  display: none;
}

.pm .hidephases .taskbardiv:before {
  content: attr(data-taskid);
  padding: 0px 2px;
  text-align: center;
  width: 100%;
}

.pm .showphases .taskbarsvg rect.scheduler-delay-proportion {
  fill: #80B1D3;
  stroke: #6B94B0;
}

.pm .showphases .taskbarsvg rect.deserialization-time-proportion {
  fill: #FB8072;
  stroke: #D26B5F;
}

.pm .showphases .taskbarsvg rect.shuffle-read-time-proportion {
  fill: #FDB462;
  stroke: #D39651;
}

.pm .showphases .taskbarsvg rect.executor-runtime-proportion {
  fill: #B3DE69;
  stroke: #95B957;
}

.pm .showphases .taskbarsvg rect.shuffle-write-time-proportion {
  fill: #FFED6F;
  stroke: #D5C65C;
}

.pm .showphases .taskbarsvg rect.serialization-time-proportion {
  fill: #BC80BD;
  stroke: #9D6B9E;
}

.pm .showphases .taskbarsvg rect.getting-result-time-proportion {
  fill: #8DD3C7;
  stroke: #75B0A6;
}

.pm .taskbarsvg {
  width: 100%;
  height: 20px;
  vertical-align: top;
}

.pm taskbardiv {
  width: 100%;
  height: 100%;
}

.pm .timelinetoolbar {
  padding: 0px 8px;
  color: #444444;
  font-size: small;
}

.pm .timecheckboxspan {
  margin: 0px 5px;
  float: right;
}