3 @import './_bootstrap-variables';
4 @import '~bootstrap/scss/functions';
5 @import '~bootstrap/scss/variables';
13 @include peertube-input-text(340px);
19 .forgot-password-instructions {
24 @media screen and (max-width: #{map-get($container-max-widths, sm)}) {
26 #forgot-password-email {
31 .modal-footer .grey-button {
37 .forgot-password-button {
38 color: pvar(--mainForegroundColor);
40 transition: opacity cubic-bezier(0.39, 0.575, 0.565, 1);
43 text-decoration: none !important;
44 opacity: .7 !important;
50 justify-content: space-around;
57 .login-form-and-externals {
80 .forgot-password-button,
83 display: inline-block;
85 color: var(--mainColor);
89 color: var(--mainHoverColor);
95 .external-login-blocks {
99 font-weight: $font-semibold;
102 .external-login-block {
103 @include disable-default-a-behaviour;
106 border: 1px solid #d1d7e0;
108 color: pvar(--mainForegroundColor);
109 margin: 10px 10px 0 0;
111 justify-content: center;
117 background-color: rgba(209, 215, 224, 0.5);
123 display: inline-block;
127 .instance-information {
144 @mixin column-reverse-display {
145 flex-direction: column-reverse;
147 .login-form-and-externals,
148 .instance-information {
157 .instance-information {
158 ::ng-deep .accordion {
172 @media screen and (max-width: breakpoint(md)) {
174 @include column-reverse-display();
178 @media screen and (max-width: breakpoint(md) + $menu-width) {
179 :host-context(.main-col:not(.expanded)) {
181 @include column-reverse-display();