client/src/app/+videos/+video-edit/shared/video-edit.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 .peertube-select-container {
   5   @include peertube-select-container(auto);
   6 }
   7
   8 my-peertube-checkbox {
   9   display: block;
  10   margin-bottom: 1rem;
  11 }
  12
  13 .nav-tabs {
  14   margin-bottom: 15px;
  15 }
  16
  17 .video-edit {
  18   height: 100%;
  19   min-height: 300px;
  20
  21   input {
  22     @include peertube-input-text(100%);
  23     display: block;
  24   }
  25 }
  26
  27 .captions-header {
  28   text-align: end;
  29   margin-bottom: 1rem;
  30 }
  31
  32 .create-caption {
  33   @include create-button;
  34 }
  35
  36 .caption-entry {
  37   display: flex;
  38   height: 40px;
  39   align-items: center;
  40
  41   a.caption-entry-label {
  42     @include disable-default-a-behaviour;
  43
  44     flex-grow: 1;
  45     color: #000;
  46
  47     &:hover {
  48       opacity: 0.8;
  49     }
  50   }
  51
  52   .caption-entry-label {
  53     @include margin-right(20px);
  54
  55     font-weight: bold;
  56     width: 150px;
  57   }
  58
  59   .caption-entry-state {
  60     width: 200px;
  61
  62     &.caption-entry-state-create {
  63       color: #39CC0B;
  64     }
  65
  66     &.caption-entry-state-delete {
  67       color: #FF0000;
  68     }
  69   }
  70
  71   .caption-entry-edit {
  72     @include peertube-button;
  73   }
  74
  75   .caption-entry-delete {
  76     @include peertube-button;
  77     @include grey-button;
  78   }
  79 }
  80
  81 .no-caption {
  82   text-align: center;
  83 }
  84
  85 .submit-container {
  86   text-align: end;
  87
  88   .message-submit {
  89     @include margin-right(25px);
  90
  91     display: inline-block;
  92     color: pvar(--greyForegroundColor);
  93   }
  94 }
  95
  96 p-calendar {
  97   display: block;
  98
  99   ::ng-deep {
 100     .p-calendar {
 101       width: 100%;
 102     }
 103
 104     .p-inputtext {
 105       @include peertube-input-text(100%);
 106       color: #000;
 107     }
 108   }
 109 }
 110
 111 .form-columns {
 112   display: grid;
 113
 114   grid-template-columns: 66% 1fr;
 115   grid-gap: 30px;
 116 }
 117
 118 @include on-small-main-col {
 119   .form-columns {
 120     grid-template-columns: 1fr;
 121   }
 122 }