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