diff options
Diffstat (limited to 'client/src/app/+signup')
4 files changed, 21 insertions, 25 deletions
diff --git a/client/src/app/+signup/+register/custom-stepper.component.html b/client/src/app/+signup/+register/custom-stepper.component.html index f43a46842..f2687e520 100644 --- a/client/src/app/+signup/+register/custom-stepper.component.html +++ b/client/src/app/+signup/+register/custom-stepper.component.html | |||
@@ -2,9 +2,10 @@ | |||
2 | <header *ngIf="steps.length > 2"> | 2 | <header *ngIf="steps.length > 2"> |
3 | <div class="header-steps"> | 3 | <div class="header-steps"> |
4 | <ng-container *ngFor="let step of steps; let i = index; let isLast = last;"> | 4 | <ng-container *ngFor="let step of steps; let i = index; let isLast = last;"> |
5 | <div | 5 | <button |
6 | class="step-info" [ngClass]="{ active: selectedIndex === i, completed: isCompleted(step), 'c-hand': isAccessible(step) }" [attr.aria-current]="selectedIndex === i" | 6 | class="step-info button-unstyle" [ngClass]="{ active: selectedIndex === i, completed: isCompleted(step) }" |
7 | (click)="onClick(i)" | 7 | [disabled]="!isAccessible(step)" |
8 | [attr.aria-current]="selectedIndex === i" (click)="onClick(i)" | ||
8 | > | 9 | > |
9 | <div class="step-index"> | 10 | <div class="step-index"> |
10 | <span class="visually-hidden" i18n>Step</span> {{ i + 1 }} | 11 | <span class="visually-hidden" i18n>Step</span> {{ i + 1 }} |
@@ -15,7 +16,7 @@ | |||
15 | </div> | 16 | </div> |
16 | 17 | ||
17 | <div class="step-label">{{ step.label }}</div> | 18 | <div class="step-label">{{ step.label }}</div> |
18 | </div> | 19 | </button> |
19 | 20 | ||
20 | <!-- Do no display if this is the last child --> | 21 | <!-- Do no display if this is the last child --> |
21 | <div *ngIf="!isLast" class="connector"></div> | 22 | <div *ngIf="!isLast" class="connector"></div> |
diff --git a/client/src/app/+signup/+register/custom-stepper.component.scss b/client/src/app/+signup/+register/custom-stepper.component.scss index 919799716..264136b06 100644 --- a/client/src/app/+signup/+register/custom-stepper.component.scss +++ b/client/src/app/+signup/+register/custom-stepper.component.scss | |||
@@ -72,11 +72,6 @@ header { | |||
72 | align-items: center; | 72 | align-items: center; |
73 | width: $index-block-height; | 73 | width: $index-block-height; |
74 | opacity: 0.5; | 74 | opacity: 0.5; |
75 | cursor: default; | ||
76 | |||
77 | &.c-hand { | ||
78 | cursor: pointer; | ||
79 | } | ||
80 | 75 | ||
81 | &.active, | 76 | &.active, |
82 | &.completed { | 77 | &.completed { |
diff --git a/client/src/app/+signup/+register/register.component.html b/client/src/app/+signup/+register/register.component.html index 86763e801..71bca63e3 100644 --- a/client/src/app/+signup/+register/register.component.html +++ b/client/src/app/+signup/+register/register.component.html | |||
@@ -92,9 +92,9 @@ | |||
92 | <button cdkStepperPrevious>{{ defaultPreviousStepButtonLabel }}</button> | 92 | <button cdkStepperPrevious>{{ defaultPreviousStepButtonLabel }}</button> |
93 | 93 | ||
94 | <div class="skip-step"> | 94 | <div class="skip-step"> |
95 | <span class="underline-orange" role="button" (click)="skipChannelCreation()"> | 95 | <button class="underline-orange button-unstyle" (click)="skipChannelCreation()"> |
96 | <strong i18n>I don't want to create a channel</strong> | 96 | <strong i18n>I don't want to create a channel</strong> |
97 | </span> | 97 | </button> |
98 | 98 | ||
99 | <div class="skip-step-description" i18n>You will be able to create a channel later</div> | 99 | <div class="skip-step-description" i18n>You will be able to create a channel later</div> |
100 | </div> | 100 | </div> |
@@ -120,7 +120,7 @@ | |||
120 | [requiresEmailVerification]="requiresEmailVerification" [requiresApproval]="requiresApproval" [instanceName]="instanceName" | 120 | [requiresEmailVerification]="requiresEmailVerification" [requiresApproval]="requiresApproval" [instanceName]="instanceName" |
121 | ></my-signup-success-before-email> | 121 | ></my-signup-success-before-email> |
122 | 122 | ||
123 | <div *ngIf="signupError" class="steps-button"> | 123 | <div *ngIf="signupError" class="step-buttons"> |
124 | <button cdkStepperPrevious>{{ defaultPreviousStepButtonLabel }}</button> | 124 | <button cdkStepperPrevious>{{ defaultPreviousStepButtonLabel }}</button> |
125 | </div> | 125 | </div> |
126 | </cdk-step> | 126 | </cdk-step> |
diff --git a/client/src/app/+signup/+register/register.component.scss b/client/src/app/+signup/+register/register.component.scss index 9904e4ab4..ae0fdbb6e 100644 --- a/client/src/app/+signup/+register/register.component.scss +++ b/client/src/app/+signup/+register/register.component.scss | |||
@@ -44,7 +44,19 @@ my-instance-about-accordion { | |||
44 | } | 44 | } |
45 | } | 45 | } |
46 | 46 | ||
47 | button, | 47 | > button { |
48 | @include peertube-button-big; | ||
49 | |||
50 | &[cdkStepperNext] { | ||
51 | @include orange-button; | ||
52 | } | ||
53 | |||
54 | &[cdkStepperPrevious] { | ||
55 | @include grey-button; | ||
56 | } | ||
57 | } | ||
58 | |||
59 | > button, | ||
48 | .skip-step { | 60 | .skip-step { |
49 | margin-top: 20px; | 61 | margin-top: 20px; |
50 | margin-bottom: 20px; | 62 | margin-bottom: 20px; |
@@ -60,18 +72,6 @@ my-instance-about-accordion { | |||
60 | } | 72 | } |
61 | } | 73 | } |
62 | 74 | ||
63 | button { | ||
64 | @include peertube-button-big; | ||
65 | |||
66 | &[cdkStepperNext] { | ||
67 | @include orange-button; | ||
68 | } | ||
69 | |||
70 | &[cdkStepperPrevious] { | ||
71 | @include grey-button; | ||
72 | } | ||
73 | } | ||
74 | |||
75 | .done-loader { | 75 | .done-loader { |
76 | display: flex; | 76 | display: flex; |
77 | justify-content: center; | 77 | justify-content: center; |