X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2F%2Bsignup%2F%2Bregister%2Fregister.component.scss;h=ae0fdbb6ea658a8980e5706e0c8a197b62633870;hb=d0fbc9fd0a29c37f3ff9b99030351e90b276fe7d;hp=6f61b78f719df5a3c04eb7e6cbfc5461e7016327;hpb=a41b9da1a9ce49df82ea10c82de4c2fbc6d1b189;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/+signup/+register/register.component.scss b/client/src/app/+signup/+register/register.component.scss index 6f61b78f7..ae0fdbb6e 100644 --- a/client/src/app/+signup/+register/register.component.scss +++ b/client/src/app/+signup/+register/register.component.scss @@ -1,58 +1,95 @@ -@import '_variables'; -@import '_mixins'; +@use '_variables' as *; +@use '_mixins' as *; -.alert { - font-size: 15px; - text-align: center; +my-signup-step-title strong { + font-weight: $font-bold; } -.wrapper { +.signup-disabled { + padding-top: 30vh; +} + +.title-page-v2 { + background-color: pvar(--mainColorVeryLight); + margin: 0; + padding-bottom: 10px; +} + +my-instance-about-accordion { + display: block; + margin-bottom: 30px; +} + +.step-buttons { display: flex; - justify-content: space-between; flex-wrap: wrap; + align-items: center; - & > div { - margin-bottom: 40px; - width: 450px; + .skip-step { + @include margin-right(30px); - @media screen and (max-width: 500px) { - width: auto; + display: inline-block; + } + + .skip-step-description { + margin-top: 5px; + font-size: 14px; + } + + .underline-orange { + color: pvar(--mainForegroundColor); + + &:hover { + opacity: 0.8; } } -} -my-instance-features-table { - display: block; + > button { + @include peertube-button-big; - margin-bottom: 40px; -} + &[cdkStepperNext] { + @include orange-button; + } -.form-group-terms { - margin: 30px 0; -} + &[cdkStepperPrevious] { + @include grey-button; + } + } -.input-group { - @include peertube-input-group(400px); -} + > button, + .skip-step { + margin-top: 20px; + margin-bottom: 20px; + } -.input-group-append { - height: 30px; -} + .skip-step, + button[cdkStepperNext] { + @include margin-left(auto); + } -input:not([type=submit]) { - @include peertube-input-text(400px); + .skip-step + button[cdkStepperNext] { + @include margin-left(0); + } +} - display: block; +.done-loader { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; - &#username, - &#name { - width: auto !important; - flex-grow: 1; + my-loader { + margin-bottom: 20px; } } -input[type=submit], -button { - @include peertube-button; - @include orange-button; +@media screen and (max-width: $small-view) { + .step-buttons { + justify-content: space-between; + + .skip-step, + button[cdkStepperNext] { + @include margin-left(0); + } + } }