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

   1 @import '_variables';
   2 @import '_mixins';
   3
   4 .peertube-select-container {
   5   @include peertube-select-container(auto);
   6 }
   7
   8 .video-edit {
   9   height: 100%;
  10   min-height: 300px;
  11
  12   .form-group {
  13     margin-bottom: 25px;
  14   }
  15
  16   input {
  17     @include peertube-input-text(100%);
  18     display: block;
  19
  20     &[type=checkbox] {
  21       @include peertube-checkbox(1px);
  22     }
  23   }
  24
  25   input, select {
  26     font-size: 15px
  27   }
  28
  29   .form-group-checkbox {
  30     display: flex;
  31     align-items: center;
  32
  33     label {
  34       font-weight: $font-regular;
  35       margin: 0;
  36     }
  37
  38     input {
  39       width: 10px;
  40       margin-right: 10px;
  41     }
  42   }
  43
  44   .label-tags + span {
  45     font-size: 15px;
  46   }
  47
  48   .advanced-settings .form-group {
  49     margin-bottom: 20px;
  50   }
  51 }
  52
  53 .captions {
  54
  55   .captions-header {
  56     text-align: right;
  57
  58     .create-caption {
  59       @include create-button('../../../../assets/images/global/add.svg');
  60     }
  61   }
  62
  63   .caption-entry {
  64     display: flex;
  65     height: 40px;
  66     align-items: center;
  67
  68     .caption-entry-label {
  69       font-size: 15px;
  70       font-weight: bold;
  71
  72       margin-right: 20px;
  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     font-size: 15px;
  84   }
  85 }
  86
  87 .submit-container {
  88   text-align: right;
  89
  90   .message-submit {
  91     display: inline-block;
  92     margin-right: 25px;
  93
  94     color: #585858;
  95     font-size: 15px;
  96   }
  97
  98   .submit-button {
  99     @include peertube-button;
 100     @include orange-button;
 101
 102     display: inline-block;
 103
 104     input {
 105       cursor: inherit;
 106       background-color: inherit;
 107       border: none;
 108       padding: 0;
 109       outline: 0;
 110     }
 111
 112     .icon.icon-validate {
 113       @include icon(20px);
 114
 115       cursor: inherit;
 116       position: relative;
 117       top: -1px;
 118       margin-right: 4px;
 119       background-image: url('../../../../assets/images/global/validate.svg');
 120     }
 121   }
 122 }
 123
 124 p-calendar {
 125   display: block;
 126
 127   /deep/ {
 128     input,
 129     .ui-calendar {
 130       width: 100%;
 131     }
 132
 133     input {
 134       @include peertube-input-text(100%);
 135       color: #000;
 136     }
 137   }
 138 }
 139
 140 /deep/ {
 141   .root-tabset > .nav {
 142     margin-left: 15px;
 143     margin-bottom: 15px;
 144
 145     .nav-link {
 146       display: flex !important;
 147       align-items: center;
 148       height: 30px !important;
 149       padding: 0 15px !important;
 150     }
 151   }
 152
 153   .ng2-tag-input {
 154     border: none !important;
 155   }
 156
 157   .ng2-tags-container {
 158     display: flex;
 159     align-items: center;
 160     border: 1px solid #C6C6C6;
 161     border-radius: 3px;
 162     padding: 5px !important;
 163     height: 40px;
 164   }
 165
 166   tag-input-form {
 167     input {
 168       height: 30px !important;
 169       background-color: #fff !important;
 170     }
 171   }
 172
 173   tag {
 174     background-color: #E5E5E5 !important;
 175     border-radius: 3px !important;
 176     font-size: 15px !important;
 177     color: #000 !important;
 178     height: 30px !important;
 179     line-height: 30px !important;
 180     margin: 0 5px 0 0 !important;
 181     cursor: default !important;
 182     padding: 0 8px 0 10px !important;
 183
 184     div {
 185       height: 100% !important;
 186     }
 187   }
 188
 189   delete-icon {
 190     cursor: pointer !important;
 191     height: auto !important;
 192     vertical-align: middle !important;
 193     padding-left: 6px !important;
 194
 195     svg {
 196       position: relative;
 197       top: -1px;
 198       height: auto !important;
 199       vertical-align: middle !important;
 200       fill: #585858 !important;
 201     }
 202
 203     &:hover {
 204       transform: none !important;
 205     }
 206   }
 207 }