cyber-narrator-cn-ui/src/assets/css/components/views/detections/detections.scss

.detection__event-severity-bar {
  flex: 0 0 175px;
  background-color: white;
  width: 100%;
  margin-bottom: 10px;
}
.detection__list {
  display: flex;
  flex-direction: column;
  flex: 1;

  .detection__list-statistics {
    display: flex;
    flex: 0 0 192px;
    margin-bottom: 10px;
    width: 100%;
    background-color: white;

    .chart-header {
      display: flex;
      justify-content:space-between;
      align-items:center;
      padding: 10px 20px 10px 0px;
      height: 40px;

      font-size: 14px;
      color: $--color-text-primary;
      transition: all 0.2s;
      border-bottom: 1px solid #E7EAED;

      .chart-header__title {
        max-width: calc(100% - 100px);
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
    }

    .chart-content {
      height:calc(100% - 40px);
    }
    .statistics__severity {
      width: 33%;
      margin-left:15px;
      margin-right:15px;
    }
    .statistics__category {
      width: 34%;
      margin-left:15px;
      margin-right:15px;
    }
    .statistics__active-attack {
      width: 33%;
      margin-left:15px;
      margin-right:15px;
    }
  }
}