3 @import './_bootstrap-variables';
4 @import '~bootstrap/scss/functions';
5 @import '~bootstrap/scss/variables';
11 input:not([type=submit]) {
12 @include peertube-input-text(340px);
13 display: inline-block;
19 @include peertube-button;
20 @include orange-button;
26 .forgot-password-instructions {
31 .modal-footer.inputs {
32 .action-button.action-button-cancel {
33 width: auto !important;
34 display: inline-block;
38 @media screen and (max-width: #{map-get($container-max-widths, sm)}) {
40 #forgot-password-email {
45 .modal-footer.inputs {
46 .action-button.action-button-cancel {
52 .create-an-account, .forgot-password-button {
53 color: pvar(--mainForegroundColor);
55 transition: opacity cubic-bezier(0.39, 0.575, 0.565, 1);
58 text-decoration: none !important;
59 opacity: .7 !important;
65 justify-content: space-around;
72 .login-form-and-externals {
94 .forgot-password-button,
97 display: inline-block;
99 color: var(--mainColor);
102 color: var(--mainHoverColor);
108 .external-login-blocks {
112 font-weight: $font-semibold;
115 .external-login-block {
116 @include disable-default-a-behaviour;
119 border: 1px solid #d1d7e0;
121 color: pvar(--mainForegroundColor);
122 margin: 10px 10px 0 0;
124 justify-content: center;
130 background-color: rgba(209, 215, 224, 0.5)
136 display: inline-block;
140 .instance-information {
157 @mixin columnReverseDisplay {
158 flex-direction: column-reverse;
160 .login-form-and-externals,
161 .instance-information {
170 .instance-information {
171 ::ng-deep .accordion {
185 @media screen and (max-width: breakpoint(md)) {
187 @include columnReverseDisplay();
191 @media screen and (max-width: breakpoint(md) + $menu-width) {
192 :host-context(.main-col:not(.expanded)) {
194 @include columnReverseDisplay();