client/src/app/+admin/system/logs/logs.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .logs {
   5   font-family: monospace;
   6   font-size: 13px;
   7   max-height: 500px;
   8   overflow-y: auto;
   9   background: rgba(0, 0, 0, 0.03);
  10   padding: 20px;
  11
  12   .log-row {
  13     margin-top: 1px;
  14     word-break: break-word;
  15
  16     &:hover {
  17       background: rgba(0, 0, 0, 0.07);
  18     }
  19   }
  20
  21   .log-level {
  22     @include margin-right(5px);
  23
  24     font-weight: $font-semibold;
  25   }
  26
  27   .log-by {
  28     margin: 0 5px;
  29   }
  30
  31   .warn {
  32     color: pvar(--mainColor);
  33   }
  34
  35   .error {
  36     color: $red;
  37   }
  38
  39   pre {
  40     margin-bottom: 5px;
  41     white-space: pre-wrap;
  42     word-wrap: break-word;
  43   }
  44 }
  45
  46 .header {
  47   display: flex;
  48   justify-content: flex-end;
  49   margin-bottom: 10px;
  50
  51   .peertube-select-container {
  52     @include peertube-select-container(150px);
  53   }
  54
  55   my-button,
  56   .peertube-select-container,
  57   ng-select {
  58     @include margin-left(10px);
  59   }
  60 }
  61
  62 .level-choice {
  63   font-size: 80%;
  64   vertical-align: text-top;
  65
  66   &.debug {
  67     color: rgb(197, 197, 197);
  68   }
  69
  70   &.info {
  71     color: rgb(136, 204, 247);
  72   }
  73
  74   &.warn {
  75     color: rgb(252, 166, 7);
  76   }
  77
  78   &.error {
  79     color: rgb(250, 5, 5);
  80   }
  81
  82 }
  83
  84 @include on-small-main-col {
  85   .header {
  86     flex-direction: column;
  87
  88     .peertube-select-container,
  89     ng-select,
  90     my-button {
  91       @include margin-left(0 !important);
  92
  93       width: 100% !important;
  94       margin-bottom: 10px !important;
  95     }
  96
  97     my-button {
  98       text-align: center;
  99     }
 100   }
 101 }