client/src/app/+stats/video/video-stats.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3 @use '_nav' as *;
   4
   5 .overall-stats-embed {
   6   display: flex;
   7   justify-content: space-between;
   8 }
   9
  10 .overall-stats {
  11   display: flex;
  12   flex-wrap: wrap;
  13 }
  14
  15 .overall-stats-card {
  16   display: flex;
  17   justify-content: center;
  18   align-items: center;
  19   height: fit-content;
  20   min-height: 100px;
  21   min-width: 200px;
  22   margin-right: 15px;
  23   background-color: pvar(--submenuBackgroundColor);
  24   margin-bottom: 15px;
  25
  26   .label,
  27   .more-info {
  28     font-size: 14px;
  29   }
  30
  31   .label {
  32     color: pvar(--greyForegroundColor);
  33     font-weight: $font-semibold;
  34     opacity: 0.8;
  35   }
  36
  37   .value {
  38     font-size: 24px;
  39     font-weight: $font-semibold;
  40   }
  41
  42   @media screen and (max-width: $mobile-view) {
  43     min-height: fit-content;
  44     min-width: fit-content;
  45     padding: 15px;
  46   }
  47 }
  48
  49 my-embed {
  50   display: block;
  51   max-width: 500px;
  52   width: 100%;
  53 }
  54
  55 @include on-small-main-col {
  56   my-embed {
  57     display: none;
  58   }
  59 }
  60
  61 .tab-content {
  62   margin-top: 15px;
  63 }
  64
  65 .nav-tabs {
  66   @include peertube-nav-tabs($border-width: 2px);
  67 }
  68
  69 .chart-container {
  70   margin-bottom: 10px;
  71 }
  72
  73 .zoom-container {
  74   display: flex;
  75   justify-content: center;
  76
  77   .description {
  78     font-style: italic;
  79   }
  80 }