Use grid to organise settings in admin, my-account
[oweals/peertube.git] / client / src / app / +admin / config / edit-custom-config / edit-custom-config.component.scss
1 @import '_variables';
2 @import '_mixins';
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   display: block;
18 }
19
20 input[type=number] {
21   @include peertube-input-text(315px);
22   display: block;
23 }
24
25 input[type=checkbox] {
26   @include peertube-checkbox(1px);
27 }
28
29 .peertube-select-container {
30   @include peertube-select-container($form-base-input-width);
31 }
32
33 input[type=submit] {
34   @include peertube-button;
35   @include orange-button;
36
37   display: flex;
38   margin-left: auto;
39
40   & + .form-error {
41     display: inline;
42     margin-left: 5px;
43   }
44 }
45
46 .inner-form-title {
47   @include settings-big-title;
48 }
49
50 textarea {
51   @include peertube-textarea(500px, 150px);
52
53   display: block;
54
55   &.small {
56     height: 75px;
57   }
58 }
59
60 .label-small-info {
61   font-style: italic;
62   margin-bottom: 10px;
63 }
64
65 .disabled-checkbox-extra {
66   opacity: .5;
67   pointer-events: none;
68 }
69
70 my-markdown-textarea ::ng-deep {
71   .root {
72     @media screen and (max-width: 1400px) {
73       flex-direction: column !important;
74     }
75   }
76 }
77
78 .form-group-right {
79   padding-top: 2px;
80 }
81
82 ngb-tabset:not(.previews) ::ng-deep {
83   .nav-link {
84     font-size: 105%;
85   }
86 }