client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.scss

   1 @use '_variables' as *;
   2 @use '_mixins' as *;
   3
   4 $form-base-input-width: 340px;
   5
   6 label {
   7   font-weight: $font-regular;
   8   font-size: 100%;
   9 }
  10
  11 form {
  12   padding-bottom: 1.5rem;
  13 }
  14
  15 input[type=text] {
  16   @include peertube-input-text($form-base-input-width);
  17
  18   display: block;
  19 }
  20
  21 input[type=number] {
  22   @include peertube-input-text($form-base-input-width);
  23
  24   display: block;
  25 }
  26
  27 .number-with-unit {
  28   position: relative;
  29   width: min-content;
  30
  31   input[type=number] + span {
  32     position: absolute;
  33     top: 5px;
  34     right: 2.5rem;
  35   }
  36
  37   input[disabled] {
  38     background-color: #f9f9f9;
  39     pointer-events: none;
  40   }
  41 }
  42
  43 input[type=checkbox] {
  44   @include peertube-checkbox(1px);
  45 }
  46
  47 .peertube-select-container {
  48   @include peertube-select-container($form-base-input-width);
  49 }
  50
  51 my-select-options,
  52 my-select-custom-value,
  53 my-select-checkbox {
  54   @include responsive-width($form-base-input-width);
  55
  56   display: block;
  57 }
  58
  59 input[type=submit] {
  60   @include peertube-button;
  61   @include orange-button;
  62   @include margin-left(auto);
  63
  64   display: flex;
  65
  66   + .form-error {
  67     @include margin-left(5px);
  68
  69     display: inline;
  70   }
  71 }
  72
  73 .inner-form-title {
  74   @include settings-big-title;
  75 }
  76
  77 textarea {
  78   @include peertube-textarea(500px, 150px);
  79
  80   max-width: 100%;
  81   display: block;
  82
  83   &.small {
  84     height: 75px;
  85   }
  86 }
  87
  88 .label-small-info {
  89   font-style: italic;
  90   margin-bottom: 10px;
  91 }
  92
  93 .disabled-checkbox-extra {
  94   &,
  95   ::ng-deep label {
  96     opacity: .5;
  97     pointer-events: none;
  98   }
  99 }
 100
 101 input[disabled] {
 102   opacity: 0.5;
 103 }
 104
 105 ngb-tabset:not(.previews) ::ng-deep {
 106   .nav-link {
 107     font-size: 105%;
 108   }
 109 }
 110
 111 .submit-error {
 112   margin-bottom: 20px;
 113 }
 114
 115 .alert-signup {
 116   width: fit-content;
 117   margin-top: 10px;
 118 }
 119
 120 .callout-container {
 121   position: absolute;
 122   display: flex;
 123   height: 0;
 124   width: 100%;
 125   justify-content: right;
 126
 127   .callout-link {
 128     @include peertube-button-link;
 129
 130     position: relative;
 131     right: 3.3em;
 132     top: .3em;
 133     font-size: 90%;
 134     color: pvar(--mainColor);
 135     background-color: pvar(--mainBackgroundColor);
 136     padding: 0 .3em;
 137   }
 138 }