aboutsummaryrefslogtreecommitdiffhomepage
path: root/client
diff options
context:
space:
mode:
Diffstat (limited to 'client')
-rw-r--r--client/src/app/+signup/+register/custom-stepper.component.scss4
-rw-r--r--client/src/app/+signup/+register/register.component.html2
-rw-r--r--client/src/app/+signup/+register/register.component.scss7
-rw-r--r--client/src/app/+signup/+register/register.component.ts4
-rw-r--r--client/src/app/+signup/+register/steps/register-step-terms.component.html2
-rw-r--r--client/src/app/+signup/shared/signup-mascot.component.scss2
-rw-r--r--client/src/app/shared/shared-instance/instance-about-accordion.component.html51
-rw-r--r--client/src/app/shared/shared-instance/instance-about-accordion.component.scss6
-rw-r--r--client/src/sass/bootstrap.scss12
-rw-r--r--client/src/sass/class-helpers.scss6
-rw-r--r--client/src/sass/include/_bootstrap-variables.scss2
11 files changed, 78 insertions, 20 deletions
diff --git a/client/src/app/+signup/+register/custom-stepper.component.scss b/client/src/app/+signup/+register/custom-stepper.component.scss
index dfbdc863b..29ed3e194 100644
--- a/client/src/app/+signup/+register/custom-stepper.component.scss
+++ b/client/src/app/+signup/+register/custom-stepper.component.scss
@@ -5,8 +5,8 @@
5$index-block-height: 40px; 5$index-block-height: 40px;
6 6
7header { 7header {
8 margin-bottom: 40px; 8 margin-bottom: 30px;
9 padding-bottom: 60px; 9 padding-bottom: 25px;
10 width: 100%; 10 width: 100%;
11 background-color: pvar(--mainColorVeryLight); 11 background-color: pvar(--mainColorVeryLight);
12} 12}
diff --git a/client/src/app/+signup/+register/register.component.html b/client/src/app/+signup/+register/register.component.html
index 442c65e2d..4094f24cf 100644
--- a/client/src/app/+signup/+register/register.component.html
+++ b/client/src/app/+signup/+register/register.component.html
@@ -27,7 +27,7 @@
27 <strong>I already have an account</strong>, I log in 27 <strong>I already have an account</strong>, I log in
28 </a> 28 </a>
29 29
30 <button i18n cdkStepperNext>I create an account</button> 30 <button i18n cdkStepperNext>Create an account</button>
31 </div> 31 </div>
32 </cdk-step> 32 </cdk-step>
33 33
diff --git a/client/src/app/+signup/+register/register.component.scss b/client/src/app/+signup/+register/register.component.scss
index c706d6955..9904e4ab4 100644
--- a/client/src/app/+signup/+register/register.component.scss
+++ b/client/src/app/+signup/+register/register.component.scss
@@ -1,6 +1,10 @@
1@use '_variables' as *; 1@use '_variables' as *;
2@use '_mixins' as *; 2@use '_mixins' as *;
3 3
4my-signup-step-title strong {
5 font-weight: $font-bold;
6}
7
4.signup-disabled { 8.signup-disabled {
5 padding-top: 30vh; 9 padding-top: 30vh;
6} 10}
@@ -8,11 +12,12 @@
8.title-page-v2 { 12.title-page-v2 {
9 background-color: pvar(--mainColorVeryLight); 13 background-color: pvar(--mainColorVeryLight);
10 margin: 0; 14 margin: 0;
15 padding-bottom: 10px;
11} 16}
12 17
13my-instance-about-accordion { 18my-instance-about-accordion {
14 display: block; 19 display: block;
15 margin-bottom: 25px; 20 margin-bottom: 30px;
16} 21}
17 22
18.step-buttons { 23.step-buttons {
diff --git a/client/src/app/+signup/+register/register.component.ts b/client/src/app/+signup/+register/register.component.ts
index 396b27e5a..4ab327b1b 100644
--- a/client/src/app/+signup/+register/register.component.ts
+++ b/client/src/app/+signup/+register/register.component.ts
@@ -42,8 +42,8 @@ export class RegisterComponent implements OnInit {
42 moderation: false 42 moderation: false
43 } 43 }
44 44
45 defaultPreviousStepButtonLabel = $localize`:Button on the registration form to go to the previous step:Go to the previous step` 45 defaultPreviousStepButtonLabel = $localize`Go to the previous step`
46 defaultNextStepButtonLabel = $localize`:Button on the registration form to go to the previous step:Go to the next step` 46 defaultNextStepButtonLabel = $localize`Go to the next step`
47 stepUserButtonLabel = this.defaultNextStepButtonLabel 47 stepUserButtonLabel = this.defaultNextStepButtonLabel
48 48
49 signupDisabled = false 49 signupDisabled = false
diff --git a/client/src/app/+signup/+register/steps/register-step-terms.component.html b/client/src/app/+signup/+register/steps/register-step-terms.component.html
index f54ca77e2..cbfb32518 100644
--- a/client/src/app/+signup/+register/steps/register-step-terms.component.html
+++ b/client/src/app/+signup/+register/steps/register-step-terms.component.html
@@ -5,7 +5,7 @@
5 <ng-container i18n> 5 <ng-container i18n>
6 I am at least {{ minimumAge }} years old and agree 6 I am at least {{ minimumAge }} years old and agree
7 to the <a class="link-orange" (click)="onTermsClick($event)" href='#'>Terms</a> 7 to the <a class="link-orange" (click)="onTermsClick($event)" href='#'>Terms</a>
8 <ng-container *ngIf="hasCodeOfConduct"> and to the <a (click)="onCodeOfConductClick($event)" href='#'>Code of Conduct</a></ng-container> 8 <ng-container *ngIf="hasCodeOfConduct"> and to the <a class="link-orange" (click)="onCodeOfConductClick($event)" href='#'>Code of Conduct</a></ng-container>
9 of this instance 9 of this instance
10 </ng-container> 10 </ng-container>
11 </ng-template> 11 </ng-template>
diff --git a/client/src/app/+signup/shared/signup-mascot.component.scss b/client/src/app/+signup/shared/signup-mascot.component.scss
index 5eebfb014..67ab48447 100644
--- a/client/src/app/+signup/shared/signup-mascot.component.scss
+++ b/client/src/app/+signup/shared/signup-mascot.component.scss
@@ -3,7 +3,7 @@
3 3
4.root { 4.root {
5 display: inline-block; 5 display: inline-block;
6 width: 270px; 6 width: 230px;
7} 7}
8 8
9div ::ng-deep svg { 9div ::ng-deep svg {
diff --git a/client/src/app/shared/shared-instance/instance-about-accordion.component.html b/client/src/app/shared/shared-instance/instance-about-accordion.component.html
index 466d73ca4..94077fafa 100644
--- a/client/src/app/shared/shared-instance/instance-about-accordion.component.html
+++ b/client/src/app/shared/shared-instance/instance-about-accordion.component.html
@@ -3,17 +3,26 @@
3<div *ngIf="displayInstanceShortDescription" class="instance-short-description">{{ about?.instance.shortDescription }}</div> 3<div *ngIf="displayInstanceShortDescription" class="instance-short-description">{{ about?.instance.shortDescription }}</div>
4 4
5<ngb-accordion #accordion="ngbAccordion" [closeOthers]="true"> 5<ngb-accordion #accordion="ngbAccordion" [closeOthers]="true">
6 <ngb-panel *ngIf="panels.features" id="instance-features" i18n-title title="Features found on this instance"> 6 <ngb-panel *ngIf="panels.features" id="instance-features">
7 <ng-template ngbPanelTitle>
8 <my-global-icon iconName="playlists"></my-global-icon>
9
10 <ng-container i18n>Features found on this instance</ng-container>
11 </ng-template>
12
7 <ng-template ngbPanelContent> 13 <ng-template ngbPanelContent>
8 <my-instance-features-table></my-instance-features-table> 14 <my-instance-features-table></my-instance-features-table>
9 </ng-template> 15 </ng-template>
10 </ngb-panel> 16 </ngb-panel>
11 17
12 <ng-container *ngIf="about"> 18 <ng-container *ngIf="about">
13 <ngb-panel 19 <ngb-panel *ngIf="getAdministratorsPanel()" >
14 *ngIf="getAdministratorsPanel()" 20 <ng-template ngbPanelTitle>
15 id="admin-sustainability" i18n-title title="Administrators & Sustainability" 21 <my-global-icon iconName="playlists"></my-global-icon>
16 > 22
23 <ng-container i18n>Administrators & Sustainability</ng-container>
24 </ng-template>
25
17 <ng-template ngbPanelContent> 26 <ng-template ngbPanelContent>
18 <div class="block"> 27 <div class="block">
19 <strong i18n>Who are we?</strong> 28 <strong i18n>Who are we?</strong>
@@ -32,25 +41,49 @@
32 </ng-template> 41 </ng-template>
33 </ngb-panel> 42 </ngb-panel>
34 43
35 <ngb-panel *ngIf="termsPanel" id="terms" [title]="getTermsTitle()"> 44 <ngb-panel *ngIf="termsPanel" id="terms">
45 <ng-template ngbPanelTitle>
46 <my-global-icon iconName="playlists"></my-global-icon>
47
48 {{ getTermsTitle() }}
49 </ng-template>
50
36 <ng-template ngbPanelContent> 51 <ng-template ngbPanelContent>
37 <div class="block" [innerHTML]="aboutHtml.terms"></div> 52 <div class="block" [innerHTML]="aboutHtml.terms"></div>
38 </ng-template> 53 </ng-template>
39 </ngb-panel> 54 </ngb-panel>
40 55
41 <ngb-panel *ngIf="moderationPanel" id="moderation-information" i18n-title title="Moderation information"> 56 <ngb-panel *ngIf="moderationPanel" id="moderation-information">
57 <ng-template ngbPanelTitle>
58 <my-global-icon iconName="playlists"></my-global-icon>
59
60 <ng-container i18n>Moderation information</ng-container>
61 </ng-template>
62
42 <ng-template ngbPanelContent> 63 <ng-template ngbPanelContent>
43 <div class="block" [innerHTML]="aboutHtml.moderationInformation"></div> 64 <div class="block" [innerHTML]="aboutHtml.moderationInformation"></div>
44 </ng-template> 65 </ng-template>
45 </ngb-panel> 66 </ngb-panel>
46 67
47 <ngb-panel *ngIf="codeOfConductPanel" id="code-of-conduct" i18n-title title="Code of conduct"> 68 <ngb-panel *ngIf="codeOfConductPanel" id="code-of-conduct">
69 <ng-template ngbPanelTitle>
70 <my-global-icon iconName="playlists"></my-global-icon>
71
72 <ng-container i18n>Code of conduct</ng-container>
73 </ng-template>
74
48 <ng-template ngbPanelContent> 75 <ng-template ngbPanelContent>
49 <div class="block" [innerHTML]="aboutHtml.codeOfConduct"></div> 76 <div class="block" [innerHTML]="aboutHtml.codeOfConduct"></div>
50 </ng-template> 77 </ng-template>
51 </ngb-panel> 78 </ngb-panel>
52 79
53 <ngb-panel *ngFor="let pluginPanel of pluginPanels" [id]="pluginPanel.id" [title]="pluginPanel.title"> 80 <ngb-panel *ngFor="let pluginPanel of pluginPanels" [id]="pluginPanel.id">
81 <ng-template ngbPanelTitle>
82 <my-global-icon iconName="playlists"></my-global-icon>
83
84 <ng-container i18n>{{ pluginPanel.title }}</ng-container>
85 </ng-template>
86
54 <ng-template ngbPanelContent> 87 <ng-template ngbPanelContent>
55 <div class="block" [innerHTML]="pluginPanel.html"></div> 88 <div class="block" [innerHTML]="pluginPanel.html"></div>
56 </ng-template> 89 </ng-template>
diff --git a/client/src/app/shared/shared-instance/instance-about-accordion.component.scss b/client/src/app/shared/shared-instance/instance-about-accordion.component.scss
index c8e288462..9174f40c7 100644
--- a/client/src/app/shared/shared-instance/instance-about-accordion.component.scss
+++ b/client/src/app/shared/shared-instance/instance-about-accordion.component.scss
@@ -14,3 +14,9 @@
14.block { 14.block {
15 margin-bottom: 15px; 15 margin-bottom: 15px;
16} 16}
17
18my-global-icon {
19 line-height: 24px;
20 margin-right: 15px;
21}
22
diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss
index 49585a124..688407683 100644
--- a/client/src/sass/bootstrap.scss
+++ b/client/src/sass/bootstrap.scss
@@ -249,6 +249,18 @@
249 } 249 }
250} 250}
251 251
252.accordion-button {
253 font-size: 18px;
254
255 &:not(.collapsed) {
256 font-weight: $font-bold;
257
258 my-global-icon {
259 color: pvar(--mainColorLighter);
260 }
261 }
262}
263
252// --------------------------------------------------------------------------- 264// ---------------------------------------------------------------------------
253// Buttons & form controls 265// Buttons & form controls
254// --------------------------------------------------------------------------- 266// ---------------------------------------------------------------------------
diff --git a/client/src/sass/class-helpers.scss b/client/src/sass/class-helpers.scss
index 2d7e0cce9..c67179ccb 100644
--- a/client/src/sass/class-helpers.scss
+++ b/client/src/sass/class-helpers.scss
@@ -5,10 +5,10 @@
5 5
6.link-orange { 6.link-orange {
7 color: pvar(--mainForegroundColor); 7 color: pvar(--mainForegroundColor);
8 font-weight: $font-bold; 8 font-weight: $font-semibold;
9 border-bottom: 0.19em solid pvar(--mainColor); 9 border-bottom: 0.18em solid pvar(--mainColor);
10 display: inline-block; 10 display: inline-block;
11 line-height: 1.2; 11 line-height: 1.1;
12 12
13 &:hover { 13 &:hover {
14 color: pvar(--mainForegroundColor); 14 color: pvar(--mainForegroundColor);
diff --git a/client/src/sass/include/_bootstrap-variables.scss b/client/src/sass/include/_bootstrap-variables.scss
index 7885e067c..3e461dbef 100644
--- a/client/src/sass/include/_bootstrap-variables.scss
+++ b/client/src/sass/include/_bootstrap-variables.scss
@@ -49,3 +49,5 @@ $dropdown-link-active-bg: pvar(--mainBackgroundHoverColor);
49 49
50$accordion-button-active-bg: pvar(--mainColorVeryLight); 50$accordion-button-active-bg: pvar(--mainColorVeryLight);
51$accordion-button-active-color: pvar(--mainForegroundColor); 51$accordion-button-active-color: pvar(--mainForegroundColor);
52$accordion-button-focus-border-color: pvar(--mainColorLightest);
53$accordion-button-focus-box-shadow: 0 0 0 .15rem pvar(--mainColorLightest);