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 .modal-footer.inputs {
25 .action-button.action-button-cancel {
26 width: auto !important;
27 display: inline-block;
31 @media screen and (max-width: #{map-get($container-max-widths, sm)}) {
33 #forgot-password-email {
38 .modal-footer.inputs {
39 .action-button.action-button-cancel {
45 .create-an-account, .forgot-password-button {
46 color: pvar(--mainForegroundColor);
48 transition: opacity cubic-bezier(0.39, 0.575, 0.565, 1);
51 text-decoration: none !important;
52 opacity: .7 !important;
58 justify-content: space-around;
65 .login-form-and-externals {
87 .forgot-password-button,
90 display: inline-block;
92 color: var(--mainColor);
95 color: var(--mainHoverColor);
101 .external-login-blocks {
105 font-weight: $font-semibold;
108 .external-login-block {
109 @include disable-default-a-behaviour;
112 border: 1px solid #d1d7e0;
114 color: pvar(--mainForegroundColor);
115 margin: 10px 10px 0 0;
117 justify-content: center;
123 background-color: rgba(209, 215, 224, 0.5)
129 display: inline-block;
133 .instance-information {
150 @mixin columnReverseDisplay {
151 flex-direction: column-reverse;
153 .login-form-and-externals,
154 .instance-information {
163 .instance-information {
164 ::ng-deep .accordion {
178 @media screen and (max-width: breakpoint(md)) {
180 @include columnReverseDisplay();
184 @media screen and (max-width: breakpoint(md) + $menu-width) {
185 :host-context(.main-col:not(.expanded)) {
187 @include columnReverseDisplay();