client/src/app/+video-editor/edit/video-editor-edit.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .columns {
   5   display: flex;
   6
   7   .information {
   8     width: 100%;
   9     margin-left: 50px;
  10
  11     > div {
  12       margin-bottom: 30px;
  13     }
  14
  15     @media screen and (max-width: $small-view) {
  16       display: none;
  17     }
  18   }
  19 }
  20
  21 h1 {
  22   font-size: 20px;
  23 }
  24
  25 h2 {
  26   font-weight: $font-bold;
  27   font-size: 16px;
  28   color: pvar(--mainColor);
  29   background-color: pvar(--mainBackgroundColor);
  30   padding: 0 5px;
  31   width: fit-content;
  32   margin: -8px 0 0;
  33 }
  34
  35 .section {
  36   $min-width: 600px;
  37
  38   @include padding-left(10px);
  39
  40   min-width: $min-width;
  41
  42   margin-bottom: 50px;
  43   border: 1px solid $separator-border-color;
  44   border-radius: 5px;
  45   width: fit-content;
  46
  47   .form-group,
  48   .description {
  49     @include margin-left(5px);
  50   }
  51
  52   .description {
  53     color: pvar(--greyForegroundColor);
  54     margin-top: 5px;
  55     margin-bottom: 15px;
  56   }
  57
  58   @media screen and (max-width: $min-width) {
  59     min-width: none;
  60   }
  61 }
  62
  63 my-timestamp-input {
  64   display: block;
  65 }
  66
  67 my-embed {
  68   display: block;
  69   max-width: 500px;
  70   width: 100%;
  71 }
  72
  73 my-reactive-file {
  74   display: block;
  75   width: fit-content;
  76 }