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: min-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 }
  84
  85 textarea {
  86   @include peertube-textarea(500px, 150px);
  87
  88   max-width: 100%;
  89   display: block;
  90
  91   &.small {
  92     height: 75px;
  93   }
  94 }
  95
  96 .label-small-info {
  97   font-style: italic;
  98   margin-bottom: 10px;
  99   font-size: 14px;
 100 }
 101
 102 .disabled-checkbox-extra {
 103   &,
 104   ::ng-deep label {
 105     opacity: .5;
 106     pointer-events: none;
 107   }
 108 }
 109
 110 input[disabled] {
 111   opacity: 0.5;
 112 }
 113
 114 ngb-tabset:not(.previews) ::ng-deep {
 115   .nav-link {
 116     font-size: 105%;
 117   }
 118 }
 119
 120 .submit-error {
 121   margin-bottom: 20px;
 122 }
 123
 124 .alert-signup {
 125   width: fit-content;
 126   margin-top: 10px;
 127 }
 128
 129 .callout-container {
 130   position: absolute;
 131   display: flex;
 132   height: 0;
 133   width: 100%;
 134   justify-content: right;
 135
 136   .callout-link {
 137     @include peertube-button-link;
 138
 139     position: relative;
 140     right: 3.3em;
 141     top: .3em;
 142     font-size: 90%;
 143     color: pvar(--mainColor);
 144     background-color: pvar(--mainBackgroundColor);
 145     padding: 0 .3em;
 146   }
 147 }